CODE
BÀI VIẾT
<!DOCTYPE html> <html lang="vi"> <head> <meta charset="UTF-8"> <title>OCR tiếng Việt với Tesseract.js</title> <script src="https://cdn.jsdelivr.net/npm/tesseract.js@5/dist/tesseract.min.js"></script> <style> body { font-family: Arial, sans-serif; max-width: 600px; margin: 50px auto; } .result { margin-top: 20px; white-space: pre-wrap; background: #f4f4f4; padding: 10px; border-radius: 5px; } progress { width: 100%; height: 20px; margin-top: 10px; } </style> </head> <body> <h2>Chuyển hình ảnh sang text (Tiếng Việt)</h2> <input type="file" id="fileInput" accept="image/*"><br><br> <button id="startBtn">Bắt đầu OCR</button> <progress id="progress" value="0" max="1"></progress> <div id="status"></div> <h3>Kết quả:</h3> <div class="result" id="resultText"></div> <script> document.getElementById('startBtn').addEventListener('click', () => { const file = document.getElementById('fileInput').files[0]; if (!file) { alert("Vui lòng chọn ảnh trước!"); return; } document.getElementById('resultText').textContent = ''; document.getElementById('status').textContent = 'Đang xử lý...'; document.getElementById('progress').value = 0; Tesseract.recognize( file, 'vie', // Ngôn ngữ tiếng Việt { logger: m => { console.log(m); if (m.status === 'recognizing text') { document.getElementById('progress').value = m.progress; } document.getElementById('status').textContent = m.status; } } ).then(({ data: { text } }) => { document.getElementById('resultText').textContent = text; document.getElementById('status').textContent = 'Hoàn thành'; }).catch(err => { console.error(err); document.getElementById('status').textContent = 'Có lỗi xảy ra!'; }); }); </script> </body> </html>
Đọc text trong hình ảnh
Html & Css
,
Javascript
ihoan
đã viết 8 tháng trước
600
Bài viết cùng chủ đề
Hiển thị menu khi click chuột phải như ở màn hình máy tính
Căn giữa Hình ảnh, thẻ Div, Text trong CSS
Nhập vào input hiển thị số dạng rút ngắn theo đơn vị
Hiệu ứng zoom, phóng to hình ảnh khi đưa chuột vào
Ẩn bớt nội dung và thêm dấu 3 chấm khi nội dung quá dài
Code chuyển Html sang Markdow
Crop hình ảnh bằng CSS đơn giản và cần thiết
Xóa bỏ gạch chân cho link trong html css
Tạo mã QR với thư viện QRcode
Cách để tạo một Modal, Popup bằng HTML, CSS, JS cơ bản