Jump to content

Ajax on safari


M.O.S. Studios

Recommended Posts

Hey guys

 

I'm working on some code for a blog I write

 

I use a plug in that puts my Instagram feed on my blog, then links each photo to itself on Instagram.

 

However, I want any photos that are linked to a blog post, to link to that instead.

 

So I made a routine in jquery that solved that issue like this:

 

1. Creates a function that can look at an Instagram photo URL, and determin if I have a blog post associated with it (by using Ajax to run a URL on my site, and see if it returns a 404 error), it will then will forward the user to either the Instagram post, or the blog post

 

2. Go through each anchor associated with a instgram photo, replace the href with a listening action that will run the URL through the function mentioned above

 

It works well on chrome on my MacBook, but. It on safari I for my iPhone.

 

Anyone have any idea why?

 

 

function UrlWorks(instaUrl) {
    var url = instaUrl.replace('www.instagram.com/p',  'mywebsite.com').toLowerCase();
    var http = new XMLHttpRequest();
    http.open('HEAD', url, true);
    http.onload = function(){
                          if (http.status === 404){
                                  window.location.href = instaUrl;
                          }else{
                                  window.location.href = url;
                          }
    };
    http.send();
}

$('a.sbi_photo[href]').each(function() {
    var $t = $(this);
    var newHref =  $t.attr('href');
    $t.removeAttr( "href" );
    $t.click(function(){UrlWorks(newHref);});
});
Link to comment
Share on other sites

I switched to a new code, I'm now using jquery to make the call, and it is working better.

 

But now my site see's the call as a 'cross browser' call, so I'm getting an error message that says it's a security risk.

 

I think if I switch the call to 'localhost' opposed to having written out my domain it might work. Anyone know how to phrase that?

 

function UrlWorks(instaUrl, cb){
    var url = instaUrl.replace('www.instagram.com/p',  'localhost').toLowerCase();

    jQuery.ajax({
        url:      url,
        dataType: 'text',
        type:     'HEAD',
        complete:  function(xhr){
                if (typeof cb === 'function'){
                   cb.apply(this, [xhr.status]);
                }
       }
});
}

$('a.sbi_photo[href]').each(function() {
    var $t = $(this);
    var newHref =  $t.attr('href');
    $t.removeAttr( "href" );
    $t.click(function(){UrlWorks(newHref, function(e){alert(e)});});
});

Also, I got this code from here

 

https://stackoverflow.com/questions/3915634/checking-if-a-url-is-broken-in-javascript

Link to comment
Share on other sites

Got it working
 

function UrlWorks(instaUrl){
    var url = '../' + instaUrl.split('.com/p/').pop().toLowerCase();
 
    jQuery.ajax({
        url: url,
        datatype: 'text',
        type: 'Get',
        success: function(){window.location.href = url},
        error: function(){window.location.href = instaUrl}
    });
}
 
$('a.sbi_photo[href]').each(function() {
    var $t = $(this);
    var newHref = $t.attr('href');
    $t.removeAttr( "href" );
    $t.click(function(){UrlWorks(newHref);});
});
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.