Q&A
前提・実現したいこと
Monaca で Tesseract.js を使用したアプリを作っているのですが、 画像をアップロードしたところでエラーが出てきました。 VScodeにコードを張り付けて、googleブラウザで実行すると問題なく動作しました。 Monaca上では動作してくれないので、何か仕様が違うのでしょうか？
発生している問題・エラーメッセージ
Script error. （行番号などの記載なし）
該当のソースコード
JavaScript
1<!DOCTYPE HTML> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"> 6 <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> 7 <script src="components/loader.js"></script> 8 <script src="lib/onsenui/js/onsenui.min.js"></script> 9 10 <script src='https://cdn.rawgit.com/naptha/tesseract.js/1.0.10/dist/tesseract.js'></script> 11 12 <!-- <script src="js/camera.js"></script> --> 13 <!-- <script src="js/analyze.js"></script> --> 14 15 16 <link rel="stylesheet" href="components/loader.css"> 17 <link rel="stylesheet" href="lib/onsenui/css/onsenui.css"> 18 <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css"> 19 <link rel="stylesheet" href="css/style.css"> 20 21 <script> 22 ons.ready(function() { 23 console.log("Onsen UI is ready!"); 24 }); 25 26 if (ons.platform.isIPhoneX()) { 27 document.documentElement.setAttribute('onsflag-iphonex-portrait', ''); 28 document.documentElement.setAttribute('onsflag-iphonex-landscape', ''); 29 } 30 </script> 31</head> 32<body> 33 34 <ons-navigator id="navigator" page="index.html"></ons-navigator> 35 36 <template id="index.html"> 37 <ons-page id="indexPage"> 38 <br> 39 <br> 40 <div> 41 <input type="file" id="uploader"> 42 </div> 43 <div> 44 進捗: <span id="progress">0</span>% 45 </div> 46 <div> 47 <textarea id="ocrResult" style="height: 300px;width:300px;"></textarea> 48 </div> 49 50 <script> 51 const recognize = function (evt) { 52 const files = evt.target.files; 53 if (files.length == 0) { 54 return; 55 } 56 57 Tesseract 58 .recognize(files[0], { lang: 'jpn', tessedit_pageseg_mode: "RAW_LINE" }) 59 .progress(function (p) { 60 // 進歩状況の表示 61 let progressArea = document.getElementById("progress"); 62 progressArea.innerText = p.status + " " + Math.round(p.progress * 100) + "%"; 63 }) 64 .then(function (result) { 65 // 結果の表示 66 let textarea = document.getElementById("ocrResult"); 67 textarea.value = result.text; 68 }); 69 } 70 const elm = document.getElementById('uploader'); 71 elm.addEventListener('change', recognize); 72 </script> 73 </ons-page> 74 </template> 75</body> 76</html> 77
試したこと
Monacaではなく、VScodeにソースを貼り付けてブラウザで実行してみると問題なく動作しました。
あなたの回答
tips
プレビュー
