IE specific access is denied error and jquery tools error

[silversurfer5150]

Hi guys,

I have been developing an eCommerce project for some time now and have added a number of elements to the front page, including a flash based 360 product display and an AJAX product finder filter which I wrote myself. All of this looks good and works great in all browsers except IE.

I have been trying to debug these issues as I go along but I haven't had any luck so I'm the first to admit that I need help. The information on Google isn't clear and specific enough to my issue, I have no idea what error 1 below refers to and error 2 seems to suggest some cross domain AJAX issue but I'm not calling cross domain. Is there anyone who can spot what I have done wrong.

ERROR 1 -page loads and on internet explorer a prompt comes up saying error error access is denied!
I believe this relates to the 3D movie which simply uses swf object to embed the movie, if there is no flash it uses html 5 and if there isn't html5 support it loads a static image. IE does not like this at all and I have no idea how to solve it.

ERROR 2

When I try to use the find a deal filter in the console I get the following error:

SCRIPT5: Access is denied.

jquery.tools.min.js, line 293 character 344

I have checked every script on the page with jslint and all of them are valid with no mistakes. I should also mention that I have several similar filters on this site that work flawlessly using the same AJAX syntax as I have already been down the road of checking that code, it seems to be a problem speicif to the front page and only on IE.

The ridiculous thing is that after I load the page a few times it often just goes away but this isn't good enough. I may have done something blindingly obvious with the doctype or xml type but I'm very jaded from spending so much time on this so I can't spot it.

I will be so grateful to anyone that can help. Here is the url:

http://www.wavemobilephones.com

[Pullo]

Hi there silversurfer,

ERROR 1:

I cannot reproduce this in any version of IE.

Firefox on the other hand spit out a nasty error on page load:

