jQuery autoload script works on localhost but fails when put on a server

Question

I have a page that is supposed to autoload instagram tags every 10 seconds. It works fine on my localhost, but completely fails on a server. Here it is on a Dropbox server. When the script is executed after 10 seconds from loading the page, the div that contains the images gets rewritten with the contents of 'script.js'

var refreshId = setInterval(function()
   {
      console.log("success");
       $('#instafeed').load('script.js');
  }, 10000);

Edit: I know I said it works with localhost. But I was mistaken, index.html works perfectly fine if ran in a browser as a regular file not on a local server.

What is the error you are getting? My guess is the cross-domain setting. You cant just open something from another server (unless with php or something). — Martijn, Feb 17 '14 at 08:30
@Martijn No errors. The script is dumped into the '#instafeed' dump by verbatim. Check the link I shared to see. — Rami Taibah, Feb 17 '14 at 08:32
You also add the script by its url,if loads not working,you just add the src of script tag dynamically ,the another way to call the scripts. — ashbuilds, Feb 17 '14 at 08:34
The script is executing guys. The console.log("success") prints to the log — Rami Taibah, Feb 17 '14 at 08:36
that's the normal behavior : `$("#container").load("source")` replace the content of #container by source. Are you sure that code work in localhost ? — Asenar, Feb 17 '14 at 08:48

score 1 · Accepted Answer · edited May 23 '17 at 10:25

That's the normal behavior of that script. $("container").load() will replace the content of 'container' by what's that script contains.

Why not writting directly the js code ?

var refreshId = setInterval(function()
{
  console.log("success");
  var feed = new Instafeed({
    get: 'tagged',
    tagName: 'creative_tunnel',
    clientId: 'b68db303d6ac4e74ac4e2f99a3f16fd2',
    resolution: 'standard_resolution',
    limit: 60,
  });
feed.run();

}, 10000);

If the clientId depends of an external file, you can adapt the code and use $.get or $.ajax to get only that id.

Otherwise, to make your script works with the same system as you wanted, you have to get the content of script.js, then execute it with eval()... but /!\ EVAL() IS A BAD IDEA

$("container").ajax('script.js', function(data){
  // bad idea
  eval(data);
})

jQuery autoload script works on localhost but fails when put on a server

1 Answers1