locked
Javascript error in iFrame. RRS feed

 > 

  • Question

  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi,
    I put apple.com in an iframe in my application, and process all WinJS element in fragment loaded event. Following is my code.  However, I hit an error in Javascript. 
    JavaScript runtime error: DOM Exception: INVALID_CHARACTER_ERR (5)
    File: http://images.apple.com/global/scripts/lib/prototype.js, line: 1872 column: 7
    If I change apple.com to msn.com, I got some other errors in Javascript. Basically, everything single URL I put in the iframe will trigger some kinds of JavaScript error.
    If I don't use a ViewBox here, I hit Access Denied error most of the time.
    Here is my html code:
    <body>
    <!-- The content that will be loaded and displayed. -->
    <div style="background: red; height: 100%">
        <div data-win-control="WinJS.UI.ViewBox" style="width: 100%; height: 100%">
            <div>
                <iframe id="storeFrame" src="http://www.apple.com" />
            </div>
        </div>
   </dov>
</body>
    How can I get this working?


    • Edited by Louis_PiG Sunday, January 15, 2012 5:48 AM
    Sunday, January 15, 2012 5:46 AM

Answers

  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Louis,

    There are two reasons why this fails to work correctly.  I will help you and others by walking you through how to discover the errors.

    Start your applicaition in the debugger and enable the javascript console: Debug, Windows, Javascript console.

    Look at the latest errors, what do you see?  Do you see something related to a manifest setting?

    After fixing that start again in the debugger and continue to debug.  When you hit an exception, ignore it (select that option in the dialog that comes up).  Continue to trace through.  You will see the page loads correctly.

    Next, restart the debugger.  Do not ignore the error and trace through.  Do you see why that developer's code fails now?

    -Jeff

    Jeff Sanders (MSFT)

    Thursday, February 16, 2012 4:22 PM
    Moderator

All replies

  • Question
    Sign in to vote
    0
    Sign in to vote

    This is only in the debugger to warn you that there are problems in the script.  Run outside of the debugger and you will see everything is OK!

    Jeff Sanders (MSFT)
    Monday, January 16, 2012 7:13 PM
    Moderator
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Jeff,

    I just realised that part of the pages are usually ok.But there are certain sections of pages are not ok. It may just keep trying to load. The application that I am working on is based on Web content to some degree. So this could be a blocker for my app. Could you please let me know is there anyway that I can load the page without any problems in the iframe?

     

    Thanks,

    Louis
    Friday, January 27, 2012 5:15 AM
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Louis,

    I assume you mean the page does not work for some reason and not that it is popping up errors.

    That is a very open ended question.  I can construct a web page with errors in it and there is nothing you can do in the client to 'fix' it (whether that client is Metro, IE, FF, GC etc...)

    The best thing you can do is debug the code if that page is critical to your situation, you should contact the author of the page.  Also visit the page in IE and see if it has the same problems.  Do you have a specific example?

    -Jeff

    Jeff Sanders (MSFT)
    Friday, January 27, 2012 5:33 PM
    Moderator
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Jeff,

     

    I tried MSN.com this time.

     

     

    This is what I got in the popup box in debug mode.

     

     

    Unhandled exception at line 32, column 104 in http://cdn.unicast.msn.com/assets/A352/N26124/M16815/P1473/Q87732/script_300_250.js?0.4532892904199678

    0x80070005 - JavaScript runtime error: Access is denied.

     

    And here is the javascript that complains:

     

     

    function VwP87732LoadSel(){var scope=window.VwFriendlyIframe?top:window;if(window.VwSelectMain)return;if(scope.VwSeLoading)

     

    And here is how I set the iframe src:

     

    var  msnFrame = document.getElementById('msnFrame');

    msnFrame.src = "http://msn.com";

     

    Thanks,

     

     

     

    Louis
    Friday, January 27, 2012 6:39 PM
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Louis,

    Are you running this in the debugger?

    I can only repro this if running in the debugger, not after I have deployed it.

    -Jeff

    Jeff Sanders (MSFT)
    Friday, January 27, 2012 7:40 PM
    Moderator
  • Question
    Sign in to vote
    0
    Sign in to vote

    The problem should not have any effect if you do not run in the debugger.  Can you verify that there is no problem as long as you are not debugging?

    -Jeff

    Jeff Sanders (MSFT)
    Friday, January 27, 2012 8:54 PM
    Moderator
  • Question
    Sign in to vote
    0
    Sign in to vote

    This does happen to me on deployed app.

     

    If I use a simple page which displays on an image, it works fine even in debug. But if the page has any kind of error, when I click on the "back" button, which hide my iframe, the iframe wouldn't really hide. The html elements are gone, but the background color is still there (red in the following case)

    Here is my iframe and JS that loads the iframe:

     

    <iframe id="frame1" style="width: 100%; height: 100%; float: right; display: block; position: absolute; visibility: hidden; z-index: 20;background: red"></iframe>

    WinJS.UI.processAll(elements)

        .then(function () {

            var  frame1 = document.getElementById('frame1');

            frame1.src = "http://msn.com"; //also tried with apple.com etc.

     

    My backbutton will just set do frame1.style.visibility = 'hidden'. 


    Louis
    Friday, January 27, 2012 9:22 PM
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Jeff,

     

    I think I just got a better example for this problem. 

     

    When I try to load http://slides.html5rocks.com in IE. It works perfectly. But when I load the same url in an iframe in my app in Debug mode, I hit an error. If I stop the debugger and start the app deployed on my Start menu, the slides won't really show up.

     

    Is this  some kinds of limitation or did I set anything wrong in the iframe?

     

    Thanks 

    Louis
    Wednesday, February 1, 2012 5:21 PM
  • Question
    Sign in to vote
    0
    Sign in to vote

    Hi Louis,

    There are two reasons why this fails to work correctly.  I will help you and others by walking you through how to discover the errors.

    Start your applicaition in the debugger and enable the javascript console: Debug, Windows, Javascript console.

    Look at the latest errors, what do you see?  Do you see something related to a manifest setting?

    After fixing that start again in the debugger and continue to debug.  When you hit an exception, ignore it (select that option in the dialog that comes up).  Continue to trace through.  You will see the page loads correctly.

    Next, restart the debugger.  Do not ignore the error and trace through.  Do you see why that developer's code fails now?

    -Jeff

    Jeff Sanders (MSFT)

    Thursday, February 16, 2012 4:22 PM
    Moderator
  • Question
    Sign in to vote
    0
    Sign in to vote

    <p><aid="navigt"href=http://www.bing.comtarget="targetFrame">Search the web</a></p>

    <iframename="targetFrame"></iframe>

    This code is working only for href=http://www.bing.com can anyone suggest me why is this so?

    Thursday, June 28, 2012 12:32 PM