在Asp.net中顯示iframe中的特定頁面

Question

我有一個ASP.NET C＃應用程序。我在iframe內的特定頁面上顯示PDF文件。我需要基於文本框的值顯示PDF的特定頁面。我怎樣才能做到這一點？

iframe的代碼如下所示：

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

及以下爲文字框的細節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); 

     } 

的

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

詳細但這不是加工。它在「childiFrame.contentWindow.location.href」處給出錯誤，如請求訪問的幀具有協議「http」，被訪問的幀具有協議「https」。協議必須匹配。

我該如何擺脫錯誤？而且我在頁面中傳遞頁面號作爲參數。如何在不刷新整個內容的情況下顯示新頁面？

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

在下面顯示的兩種方法中，當焦點離開文本框時，本地PDF會在iframe中以選定頁碼打開。

方法1

在該方法中，在iframe源URL在兩個步驟中設置。第一步重置源，第二步將其設置爲實際的URL。這第二步必須異步執行才能工作（這裏有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）新的iframe插入到舊的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); 
}