如何連結至外部網頁 (HTML)
[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App,請參閱 最新文件 ]
了解如何連結至外部網頁,並讓它們顯示在您的應用程式中。
先決條件
- 我們假設您知道如何建立基本的應用程式。如果您需要相關協助,請參閱使用 JavaScript 建立您的第一個應用程式。
指示
連結至外部網頁
若要連結到外部網頁,只需要在您的 HTML 加入一個超連結就可以了。 這個範例會建立 www.bing.com 的連 結。當您按一下連結時,它會在網頁瀏覽器中開啟 (而不是在您的應用程式中)。
<p><a href="https://www.bing.com">Search the web</a></p>
在您的應用程式顯示外部網頁
您的應用程式可以在 iframe 中顯示外部網頁,但是您不能從您的最上層頁面瀏覽到外部網頁。
在您的應用程式顯示外部網頁
建立 iframe 來顯示網頁。設定 iframe 元素的 name 屬性。
<iframe name="targetFrame"> </iframe>
建立外部網站的連結。將它的 target 屬性設定為您在上一個步驟中建立的 iframe 名稱。
<p><a href="https://www.bing.com" target="targetFrame" >Search the web</a></p> <iframe name="targetFrame"> </iframe>
當您執行應用程式並按一下連結時,便會在您的應用程式內部開啟該連結。 頁面會在網路內容中執行,而且相較於應用程式套件所含的頁面,該頁面只有有限的系統存取能力。
以 iframe 顯示外部網頁時,最好能夠提供在網頁發生問題時顯示的自訂錯誤網頁。如需如何執行這項操作的範例,請參閱 XHR、處理瀏覽錯誤及 URL 配置範例。
注意 基於效能的理由,Windows 市集應用程式可能會無限期地快取遠端內容。因此,您的應用程式可能不會顯示最新的指令碼或 CSS 更新。先解除安裝應用程式之後再重新安裝即可清除快取。其他解決方案包括在查詢字串中使用隨機參數,或設定網頁伺服器使其不會進行快取。如需詳細資訊,請參閱如何防止在 Internet Explorer 中進行快取。
關於本機和網路內容
您在應用程式本身包含的頁面一般都是在應用程式的本機內容中執行。當您使用 iframe 來瀏覽遠端頁面時,該頁面會在網路內容中執行,並且只有有限的系統存取能力。
本機內容頁面和指令碼可存取的功能與網路內容頁面和指令碼不同。例如,它們可以存取 Windows 執行階段以及執行跨網域的 XHR 要求。本機內容頁面和網路內容頁面都可以存取適用於 JavaScript 的 Windows Library。
如需本機和網路內容頁面可使用的不同功能詳細資訊,請參閱受內容影響的功能和限制。
您可以使用應用程式套件資訊清單的 ApplicationContentUriRules 區段,讓網路內容中的頁面不但可以存取您系統的地理位置裝置 (如果您的應用程式有權存取此功能),還可以存取剪貼簿。
為網路內容頁面提供其他存取權
若要為網路內容中的頁面提供其他存取權,您可以建立內容 URI 規則。在 Microsoft Visual Studio 方案總管中,用滑鼠右鍵按一下應用程式的 package.appxmanifest 檔案,然後選取 [設計工具檢視]。 隨即顯示資訊清單設計工具。
在 [URI]**** 欄中,指定要包含的網頁 URI。
有多種方法可以指定 URI 比對:
- 您可以指定完全相符的主機名稱
- 您可以指定一個主機名稱,讓含子網域的 URI 可以包含或排除這個主機名稱
- 您可以指定完全相符的 URI
- 您可以指定包含查詢屬性的完全相符 URI
- 您可以針對包含規則指定局部路徑,並使用萬用字元來表示特定的副檔名。
- 排除規則可以使用相對路徑,但包含規則不行。
在這個範例中,請將 URI 設定為
https://www.bing.com/*
。注意 如果您有一個以上的子網域,您必須針對每個子網域使用一個萬用字元。 例如,"https://*.microsoft.com" 與 "https://"any".microsoft.com" 相符,但與 "https://"this"."any".microsoft.com" 不相符。
[規則] 下拉式清單可讓您指定要包含或排除 URI。將它設成 [包含]****。
按一下 [加入新的 URI] 加入規則。設計工具會在背景將一個新的 Rule 元素加入到套件資訊清單檔案的 ApplicationContentUriRules 區段。
<ApplicationContentUriRules> <Rule Match="https://www.bing.com/*" Type="include" /> </ApplicationContentUriRules>
從網路內容頁面瀏覽到本機內容頁面
您不能從網路內容頁面返回本機內容頁面,除非您從本機內容頁面呼叫 MSApp.addPublicLocalApplicationUri,並將您想讓網路內容頁面能夠瀏覽的網頁 URI 傳送給它。例如,如果您希望網路內容頁面能夠瀏覽到您應用程式中名為 "page2.html" 的頁面時,請使用下列程式碼:
MSApp.addPublicLocalApplicationUri("page2.html");
網路內容頁面現在可以瀏覽到 page2.html。針對要讓網路內容頁面能夠存取的本機內容頁面,您必須在每個本機內容頁面呼叫一次這個方法。
警告 如果您有一個接受查詢參數的頁面,而且也允許從網路上任何地方瀏覽它,那個外部網頁可能會傳送惡意的查詢參數。