none
load external web page ( X-Frame-Options )

    Pertanyaan

  • Hi, guys

    I'm facing problems to load external web page using iframe.

    <iframe id="frame" src='http://www.google.com/'></iframe>

    Error : APPHOST9613: The App Host was unable to navigate to http://www.google.com/ due to the following error: FORBIDFRAMING.

    I know that 'google.com' has 'X-Frame-Options' metadata in response header. iframe can't load that page. but I have to load web page 'google.com'.

    Is there any solution to load external web page? 











    02 Mei 2012 4:54

Jawaban

  • WebView is specificially a XAML control; it won't be accessible to JavaScript (but is to other languages). iframe is the analagous element in HTML, but as you have seen, there are some functional differences.

    Do realize that with both options, the intent is to assist Metro style apps with incorporating web content into their own context, and not to provide a generic browsing experience within the app. The Windows Store policy specifically disallows the latter, because such content won't generally go into snap view well, or necessaily respond to touch input consistently, thereby giving a sub-standard user experience.

    This is why I'm interested in knowing what kind of scenario would require full access to external web pages like you mention. If you're just experimenting, then the result of the experiment is that this restriction with iframe is a simply characteristic of the web platform on which JS apps run, with no mitigation. WebView's behavior is a characteristic of the XAML UI layer.

    02 Mei 2012 13:53
  • Hi Cookey,

    OAuth is supported.  See this sample: Web authentication broker sample

    -Jeff


    Jeff Sanders (MSFT)

    09 Juli 2012 12:38

Semua Balasan

  • The X-Frame-Options metadata is a choice of the web page to decide whether it will allow itself to be placed in an iframe. The app host for Metro style apps is honoring that wish from such a web page, and there is no way to avoid this so far as I know.

    I would have to ask, however, what is so crucial to having the google.com homepage show up in your app? If it's in an iframe, then that means you're allowing arbitrary search results and therefore arbitrary web browsing within your app--to what end? I'd like to know what kind of functionality this is bringing to the app itself, especially since those arbitrary pages will not be in a position to communicate anything to the app. Why not just run the Metro style browser?

    If you need in-situ web search, why not just rely on the Search charm and choosing an app like IE or some other browser to fulfill the task?

    Alternately, if Google is blocked from this use, and you absolutely need in-situ web search, you could look at another search engine that isn't so restrictive (Bing works, for instance).

    .Kraig

    02 Mei 2012 5:49
  • Thank you to reply.

    "Google.com" is just example. I want to use WebView Class.

    XMAL's WebView class can load every external web page. Just viewing external web page on application. (ex. ios and android has WebView Class too.)

    Is there any plan to add WebView Class in Javascript Project?

    02 Mei 2012 8:15
  • WebView is specificially a XAML control; it won't be accessible to JavaScript (but is to other languages). iframe is the analagous element in HTML, but as you have seen, there are some functional differences.

    Do realize that with both options, the intent is to assist Metro style apps with incorporating web content into their own context, and not to provide a generic browsing experience within the app. The Windows Store policy specifically disallows the latter, because such content won't generally go into snap view well, or necessaily respond to touch input consistently, thereby giving a sub-standard user experience.

    This is why I'm interested in knowing what kind of scenario would require full access to external web pages like you mention. If you're just experimenting, then the result of the experiment is that this restriction with iframe is a simply characteristic of the web platform on which JS apps run, with no mitigation. WebView's behavior is a characteristic of the XAML UI layer.

    02 Mei 2012 13:53
  • A common reason is when using something like oauth get access to the Google Apis, you get a url to allow the user to authenticate without you handling their username and password this is a secure way of getting access to someone's account, however this restriction is currently blocking this way of doing it although its still possible by popping up a browser and getting the the user to copy and paste the authentication token - not as nice functionality.

    .

    08 Juli 2012 22:32
  • Hi Cookey,

    OAuth is supported.  See this sample: Web authentication broker sample

    -Jeff


    Jeff Sanders (MSFT)

    09 Juli 2012 12:38
  • This works great, thanks for the help!
    02 Agustus 2012 12:44