やりたいこと
同期できな処理であるループの中で非同期処理を挟む中で、非同期処理の終了を待ってループを処理をしたいと考えております。
試したことと得たこと
以下のコードでtableの中の要素をappendしていきたいのですが、実装の過程でextractTextの中身が正しく要素として追加できないことがわかりました。なぜであろうとずっと調べていくうちに、ライブラリで利用しているpdf.jsにおいてpromiseで非同期処理を行っていることにより通常の同期処理部分である//hereを追い越して処理してしまっていることが原因であることがわかりました。awaitを使用することで処理を待たせることができるというのは調べることができたのですが、functionの中でawait table_content_add += text.match(reg_code) !== null ? "<td>" + text.match(reg_code)[1] + "</td>" : "<td>-</td>";でもうまくいかず、この使い方について特に理解できずアドバイスをいただきたいと考えとております。
補足
一つの考え方として、すべてextractTextのthenの中でループを回して処理すればいいという考え方もあると考えたのですが、前後のほかの処理やコードの改変を踏まえて、一旦forの同期ループの中で、非同期のextractTextが終わるまで次にすすまない解決方法がないかというところでご質問させていただきました。
何卒、よろしくお願い申し上げます。
JavaScript
1//index.js2for (i = 0; i < len; i++) {3 var table_content_add = "";4 var ary_contents = []5 6 table_content_add += "<tr>";//here7 table_content_add += "<td>" + name[i] + "</td>";//here8 table_content_add += "<td>" + modified_date[i] + "</td>";//here9 10 extractText(url[i]).then(11 function (text) {12 table_content_add += text.match(reg_code) !== null ? "<td>" + text.match(reg_code)[1] + "</td>" : "<td>-</td>";13 table_content_add += text.match(reg_company) !== null ? "<td>" + text.match(reg_company)[1] + "</td>" : "<td>-</td>";14 $('.export').append(table_content_add);15 },16 function (reason) {17 alert("Error:" + reason);18 },19 );20 table_content_add += "</tr>";//here21 $('table').append(table_content_add);//here22}23 24 25//extract.js26pdfjsLib.GlobalWorkerOptions.workerSrc = './lib/pdfjs-dist-master/build/pdf.worker.js';27function extractText(pdfUrl) {28 var pdf = pdfjsLib.getDocument(pdfUrl);29 return pdf.promise.then(function (pdf) {30 var totalPageCount = pdf.numPages;31 var countPromises = [];32 for (33 var currentPage = 1;34 currentPage <= totalPageCount;35 currentPage++36 ) {37 var page = pdf.getPage(currentPage);38 countPromises.push(39 page.then(function (page) {40 var textContent = page.getTextContent();41 return textContent.then(function (text) {42 return text.items43 .map(function (s) {44 return s.str;45 })46 .join('');47 });48 }),49 );50 }51 52 return Promise.all(countPromises).then(function (texts) {53 return texts.join('');54 });55 });56 }

0 コメント