jquery ajax url不包括服务器路径答案

【问题标题】：jquery ajax url not including server pathjquery ajax url不包括服务器路径
【发布时间】：2016-09-06 00:40:41
【问题描述】：

对不起，伙计们，但这让我发疯了。这是我以前做过的事情，但由于某种原因它不起作用。

我有一个 html 按钮，点击时会触发一个 js 函数并传递一个参数：

<button type="button" class="btn btn-default" onclick="aprobarOperacion(Operacion.value)" data-dismiss="modal">

接下来，我的js函数：

function aprobarOperacion(numeroOperacion) {

    var serviceUrl = "/Operaciones/AutorizarOperacion";

    $.ajax({
        type: "POST",
        dataType: "json",
        url: (window.BASE_URL == null) ? serviceUrl : window.BASE_URL + serviceUrl,
        data: JSON.stringify({
            operacion: numeroOperacion
        }),
        success: function (data) {
        //some code
        },
        error: function (data) {
        //some code
        },
    });
}

问题是，这个 ajax 函数应该转到 Operaciones 控制器，并执行一个名为 AutorizarOperacion 的操作，该操作需要一个名为 opacion 的参数。 URL 应该类似于 http://localhost:port/Operaciones/AutorizarOperacion，但调试器控制台会抛出以下错误：

Failed to load resource: net::ERR_NAME_NOT_RESOLVED --> http://operaciones/AutorizarOperacion

我不知道为什么，但显然路径缺少服务器部分。我已经尝试过多种方式来编写 url，但它们都这样呈现。

非常感谢。

【问题讨论】：

window 没有 BASE_URL 属性，因此除非您在代码的其他地方定义它，否则它不会起作用。

标签： javascript jquery ajax asp.net-mvc

【解决方案1】：

var serviceUrl = window.location.href + "Operaciones/AutorizarOperacion";  // Raw javascript
var serviceUrl = $(location).attr('href') + "Operaciones/AutorizarOperacion";  // JQuery solution

【讨论】：

【解决方案2】：

据我了解，您需要协议、主机名和端口。

所以你应该这样得到它：

var baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');

然后你可以在你的脚本中使用它：

url: baseUrl + serviceUrl,

【讨论】：

是的，就是这样。我习惯于在另一个应用程序中复制此功能，该应用程序确定布局中的基本 URL，并且由于我正在构建当前应用程序，因此我不知道这一点。非常感谢。

【解决方案3】：

你可以使用document.location

该对象具有属性protocol、hostname 和port

function aprobarOperacion(numeroOperacion) {
    var baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '';
    var serviceUrl = "/Operaciones/AutorizarOperacion";

    $.ajax({
        type: "POST",
        dataType: "json",
        url: (window.BASE_URL == null) ? serviceUrl : window.BASE_URL + serviceUrl,
        data: JSON.stringify({
            operacion: numeroOperacion
        }),
        success: function (data) {
        //some code
        },
        error: function (data) {
        //some code
        },
    });
}

奖励：如果你碰巧使用 babel/es6，你可以像这样让事情变得更漂亮，我喜欢使用模板字符串进行连接。

const {protocol, hostname} = document.location;
const port = document.location.port ? `:${document.location.port}` : '';
const serviceUrl = '/Operaciones/AutorizarOperacion';
const url = `${protocol}//${hostname}${port}${serviceUrl}`;

【讨论】：