在 jquery 插件中使用 Relative API Url 的最佳方式

Question

所以我正在使用 grunt 编写一个 jquery 插件，并且在我的插件中我还需要调用 webservices。

网络服务 url 域将始终与用户需要为我们的插件添加的 .js 文件所在的域相同。所以即 Relative

1) 包含插件的 JS 文件

2) 在我的 JS 调用中 API URL

需要

api_domain: "http://mydomain1/api/v1"

而且我希望 api 域与调用它的 JS 文件的域相关我尝试这样做

api_domain: "/mydomain1/api/v1"

但这会获取浏览器的域名。

所以我想知道实现此目标的最佳方法是什么

1) 使用 .NET 处理程序从 context.request.url

插入正确的域名

2) 在 Grunt 构建中为我将部署到的每个环境创建一个特定的 .js，在 JS

中具有完整的 url

3) 其他选项 ?

Answer 1

你的JS文件会和网页在同一个域吗？在这种情况下，只需在您的插件中使用 window.location.host 即可获得“http://mydomain”。

Answer 2

好吧，您实际上可以使用 jquery 让脚本找到它自己的源代码。只需确保为 js 文件指定一个足够唯一的名称即可。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/demux/4d4ce440d7c379305a9a/raw/findfilehosttest.js"></script>

实际脚本：

$(function(){
    var url = $("script[src$='findfilehosttest.js']").attr('src')
    var matches = url.match(/^https?\:\/\/([^\/?#]+)(?:[\/?#]|$)/i)
    var domain = matches && matches[1]
    alert(domain)
})

但总的来说，我认为最好保持简单。所以允许用户手动设置服务器的URL，像这样：

<script>
    var MY_API_URL = 'https://instance1.myapiserver.foo'
</script>
<script src="/whateverpath/myapiscript.js"></script>

这也将允许他们在自己的服务器上托管脚本，甚至出于任何可能的原因代理它。

Answer 3

您试图在您的 JS 文件中这样做吗？

var api_version = "v1";
var api_domain = (function () {

var scripts = document.getElementsByTagName('script');
var script = scripts[scripts.length - 1];
var domain;

if (script.getAttribute.length !== undefined) {
    domain = script.src;
} else {
    domain = script.getAttribute('src', -1);
}

domain = domain.split('/');
domain.pop();
domain = domain.join('/');

var tmp = document.createElement('a');
tmp.href = domain;

var port = tmp.port !== "80" ? ":" + tmp.port : "";

return tmp.protocol + '//' + tmp.hostname + port + '/api/' + api_version;

}());

您将在 api_domain 上获得所需的价值。

在 jquery 插件中使用 Relative API Url 的最佳方式

best way to use Relative API Url in a jquery Plugin

api

url

jquery

gruntjs