javascript - 发布后ASP.NET MVC 5 Ajax Controller 调用不起作用

我一直在研究ASP.NET MVC 5 Web应用程序，该应用程序包括一个包含Raphael javascript图像的视图，该图像使用AJAX调用控制器方法来获取初始渲染上的一些数据。当我在自己的计算机上本地呈现页面时，所有内容均按预期执行，并且页面加载正常。但是，当我将应用程序“发布”到测试服务器时，每次尝试加载页面时，AJAX调用都会遇到“错误”功能。

经过研究，我可以通过将此标签添加到布局页面来解决一些JavaScript错误：

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

但是，当我尝试使用Ajax调用控制器方法时，它仍然不起作用。当我看一下Firebug的问题时，我看到抛出的错误是“ Boostrap require JQuery”。我已经搜索了错误，并确保脚本标记的顺序正确-在Boostrap之前调用JQuery：

<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.10.2.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/boostrap.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/raphael.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/update.js")"></script>

我还检查了文件的权限，它们都具有相同的正确privs，这使我陷入困境。当我在计算机上本地运行应用程序时，这些控制器调用的工作与预期的完全一样，但是一旦将应用程序发布到服务器，就会出错。

我不确定还有什么可能导致此问题。任何和所有建议将不胜感激！！！

以下是对controller方法的JQuery调用之一：

function GetESN(area, ID) {
$.ajax({
    url: "/Home/GetESN",
    type: 'POST',
    async: false,
    dataType: 'json',
    cache: false,
    data: { area: area, ID: ID },
    success: function (data) {
        esn = data
    },
    error: function () {
        alert('error occurred');
    }
});

}

请让我知道是否需要更多信息。

更新

问题实际上出在网站的命名方式上-需要将其格式化为“ http://projectname.com/location”。我最终不得不拆分路径名以解决“ / location”位，并在脚本开始处构建了URL。可能不是理想的情况，但对我的情况很好。

最佳答案

您的

"url: "/Home/GetESN",

在Web服务器上而不是在本地服务器上时，URL是错误的URL。

尝试添加

<script>
        rootUrl = '@Url.Content("~")'
</script>

到_Layout.cshtml

然后更新您的js文件，以便您使用rootUrl

function GetESN(area, ID) {
$.ajax({
    url: rootUrl + "Home/GetESN", // or url: rootUrl + "/Home/GetESN"
    type: 'POST',
    async: false,
    dataType: 'json',
    cache: false,
    data: { area: area, ID: ID },
    success: function (data) {
        esn = data
    },
    error: function () {
        alert('error occurred');
    }
});