来自 API 的回调

Question

我在 http://foobar.com/api?callback=mycallback 上有以下脚本：

var something = 'aaa';
var callback = mycallback;
(function() {
   var output = eval(something);
   callback(output);
});

我想从我自己的脚本访问这个脚本，并获取输出。所以我正在做以下事情：

var module1 = (function() {
   var getFromApi = function(output) {
      return (function(output) {
         var script = document.createElement('script');
         script.setAttribute('src', 'http://foobar.com/api?callback=mycallback');
         document.getElementsByTagName('head')[0].appendChild(script);
      });
   };
   var fetch = function() {
      getFromApi(function(output) {
         console.log(output);
      });
   };
   return {
      fetch: fetch
   };
})();

module1.fetch();

结果应该是这个脚本的输出，其实不是，连回调都没有进入。我怎样才能正确地做到这一点？

Answer 1

模块 1 中存在一些问题：

getFromApi returns 一个函数（我们称它为 fn）
fn 有一个名为 output 的参数，它隐藏了外部函数的参数，使传递给 getFromApi 的参数变得无用
fetch 调用 getFromApi 并且它什么都不做
回调函数必须是全局可访问的

可能的解决方案是：

var module1 = (function() {
var getFromApi = function(output) {
     var script = document.createElement('script');
     script.setAttribute('src', 'http://foobar.com/api?callback='+output);
     document.getElementsByTagName('head')[0].appendChild(script);
};
var fetch = function() {
  getFromApi('myfunction');
};
return {
  fetch: fetch
};
})();
function myfunction(output) {
     console.log(output);
}
module1.fetch();

作为回调函数的可能令人讨厌的解决方案（它在 IE 中不起作用，但可以修改）

var module1 = (function() {
  var getFromApi = function(output) {
    var script = document.createElement('script');
    script.setAttribute('src', 'http://foobar.com/api?callback=eval(document.currentScript.dataset.fn)');
    script.setAttribute('data-fn', '(function(){ return ' + output +'})()');
    document.getElementsByTagName('head')[0].appendChild(script);
  };
  var fetch = function() {
    return getFromApi(function(output){
      console.log(output);
      /*remember to remove script tag*/
      document.currentScript.remove();
    });
  };
  return {
    fetch: fetch
  };
})();
module1.fetch();

来自 API 的回调

Callback from API

javascript

jsonp