admin 管理员组

文章数量: 1086019

I'm writing a javascript app that will be hosted on a file: protocol (ie: the application is just a folder of html, css, and javascript sitting someplace on my hard drive). When I try normal XHR requests they fail because of the same origin policy afaict.

So my question is this, what's the best way to request json/jsonp files with an app as described above?

Note: So far I've got all of my jsonp files using a hard-coded callback functions, but I'd like to be able to use dynamic callback functions for these requests.. is there a way to do this?

I'm writing a javascript app that will be hosted on a file: protocol (ie: the application is just a folder of html, css, and javascript sitting someplace on my hard drive). When I try normal XHR requests they fail because of the same origin policy afaict.

So my question is this, what's the best way to request json/jsonp files with an app as described above?

Note: So far I've got all of my jsonp files using a hard-coded callback functions, but I'd like to be able to use dynamic callback functions for these requests.. is there a way to do this?

  • javascript
  • html
  • json
  • xmlhttprequest
  • file-uri
Share Improve this question edited Aug 8, 2012 at 5:25 hippietrail 17k21 gold badges109 silver badges179 bronze badges asked Jan 4, 2011 at 0:42 erikvolderikvold 16.6k11 gold badges58 silver badges101 bronze badges 3
  • Do you have any browser requirements? – Hemlock Commented Jan 4, 2011 at 20:54
  • 2 It should work on as many browsers as possible. – erikvold Commented Jan 4, 2011 at 20:54
  • With CORS it will never work, because you cannot return an Access-Control-Allow-Origin header by requesting a file: host. – inf3rno Commented May 27, 2014 at 18:30
Add a ment  | 

2 Answers 2

Reset to default 7

This is kind of a hatchet job, but it will get you your dynamic callbacks. Basically it counts on the fact that file: transfers will be pretty fast. It sets up a queue of requests and sends them out one at a time. That was the only way I could figure out to make sure that the correct response and callback could be linked (in a guaranteed order). Hopefully someone can e up with a better way, but without being able to dynamically generate the responses, this is the best I can do.

var JSONP = {
  queue: [],
  load: function(file, callback, scope) {
      var head = document.getElementsByTagName('head')[0];
      var script = document.createElement('script');
      script.type = "text/javascript";
      script.src = file;
      head.appendChild(script);
  },

  request: function(file, callback, scope) {
      this.queue.push(arguments);
      if (this.queue.length == 1) {
          this.next();
      }
  },

  response: function(json) {
      var requestArgs = this.queue.shift();
      var file = requestArgs[0];
      var callback = requestArgs[1];
      var scope = requestArgs[2] || this;
      callback.call(scope, json, file);

      this.next();
  },

  next: function() {
      if (this.queue.length) {
          var nextArgs = this.queue[0];
          this.load.apply(this, nextArgs);
      }
  }

};

This is what I did to test

window.onload = function() {
  JSONP.request('data.js', function(json, file) { alert("1 " + json.message); });
  JSONP.request('data.js', function(json, file) { alert("2 " + json.message); });
}

Data.js

JSONP.response({
  message: 'hello'
});

Chrome has very tight restrictions on making ajax calls from a file:// url, for security reasons. They know it breaks apps that run locally, and there's been a lot of debate about alternatives, but that's how it stands today.

Ajax works fine from file urls in Firefox, just be aware that the return code is not an http status code; i.e., 0 is success, not 200-299 + 304.

IE handles these security concerns differently from both Chrome and Firefox, and I'd expect other browsers to each have their own approaches. The border between web and desktop apps is very problematic territory.

本文标签： javascriptmaking jsonjsonp xhr requests on the file protocolStack Overflow

版权声明：本文标题：javascript - making jsonjsonp xhr requests on the file: protocol - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/p/1744081224a2530282.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。