表示ページ番号とともにPDFの検索テキストを表示

Question

私はPDFファイルがあり、そのファイル内の特定のテキストを検索するソリューションを探していました。その検索テキストの結果はリスト形式で表示されますそのページ番号が付いています。私はオンラインソリューションを探しましたが、それに完璧かつ適切な解決策を見つけることができませんでした...

アドビリーダーで利用できる同じタイプの機能がありますが、ユーザーはすべての検索項目を見ることができる「コメント」と呼ばれますページ番号とともにリスト形式で表示されます。

は、事前にありがとう...

あなたの答えは私にとって本当に役立つだろうし、可能な場合は、あまりにも例を提供してください。

Answer 1

ここでは、PDF.jsを使用してページごとにグループ化された検索済みテキストを表示するのに役立つ例を示します。

var searchText = "JavaScript"; 
 
function searchPage(doc, pageNumber) { 
 
    return doc.getPage(pageNumber).then(function (page) { 
 
    return page.getTextContent(); 
 
    }).then(function (content) { 
 
    // Search combined text content using regular expression 
 
    var text = content.items.map(function (i) { return i.str; }).join(''); 
 
    var re = new RegExp("(.{0,20})" + searchText + "(.{0,20})", "gi"), m; 
 
    var lines = []; 
 
    while (m = re.exec(text)) { 
 
     var line = (m[1] ? "..." : "") + m[0] + (m[2] ? "..." : ""); 
 
     lines.push(line); 
 
    } 
 
    return {page: pageNumber, items: lines}; 
 
    }); 
 
} 
 

 
var loading = PDFJS.getDocument("//cdn.mozilla.net/pdfjs/tracemonkey.pdf"); 
 
loading.promise.then(function (doc) { 
 
    var results = []; 
 
    for (var i = 1; i <= doc.numPages; i++) 
 
    results.push(searchPage(doc, i)); 
 
    return Promise.all(results); 
 
}).then(function (searchResults) { 
 
    // Display results using divs 
 
    searchResults.forEach(function (result) { 
 
    var div = document.createElement('div'); div.className="pr"; document.body.appendChild(div); 
 
    div.textContent = 'Page ' + result.page + ':'; 
 
    result.items.forEach(function (s) { 
 
     var div2 = document.createElement('div'); div2.className="prl"; div.appendChild(div2); 
 
     div2.textContent = s; 
 
    }); 
 
    }); 
 
}).catch(console.error);

.pr { font-family: sans-serif; font-weight: bold; } 
 
.prl { font-style: italic; font-weight: normal; }

<script src="//npmcdn.com/pdfjs-dist/build/pdf.js"></script>