Asp.netのiframe内にPDFの特定のページを表示

Question

私はASP.NET C＃アプリケーションを持っています。 iframe内の特定のページにPDFファイルを表示しています。私はテキストボックスの値に基づいてPDFの特定のページを表示する必要があります。どうすればこれを達成できますか？

のiframeコードは次のようになります。

<iframe runat="server" id="lobjPDFObj" height="600" width="800" > </iframe> 

と、次のテキストボックスの詳細

<asp:TextBox ID="txtTo" runat="server" Text="1" class="page_txtbox" onfocus="synchronizePDF(this);" ></asp:TextBox> 

javascript関数の詳細

function synchronizePDF(Field) { 
      //parent.document.getElementById('lobjPDFObj').setCurrentPage(Field.value); 
     var childiFrame = parent.document.getElementById('lobjPDFObj');   
     var URL = childiFrame.contentWindow.location.href; 
     //var URL = childiFrame.src;    
     var pos = URL.indexOf('#page'); 
     if (pos < 0) pos = URL.length; 
     var result = URL.substring(0, pos); 
     if (URL != 'about:blank') { 
      result += '#page=' + Field.value; 
     } 
     childiFrame.contentWindow.location.reload(true); 
     childiFrame.contentWindow.location.href = result; 
     //childiFrame.src = result; 
     //parent.document.getElementById('lobjPDFObj').setAttribute("src", result); 

     } 

しかし、これではないですワーキング。 "childiFrame.contentWindow.location.href"にエラーがあります。アクセスを要求するフレームには "http"というプロトコルがあり、アクセスされるフレームには "https"というプロトコルがあります。プロトコルは一致する必要があります。

エラーを取り除くにはどうすればよいですか？そして、私はURLにパラメターとしてページnoを渡しています。コンテンツ全体をリフレッシュせずに新しいページを表示するにはどうすればよいですか？

Answer 1

The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must matchここではError trying to access a iframe in JavaScript iframeは相手側のコンテンツを表示できますが、セキュリティ上のリスクを引き起こす可能性があるため、変更することはできません。 iframeの内容を変更したい場合は、同じドメインのソースを指定する必要があります（詳細はCORSを参照してください）。

別の方法は、他のドメインのクロスソースリソース共有を許可することです。このトピックに関する

Access-Control-Allow-Origin: https://www.test-doc.com 

詳細情報：http://enable-cors.org/server_aspnet.html、http://docs.asp.net/en/latest/security/cors.htmlあなたは特別なヘッダーを指定する必要があることを行うために。

Answer 2

以下の両方の方法では、フォーカスがTextBoxを離れるときに、選択したページ番号でiframeにローカルPDFが開きます。

方法1

この方法では、IFRAMEソースURLは、2つのステップで設定されています。最初のステップはソースをリセットし、2番目のステップはソースを実際のURLに設定します。この2番目のステップは、作業のために非同期で実行する必要があります（ここではsetTimeoutの助けを借りて）。

IFRAMEとテキストボックスのマークアップ：

<iframe id="iframePdfViewer" name="iframePdfViewer" width="700px" height="700px" ></iframe> 
<asp:TextBox ID="txtPageNumber" runat="server" Text="1" onchange="showPDF(this.value);" /> 

Javascript機能：

function showPDF(pageNumber) { 
    var iframe = document.getElementById("iframePdfViewer"); 
    iframe.src = ''; 
    setTimeout(function() { iframe.src = 'MyFolder/MyDoc.pdf#page=' + pageNumber }, 0); 
} 

方法2

この方法では、IFRAME、新しいに置き換えられPDFの新しいページが表示されるたびに1つずつ表示されます。画面のちらつきを軽減するには、（1）新しいiframeが古いものの下に挿入され、（2）新しいiframeが完全に読み込まれたときにのみ古いiframeが削除されます。

マークアップ：

<div id="divPdfViewer" style="position: relative; width: 700px; height: 700px;"></div> 
<asp:TextBox ID="txtPageNumber" runat="server" Text="1" onchange="showPDF(this.value);" /> 

Javascriptコード：

function showPDF(pageNumber) { 
    var divPdfViewer = document.getElementById('divPdfViewer'); 
    var ifrm = document.createElement("IFRAME"); 
    ifrm.id = 'iframePdfViewer'; 
    ifrm.style.position = 'absolute'; 
    ifrm.style.width = '100%'; 
    ifrm.style.height = '100%'; 
    var oldPdfViewer = divPdfViewer.firstChild; 
    if (oldPdfViewer) { 
     ifrm.onload = function() { divPdfViewer.removeChild(oldPdfViewer); }; 
     // Replace the line above by the line below if support for IE is required 
     // setTimeout(function() { divPdfViewer.removeChild(oldPdfViewer); }, 100); 
     divPdfViewer.insertBefore(ifrm, oldPdfViewer); 
    } 
    else { 
     divPdfViewer.appendChild(ifrm); 
    } 
    ifrm.setAttribute("src", 'MyFolder/MyDoc.pdf#page=' + pageNumber); 
}