하루종일 했는데,,,

by 데브수달 2023. 10. 9. 01:44

728x90

const express = require('express');
   const multer = require('multer');
   const { createWorker } = require('tesseract.js');
   
   const app = express();
   const port = 3000;
   
   // 이미지 업로드를 위한 설정
   const storage = multer.memoryStorage();
   const upload = multer({ storage: storage });
   
   // 정적 파일 서빙 (예: CSS, 이미지 등)
   app.use(express.static('public'));
   
   // 루트 경로에 대한 GET 요청 처리
   app.get('/', (req, res) => {
       res.send('Hello, World!');
   });
   
   // 이미지 업로드 및 처리 엔드포인트
   app.post('/upload', upload.single('image'), async (req, res) => {
       try {
           if (!req.file) {
               return res.status(400).json({ error: '이미지를 업로드해주세요.' });
           }
   
           // 이미지 처리 및 번호판 인식 코드 작성
           const worker = createWorker();
           await worker.load();
           await worker.loadLanguage('eng');
           await worker.initialize('eng');
           const { data: { text } } = await worker.recognize(req.file.buffer);
           await worker.terminate();
   
           // 인식된 번호를 클라이언트에 반환
           res.json({ recognizedNumber: text });
       } catch (error) {
           console.error('에러:', error);
           res.status(500).json({ error: '서버 에러' });
       }
   });
   
   app.listen(port, () => {
       console.log(`서버가 http://localhost:${port}에서 실행 중입니다.`);
   });

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>차량 번호 인식</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>차량 번호 인식</h1>
    <form enctype="multipart/form-data" action="/upload" method="POST" id="upload-form">
        <input type="file" name="image" id="fileInput" accept=".jpg, .jpeg, .png">
        <button type="submit">이미지 업로드</button>
    </form>
    <div id="resultDiv">
        <h2>인식된 번호:</h2>
        <p id="recognizedNumber"></p>
    </div>
    

    <script src="http://localhost:3000/app.js"></script>
</body>
</html>

body {
    font-family: Arial, sans-serif;
    text-align: center;
    margin: 20px;
}

h1 {
    color: #333;
}

form {
    margin: 20px auto;
    max-width: 300px;
}

input[type="file"] {
    display: none;
}

button {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
}

#resultDiv {
    margin: 20px auto;
    max-width: 400px;
    border: 1px solid #ccc;
    padding: 20px;
    display: none;
}

#resultDiv h2 {
    font-size: 18px;
    color: #333;
}

#recognizedNumber {
    font-size: 24px;
    color: #007bff;
}

이미지를 업로드하면 해당 이미지의 차량번호 인식을 해주는 웹사이트를 만드는 중이나,,,,

nodejs 설치 후, 여러 서버 호스팅 시도 끝에 서버에서 작동하고 불러와줘야하는데, 못 불러오고 연결이 안되는 중에 있다.

728x90

'[일기]일상이모저모' 카테고리의 다른 글

가족 구성원을 소개할 때 사용할 수 있는 영단어 (0)	2023.10.11
차량 번호 인식 웹사이트 만들기 (0)	2023.10.09
차량번호 이미지센싱 어플 만들기 (1)	2023.10.08
[구몬 ] 성인화상영어1주차 후기 (2)	2023.10.05
창의적인 사고로 어려움을 해결한 다섯 가지 사례 (1)	2023.09.30