JQuery Post Call中的相对URL

我有以下情况。

我开发了我的第一个MVC Asp.Net应用程序。 它在我的服务器上运行以下地址

http://localhost:59441/ 

我写了一些看起来像这样的JQuery Post方法

  $.ajax({ type: "POST", url: "/CeduleGlobale/UpdateCheckBox", ... 

CeduleGlobale是我的ControllerName,UpdateCheckBox是我的methodName

当我将应用程序放在testServer上时,它被放在VirtualDirectory中

因此应用程序现在

 http://testServer/JprApplication/ 

没有更多要指定的端口以及应用程序名称

当我开始测试时,我很快发现我的JQuery Post调用不再起作用了……

我修改了它们,所以现在URL是

 /JprMvc/CeduleGlobale/UpdateCheckBox 

问题是2倍。

  1. 这使我很难在我的开发机器上进行测试,因为IIS Express不允许我指定虚拟目录。
  2. 我不喜欢在JQuery中硬编码虚拟目录名称,因为我不知道应用程序在生产环境中将具有什么名称,因此我必须在我可以在生产中安装应用程序之前修改我的脚本。

我确信我遗漏了一些基本的东西来简化这个。

谢谢

根据您实际拥有JavaScript的位置(在View或单独的JS文件中),您有几个选项。

选项1 – 在视图内

只需使用Html Helpers为您生成链接

  

选项2 – 独立JS文件

我们通常每页都有一个function来设置该页面的处理程序。 所以,我们可以做类似以下的事情:

视图

  

独立的JS文件

 function SetOrderPage(ajaxPostUrl){ $.ajax({ type: "POST", url: ajaxPostUrl )}; } 

选项3 – 独立JS文件方法2

你可以在你的JS文件中有一个全局变量,即siteroot。 这里的缺点是您需要手动创建每个操作方法路径。 在每个页面上,您可以设置站点根全局变量:

独立的JS文件

 var siteRoot; 

视图

  

请记住,您不能在独立的JS文件中使用Razor语法。 我认为最好让Razor / MVC / .NET动态地为您提供站点路径或URL路由,因为它将真正减少在站点/虚拟目录之间移动时可能出现的错误。

据我所知,除此之外别无他法。 除非您愿意使用相对URL,即:

 $.ajax({ type: "POST", url: "./CeduleGlobale/UpdateCheckBox", ... 

但是,当您重构代码时,由于各种原因,这可能会变得混乱。 或者在前面添加全局定义的URL,因此您只需要在进入生产之前将其更改为一次。

 //Globally defined serverRoot serverRoot = "http://someaddress/somevirtualdirectory"; $.ajax({ type: "POST", url: serverRoot + "/CeduleGlobale/UpdateCheckBox", ... 

这样,如果你不需要它,你可以设置serverRoot = ''; 所有人都将回到现在的样子。

我在使用JQuery的MVC 5上遇到过这种问题,所以当你在Localhost和任何Navigator中时,即使你在子文件夹中部署应用程序,我也会使用这个解决方案来解决问题。

 var pathname = window.location.pathname; var VirtualDirectory; if (pathname.indexOf("localhost") >= 0 && pathname.indexOf(":") >= 0) { VirtualDirectory = ""; } else { if ((pathname.lastIndexOf('/')) === pathname.length + 1) { VirtualDirectory = pathname.substring(pathname.indexOf('/'), pathname.lastIndexOf('/')); } else { VirtualDirectory = pathname; } } 

然后在任何ajax调用中:

 $.post(VirtualDirectory + "/Controller/Action", { data: data}, "html") .done(function (result) { //some code }); 

我知道这是一个老post。 但是,我遇到了同样的问题并最终到了这里。 并设法使用UrlHelper.Action方法修复该问题。 应该使用这样的东西。 (请注意,此特定解决方案将在视图中起作用。)

 url: "@Url.Action("UpdateCheckBox", "CeduleGlobale")", 

希望这可以帮助。 🙂

将@ Url.Action(“action”,“controller”)传递给视图中的javascript。 这将允许它在运行时动态更新。

  

可能还有一个函数来获取根路径,您可以使用它来初始化先前答案中的根变量。

http://localhost:59441/
http://testServer/JprApplication/将同时适用于您的

$.ajax({ type: "POST", url: "/CeduleGlobale/UpdateCheckBox", ...

如果你在iis中托管,你只需要在你的主机中创建一个虚拟主机
C:\Windows\System32\drivers\etc\hosts

文件。 在主机文件的底部添加此行

127.0.0.1 CeduleGlobale

像这样创建一个新网站 创建一个像这个选择网站的新网站,右键单击并创建一个新网站

填写您的详细信息并设置与您在“CeduleGlobale”上方创建的主机名相同的主机名

填写您的详细信息并设置与您在“CeduleGlobale”上方创建的主机名相同的主机名

然后将您的mvc appliation部署到此站点