Error:[Exception... "Failure"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: http://wavemobilephones.com/catalog/view/javascript/jquery/object2vr.js :: <TOP_LEVEL> :: line 6"  data: no]

And Opera tells me this:

Error:DOMException: NETWORK_ERR

ERROR 2:

I can reproduce this in IE and Chrome. A look at the console tells you more.
In chrome, when I try to refine my search using the drop downs I see:

XMLHttpRequest cannot load http://wavemobilephones.com/index.php?route=module/banners/FindYourDeal. Origin http://www.wavemobilephones.com is not allowed by Access-Control-Allow-Origin.

In IE I see something similar:

SEC7118: "XMLHttpRequest" for http://wavemobilephones.com/index.php?route=module/banners/FindYourDeal requires Cross Origin Resource Sharing (CORS).

All of this points to your AJAX calls being cross domain.

Could you post the code that you are using to make the AJAX calls?

[silversurfer5150]

Hey Pullo,

Thanks so much . Yes it's very intermittent, I'm extremely surprised that it doesn't happen on IE, that's the problem really it's intermittent, I need it to be stable. There is nothing cross domain as far as I am aware which is puzzling. The filter calls the site database using php and the 3d movie is in a folder relative to the site root called /360. It is quite possible that the software I used to create the movie is using iframes which I know are responsible for such cross-domain issues but even these iframes would be located in the location wavemobilephones.com/360/picture_name.jpg so I can't solve this issue as yet. Thanks again for trying to help

<script type="text/javascript">$(document).ready(function () {
 
 
 function make_filter_call() {
     var brand = $('#brand').val();
   var tariff = $('#tariff_type').val();
 var pathname = window.location.pathname;
        $('.ajax_data').remove();
       $.ajax({ url: 'index.php?route=module/banners/FindYourDeal',
       data: {"tariff_type": tariff, "brand": brand},
       dataType: "json",
       type: 'post',
       success: function(output) {
 
          var products = [];
          var product_ids = [];
          var select ="";
          var i =0;
 
         $.each(output, function(key, value)
            {
                 if(output[i].product_id !== null)
                 {
                 select += "<option  class='ajax_data' value='" + output[i].product_id + "'>" + output[i].name + "</option>";
                }
             i++;
            });
 
       $(select).appendTo('#find_your_deal');
          $('#find_your_deal').removeAttr('disabled');
 
         }                       
       });
 
}
 
 
 
   $('#tariff_type').change(function() {
   if($(this).val() !== "tariff type")
   {
   $('.ajax_data').remove();
   $('#brand').removeAttr('disabled');
 make_filter_call();
   }
   else
   {
     $('#brand, #find_your_deal').attr( "disabled", "disabled" );
    $('.ajax_data').remove();
   }
 
   });
 
    $('#brand').change(function() {
 
 
    if($('#brand').val() !== "manufacturers" && $('#tariff_type'))
    {
       make_filter_call();
    }
   else
   {
     $('#find_your_deal').attr( "disabled", "disabled" );
    $('#find_your_deal option[value=""]').attr('selected','selected');
     $('.ajax_data').remove();
 
   }
    });
 
        $('#find_your_deal').change(function() {
 
 
    if($('#find_your_deal').val() !== "Find Your Deal")
    {
            $('#go').removeAttr('disabled'); 
 
   }
    });
 
   $("#go").click(function(e) {
     e.preventDefault();
window.location= "index.php?route=product/product&path=" + $('#tariff_type').val() + "_" + $('#brand').val() + "&product_id=" + $('#find_your_deal').val(); 
   });
 
 
 
});
 
</script>

I have SEO friendly urls enabled now but the homepage would be index.php/route= etc etc so there is nothing cross domain going on in the AJAX url :S

[Pullo]

Hi silversurfer,

When I load the page in FF I get the above-mentioned error message every time.
This is clearly unacceptable from your client's perspective, so it looks like you're going to have to get to the bottom of this one way or the other.
On a positive note, at least we can reproduce the error

Looking at the code you posted, I cannot see anything which would indicate a cross-domain request.

However, using Chrome, I had a look at the source code of your page and was surprised to see that on line 759 you have a HUGE nonsensical string embedded in two <style> tags.

It starts off like this:

<style>
<!--{cke_protected}%3C!%2D%2D%7Bcke_protected%7D%253C!%252D%252D%257Bcke_protected%257D%25253C!%25252D%25252D%25257Bcke_protected%25257D%2525253C!%2525252D%2525252D%2525257Bcke_protected%2525257D%252525253C!%252525252D%252525252D%252525257Bcke_protected%252525257D%25252525253C!%25252525252D%25252525252D%2525252525

You might want to look at that.

Apart from that, this is going to be quite hard to debug, as I cannot reproduce your issue without being on the same domain as you.
All I can advise you to do now is to start stripping elements out of the page (header, footer, nav bar etc.) until you have made a bare-bones example which reproduces the problem.
In the best case, this will just be the form with which you can narrow your selection (without any styling), as well as the JS and PHP which goes with it.

Once you've got that, post back here and I'll see if I can help more.
Good luck!

[silversurfer5150]

+
Hey Pullo,

Thanks for the advice. I removed that nonsense string, it was commented out anyway but it seems it was generated erroneously by the client in on of the text editors from the back end.

You are of course right that I will have to strip it down to unit tests so today I will do two different pages, one for the 360 movie and one for the filter. I would be very grateful if you could look at the resulting pages for me,
best regards

Silversurfer5150

[Pullo]

No problemo!

Just post back here when you've got it done.

[silversurfer5150]

Hey Pullo,
I stripped the site down earlier today because its modular, didn't take long to do, disabled everything that I could and then enabled them one by one and the error didn't come back.....on my version of IE!
However, when I used someone Else's version of IE the same thing happened and it definitely wasn't caching old stuff because the guy had never visited that site before.

At the heart of the issue is that internet explorer assigns the domain name of an iframe relative to the server root rather than to the domain name of the document calling it, causing IE to flag it as cross-domain and throw up a warning prompt, the other browsers react differently to this. I know that you have gotten errors which I have not seen on any of my versions of chrome or Firefox. The 360 movie could well contain such iframes(I suspect it loads them dynamically into the flash movie) but I'm not sure because I created it with a GUI and not inside flash itself.

So I found one thread which said that it is indeed, earlier JQuery version's bug that it cannot pre-empt and deal with the consequences of this.

I have just included the latest version and I am hoping that this could solve the problem.

I would be grateful if you could tell me if the error persists when you look at it now because it is so intermittent, I think I shall just have to gather feedback from different browsers until I get to the bottom of it.

The other thing I should mention is that the cite contains both JQuery and JQuery tools, this is because the original template used tools and that had to stay to keep certain features I liked but the newer version was also required for the enhancements I made. It means that JQuery is included twice (once inside tools). I don't know if this would be a major issue, it has worked ok for me until now.

Further still, I noticed that the search input box at the top of the page doesn't allow you to enter any text on IE9 (does on 7 and 8) which again points to IE security lockdown.

regards

Silversurfer5150

[Pullo]

Hi Silversurfer5150,

I'm afraid the error persists and your site's "narrow the search" functionality is broken in all of the browsers I tested on.
On a positive note, however, the ugly error message in Firefox and Opera has gone away.

It shouldn't be a problem to include jQuery twice as you do this on two adjacent lines (had you done it later in the page, this would have caused problems for anything using it in between).
It is however, AFAIK, completely surplus, as the second version just overwrites the first.

I also had no problem entering text in the search box in IE9

If you want to post your boiled down example, I don't mind taking a look for you.

[silversurfer5150]

Hey pullo.
I have disabled the flash movie module on the site and the error has been unmasked.
The ie console identifies it as a CORS - crossdomain error. Take a look again if you can
I am looking into it but its a bit above me.
I m not even sure how to set a header to allow cross origin .
Do I do it in the html? Php?
What I still dont get is that all of my php scripts are on the same domain. They are all relative to the main domain.
The first page loaded is always index php
which brings up a different template file via the cms architecture
The ajax just requests another path relative to this, index.phproute=model/tool/filter/findyourdeal

[silversurfer5150]

Here is another post that I just made directly related to the CORS issue:

http://www.sitepoint.com/forums/show...87#post5291887

[Pullo]

Good luck with this, CORS is not something I've had a lot of experience with.
One resource I did find was this: http://www.html5rocks.com/en/tutorials/cors/
It's very in-depth, so hopefully this will give you some ideas.