Twain Scanner. Extension for scan paper documents from scanner device and send base64 on page web application. 1) Install…
Twain Scanner. Extension for scan paper documents from scanner device and send base64 on page web application.
1) Install extension, tap "Install" and complete all steps.
2) Restart browser
3) In the drop-down menu you will see list scanners, if not, sure that you installed device or you can set "Show Twain" as virtual scanner for test.
4) Inside <body> on your web page you will see <div class="twain_container"> where base64 will be inserted and comment how declare listener.
Details see "How To".
Latest reviews
- (2022-02-09) AbdulAziz Alotaibi: لا يوجد دليل مفصل للاستخدام
- (2021-10-07) Aldo Jiménez: it's functional I just need a change in some things. inside the function enter this code: const iframe = document.querySelectorAll('iframe'); const images = iframe[0].contentWindow.document.body.querySelectorAll('img'); let index = 0; let htmlCustom = ""; images.forEach( img => { if ( index > 0 ) htmlCustom += `<div class="col-md-12"><img src="${img.src}" style="width: 150px; height: 150px;"class="thumbnail img-responsive"></div>`; index++; }); document.getElementById("separator").innerHTML = htmlCustom ;
- (2020-01-16) Ahmed Ali: Here is the working code https://gist.github.com/ahmedali5530/584417f6eb4d6acca7ac4ffd1809681f
- (2019-05-25) Mohamad Yahia: Works really well, thank you very much. The code included in the div tag to detect that an image was scanned wasn't working, took a while to figure it out but I found out how to make it work in the end. Here's the code I used: <img id="currentImage" src="" style="height: 200px" /> <script> $(function() { $('body', $('#popup_iframe').contents()[0]).on('DOMNodeInserted', '#thumbnail_chain', function() { //alert('node was inserted') var imageSrc = $(this).find('img').slice(-1)[0].src; // get last img element (latest) $('#currentImage').attr('src', imageSrc) } ) }) // and to upload use this code: $('#bSave').click(function() { if ($('#currentImage').attr('src') != null && $('#currentImage').attr('src') != '') { var currentImageSrcString = $('#currentImage').attr('src'); var filename = 'Scan.png'; fetch(currentImageSrcString) .then(res => res.blob()) .then(blob => { const file = new File([blob], filename, { type: 'image/png' }); var fd = new FormData(); fd.append("image", file); $.ajax({ type: "POST", //enctype: 'multipart/form-data', url: postFileUrl, data: fd, processData: false, contentType: false, cache: false, success: finishedUploading, error: function (xhr, status, error) { alert(xhr.responseText); } }); }); } }); </script>
- (2019-01-30) Candace Rogers: Doesn't work.
- (2018-05-12) Tom Litzinger: was not functional.