如何确定$.getScript的url

How to determine the url for $.getScript

本文关键字:url getScript 何确定      更新时间:2023-09-26

我创建了一个JavaScript文件,需要知道它的来源位置。在脚本内部,我有以下代码来确定JavaScript文件的url。

var url = (function () {
    if (module) {
        // resolve URL from module - RequireJS
        return module.uri;
    }
    else {
        // resolve URL from currentScript - Firefox & Chrome
        if (document.currentScript) {
            return document.currentScript.src;
        }
        // resolve URL from DOM - Internet Explorer
        else {
            var scripts = document.getElementsByTagName('script'),
            script = scripts[scripts.length - 1];
            if (script.getAttribute.length !== undefined) {
                return script.src;
            }
            return script.getAttribute('src', -1);
        }
    }
}());

我希望能够使我的JavaScript文件与使用jQuery的$.getScript的人兼容(这与$.ajax调用相同)。不幸的是,我还没能弄清楚如何在使用url时获得它。我想到的一个选择是:

var ScriptUrl = "https://example.com/myscript.js";
var callback = function () {
    console.log("Callback");
}
$.getScript(ScriptUrl, callback);

然后,我可以检查脚本中的变量ScriptUrl,但出于明显的原因,我不喜欢这个解决方案。

var url = ScriptUrl ? ScriptUrl : (function () {
    // ...
}());

我不知道它有多可靠,但唯一可行的方法是在myscript.js的开头使用ajaxComplete钩子和魔术唯一标识符。这对跨域请求不起作用,因为在那里您无法访问responseText,但在这种情况下,您可以扫描script标签。

当调用myscript的回调时,您将检查responseText是否以该唯一标识符开头,如果是,则ajaxOptions中的url应该是您的脚本中的一个。

//unique-identifier
$( document ).ajaxComplete(function(event, jqXHR, ajaxOptions) {
  if( /^'/'/unique-identifier/.test(jqXHR.responseText) ) {
     console.log('my url is: '+ajaxOptions.url);
  }
});
console.log('is executed before the "ajaxComplete"');

如果您确信名称myscript.js本身是唯一的,那么您应该能够对同域和跨域请求使用相同的技术,并且不需要注释。

当您的代码应该执行时,您肯定需要添加更多的逻辑,因为正如您所看到的,console.log将在url已知之前执行。您可能需要检查jQuery是否存在。

也许是这样的:

//unique-identifier
(function() {
  var ScriptUrl;
  function init() {
    console.log('init');
  }

  if( window.jQuery ) {
    jQuery( document ).ajaxComplete(function(event, jqXHR, ajaxOptions) {
      if( /^'/'/unique-identifier/.test(jqXHR.responseText) ) {
        ScriptUrl = ajaxOptions.url;
        init();
      }
    });
  } else {
    //do some error handling or support an altnerative loader like requirejs
  }
}());

我采用了t.niese提供的解决方案,并将其应用于我的原始代码。uniqueKey是一个字符串,用于确定url是否为脚本的url。如果用户没有使用RequireJS,我假设在执行此代码之前已经加载了jQuery

(function (factory) {
    // Support module loading scenarios
    if (typeof define === 'function' && define.amd) {
        // AMD Anonymous Module
        define(['jquery', 'module'], factory);
    } else {
        // No module loader
        factory(jQuery);
    }
})(function ($, module) {
    // Used to determine whether the url is for the script
    var uniqueKey = 'myscript.js';
    var urlPromise = (function () {
        // Check if the url is the correct one
        var validUrl = function(url) {
            return url ? url.indexOf(uniqueKey) > -1 : false; 
        };
        return (function () {
            var deferred = jQuery.Deferred();
            if (document.currentScript && validUrl(document.currentScript.src)) {
                // Chrome & Firefox
                deferred.resolve(document.currentScript.src);
            }
            else if (module && validUrl(module.uri)) {
                // RequireJS
                deferred.resolve(module.uri);
            }
            else {
                // DOM
                var scripts = document.getElementsByTagName('script');
                var script = scripts.length > 0 ? scripts[scripts.length - 1] : null;
                if (script && script.getAttribute.length !== undefined && validUrl(script.src)) {
                    deferred.resolve(script.src);
                }
                else if (script && validUrl(script.getAttribute('src', -1))) {
                    deferred.resolve(script.getAttribute('src', -1));
                }
                else {
                    // AJAX request
                    jQuery(document).ajaxComplete(function(event, jqXHR, ajaxOptions) {
                        if (ajaxOptions && validUrl(ajaxOptions.url)) {
                            deferred.resolve(ajaxOptions.url); 
                        }
                    });
                }
            }        
            return deferred;
        }());
    }());
    urlPromise.then(function(scriptUrl) {
        console.log(scriptUrl);
    });
});