locked
Is it possible to retrieve HTML source of the external server pages loaded inside an IFrame in metro-style HTML/JavaScript app?

    Question

  • We have a HTML/JavaScript metro style app, in which we have a local HTML page named IFrame.html containing an IFrame tag. The app navigates to this local IFrame.html file whenever it needs to host any external URLs inside the IFrame. The app registers for the IFrame element’s “readystatechange” event and identifies the page load completion by checking if the readyState value is complete.

    If we attempt to navigate to another local HTML page inside the IFrame and try to retrieve the HTML source through IFrame element’s contentDocument.documentElement.innerHTML node, we’re able to retrieve the HTML source of the page loaded in the IFrame. However, if we navigate to some other external website, for e.g.” http://www.bing.com/”, we’re not able to access IFrame element’s contentDocument node (displays Access is denied in debugger). Also, some of the https website such as “https://www.google.com/” and “https://www.bing.com/”, even fails to load in the IFrame.

    However, the https website we are trying to reach does get loaded in the IFrame, but we are not able to retrieve the HTML source of the page due to access denied error on IFrame element’s contentDocument node. Since we're able to retrieve the HTML source for the local pages and not for the external URLs, appears to me, somewhat like a cross-domain restriction with JavaScript.

    Is this a limitation with HTML/JavaScript metro style apps or is there a way around to retrieve the HTML source of the external server pages loaded in IFrame? As FYI, I was able to retrieve the HTML source of the server page using a C++/XAML sample metro style application.



    • Edited by win8devuser Wednesday, August 29, 2012 6:20 PM
    Wednesday, August 29, 2012 3:35 PM

Answers

  • There will be a performance hit.  It will be difficult to create your own webbrowser in an application and this is in essence what you are trying to do.

    You will need to get the HTML source, parse it, ensure it is safe, wire your own event handlers for things you want to effect etc...

    If this is all on an internal server, why don't you just convert the user interface and bring it all local?  That would work much better and perform great!  Don't try and cram a web based application into your application.  Take time and design it carefully to take advantage of the touch UI, controls and designs of the new app style!

    -Jeff


    Jeff Sanders (MSFT)

    Thursday, August 30, 2012 6:54 PM
    Moderator

All replies

  • You can execute the URL and parse the HTML yourself.  Something similar to what is talked about in this page: http://msdn.microsoft.com/en-us/library/windows/apps/hh452745.aspx

    (See Mashup).


    Jeff Sanders (MSFT)

    Wednesday, August 29, 2012 7:43 PM
    Moderator
  • Thanks for your response! I have some follow-up questions..

    Do you mean send request using WinJS.xhr and retrieve the HTML source through the response and then render that to the user? If so, then do I also need to hook-up with some events to identify the navigation and do the similar thing to retrieve the HTML source for each and every page that the user navigates from that initial server page? Doesn’t this cause any noticeable delay or any performance issues (since we retrieve the response first and then render it) especially when operating in a low bandwidth connection?

    As FYI, our app navigates to an initial server page and the user can navigate from the initial server page to different pages based on the server implementation. The requirement for the app is to monitor the page load and retrieve the HTML source for each page that gets loaded and perform certain actions based on that.

    Please recommend a better approach to handle the above scenario.


    • Edited by win8devuser Wednesday, August 29, 2012 8:43 PM
    Wednesday, August 29, 2012 8:39 PM
  • There will be a performance hit.  It will be difficult to create your own webbrowser in an application and this is in essence what you are trying to do.

    You will need to get the HTML source, parse it, ensure it is safe, wire your own event handlers for things you want to effect etc...

    If this is all on an internal server, why don't you just convert the user interface and bring it all local?  That would work much better and perform great!  Don't try and cram a web based application into your application.  Take time and design it carefully to take advantage of the touch UI, controls and designs of the new app style!

    -Jeff


    Jeff Sanders (MSFT)

    Thursday, August 30, 2012 6:54 PM
    Moderator