Javascript Ajax调用中的相对路径问题

时间:2011-02-23 14:42:18

标签: javascript relative-path

好的,我有一个包含以下功能的JavaScript文件:

function AskReason() {
    var answer = prompt("Please enter a reason for this action:", "");
    if (answer != null)
        DoReason(answer);
}

function createXMLHttpRequest() {
    try {
        return new XMLHttpRequest();
    }
    catch (e)
    { alert('XMLHttpRequest not working'); }
    try {
        return new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    { alert('Msxml2.XMLHTT not working'); }
    try {
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e)
    { alert('Microsoft.XMLHTTP not working'); }
    alert("XMLHttpRequest not supported");
    return null;
}

function DoReason(reason) {
    var xmlHttpReq = createXMLHttpRequest();
    var url = "/Shared/AskReason.ashx?REASON=" + reason;
    xmlHttpReq.open("GET", url, true);
    xmlHttpReq.send(null);
}

这一行:

    var url = "/Shared/AskReason.ashx?REASON=" + reason;

是导致问题的原因。

在VS 2010中调试应用程序 - 此调用适用于我的ashx处理程序。

当我将项目移动到虚拟目录时 - 示例http://localhost/myapp

此代码将中断,我必须将javascript更改为:

var url = "http://localhost/myapp/Shared/AskReason.ashx?REASON=" + reason;

关于如何解决此问题以便在两种环境中工作或者只是在将应用程序部署到服务器时接受手动更改的任何想法?

谢谢, 麦克

5 个答案:

答案 0 :(得分:22)

Pointy's way有效,但您必须事先知道要将其部署到哪里。

或者,只是不要使用/

启动相对路径
var url = "Shared/AskReason.ashx?REASON=" + reason;

相对于当前文档的位置,这将得到解决。因此,如果当前文件是:

http://localhost/myapp/index.aspx

...那将解决

http://localhost/myapp/Shared/AskReason.ashx?REASON=foo

答案 1 :(得分:6)

以“/”(并且没有协议和主机)开头的路径相对于主机的 root 。如果您部署的应用程序位于“http:// whatever / myapp”,那么您的根相对路径必须以“/ myapp”开头。

当您在涉及某种页面模板机制的服务器端环境中工作时,常见的诀窍是让路径的那一部分成为某种配置变量,以便您可以使用以下路径编写页面:

<a href='${root}/something/something'>click me</a>

然后根据配置将“root”变量扩展为“/ myapp”或其他任何内容。

答案 2 :(得分:3)

我遇到了类似的问题,其中需要绝对URL但是从localhost转到生产服务器时引用中断了。我通过检查是否存在“localhost”字符串来解决它:

var environ = window.location.host;

然后你就可以做到:

if (environ === "localhost") {
    var baseurl = window.location.protocol + "//" + window.location.host + "/" + "shared/";
} else {
    var baseurl = window.location.protocol + "//" + window.location.host + "/";
}

然后,您可以在需要引用的任何网址前添加baseurl

答案 3 :(得分:2)

网址

var url = "/Shared/AskReason.ashx?REASON=" + reason; 

在根目录中查找文件[因为它是绝对路径],实际上是

http://localhost/Shared/AskReason.ashx

您应该包含虚拟目录的名称或确定适当的结构:

在没有/的情况下开始会给你一个相对路径...如果你需要浏览目录,请使用../Shared/表示法,或者最后使用你的服务器目录命令来确定你当前的路径。

答案 4 :(得分:1)

我在单独的.js文件中通过AJAX调用遇到了ASP.NET MVC的相同问题。看起来是这样:

 return $.ajax({
            type: "POST",
            url: '/Dashboard/Execute',
            contentType: "application/json; charset=utf-8",
            data: filter,
            dataType: "json",
        });

这当然可以在我的本地计算机上正常运行。但是当部署在IIS的子目录中时

wwwroot/appsite/subdomainfolder/

这将触发 404未找到,因为它没有在URL上附加子域文件夹。

如果我删除

  

“ /”

在URL的开头,它将像这样生成:

http://localhost/subdomainfolder/Dashboard/Dashboard/ExecuteReader

这将再次触发404 Not Found问题。

因此,这是我的解决方法的两个选项:

删除反斜杠并删除控制器的名称(在这种情况下为仪表板):

return $.ajax({
            type: "POST",
            url: '/Execute',
            contentType: "application/json; charset=utf-8",
            data: filter,
            dataType: "json",
        });

或者,保持不变,只需在URL的开头添加双倍点:

return $.ajax({
            type: "POST",
            url: '../Dashboard/Execute',
            contentType: "application/json; charset=utf-8",
            data: filter,
            dataType: "json",
        });