设置全球基础URL

Question

我正在使用jQuery：哪个是存储 base url ajax请求的最佳方法，以每个脚本可以以某种方式不用手动引用它的方式每个更新的更改？我应该将其存储在Window对象，HTML，全局变量还是什么？非常感谢。

Answer 1

您可以创建自动执行功能：

var BASE_URL = 'http://www.foo.com/url-root/';
function getUrl(url) {
    return BASE_URL.concat(url);
}

现在，当您想要一个URL ...

时

var url = getUrl('bar.php');  //returns 'http://www.foo.com/url-root/bar.php'

我不希望它成为全球...

(function() {
    var BASE_URL = 'http://www.foo.com/url-root/';
    window.getUrl = function(url) {
        return BASE_URL.concat(url);
    }
})();

，也可以创建一个对象。

Answer 2

这将被某些人视为危险或不良练习（请参阅下面的警告），但它可以使您保持Ajax呼叫清洁（没有明确的URL串联或方法调用）。

这是通过覆盖$.ajax方法的默认行为来实现的，以在将呼叫传递到真实的$.ajax方法之前，将我们自己的预处理添加在URL上。

这种方法与使用$ .ajaxSetup具有相同的陷阱，因此我会从其文档中向您提供相同的警告：

此处指定的设置将影响到$ .ajax或 基于AJAX的衍生物，例如$ .Get（）。这可能导致不良 行为由于其他呼叫者（例如插件）可能会期望 普通默认设置。因此，我们强烈建议 反对使用此API。而是在 致电或定义一个简单的插件。

live demo

function setBaseForAjax(base){
    var oa = $.ajax; //keep a reference to the actual ajax call
    $.ajax = function(){
        var len = arguments.length,
            newArgs = [],
            newUrl = len === 2 && (typeof arguments[0]).toLowerCase() === 'string' ? arguments[0]: null,
            newObj = len === 2 && (typeof arguments[1]).toLowerCase() === 'object' ? arguments[1] : (len === 1 && (typeof arguments[0]).toLowerCase() === 'object' ? arguments[0] : null); 
        if(newUrl){
            newUrl = base + newUrl; 
            newArgs.push(newUrl);  
        }
        if(newObj){
            newObj.url = base + newObj.url; 
            newArgs.push(newObj);    
        }
        oa.apply(window, newArgs); //call the real $.ajax method with the modified params
    }; 
}
setBaseForAjax('/echo/'); //set the base for every ajax call in the application.
$.ajax({
    url:'json/', 
    success: function(){
        alert('in for json');    
    }
}); 
$.ajax(
    'html/'
    ,{
        success: function(){
            alert('in for html');    
        }
    }
); 
$.ajax('html/', { //html wins over settings. 
    url:'json/', 
    success: function(){
        alert('in for html');    
    }
}); 
$.get('json/', function(){
    alert('in for json');
});