Ajax，asp.net mvc3路由和相对网址

I have an ASP.NET MVC3 application published to a url like this:

我有一个ASP.NET MVC3应用程序发布到这样的URL:

http://servername.com/Applications/ApplicationName/

In my code, I am using jquery ajax requests like this:

在我的代码中,我正在使用这样的jquery ajax请求:

$.get(('a/b/c'), function (data) {}, "json");

When I run the application locally, the ajax request goes directly to the correct page (being an mvc route) because the local page ends with a "/" (localhost/a/b/c).

当我在本地运行应用程序时,ajax请求直接转到正确的页面(是一个mvc路由),因为本地页面以“/”(localhost / a / b / c)结尾。

However, when I publish to http://servername.com/Applications/ApplicationName/, the trailing "/" is not always present. The url could be http://servername.com/Applications/ApplicationName, which then causes the ajax request to try to load http://servername.com/Applications/ApplicationNamea/b/c, which fails for obvious reasons.

但是,当我发布到http://servername.com/Applications/ApplicationName/时,尾随的“/”并不总是存在。该网址可能是http://servername.com/Applications/ApplicationName,然后会导致ajax请求尝试加载http://servername.com/Applications/ApplicationNamea/b/c,但由于显而易见的原因而失败。

I have already looked into rewriting the url to append a trailing slash, but A) It didn't work, and B) I feel like it's a poor solution to the problem, and that it would be better to configure the javascript urls to work properly regardless of the local folder setup.

我已经考虑过重写url来附加一个尾随斜杠,但是A)它不起作用,而且B)我觉得这是一个很难解决问题的方法,而且配置javascript url工作会更好正确无论本地文件夹设置如何。

I did try "../a/b/c" and "/a/b/c", but neither seemed to work.

我确实试过“../a/b/c”和“/ a / b / c”,但似乎都没有效果。

Thanks in advance for the help!

先谢谢您的帮助!

3 个解决方案

#1

Personally I tend to use a global variable of the relative URL of the server in my view like:

我个人倾向于在我的视图中使用服务器相对URL的全局变量,如:

var BASE_URL = '@Url.Content("~/")';

Then you can do things like :

然后你可以做以下事情:

$.get(BASE_URL + 'a/b/c'), function (data) {}, "json");

I would like to add that if you want it to be totally global, you could add it to your /Views/Shared/_Layout.cshtml instead.

我想补充一点,如果你想让它完全全局化,你可以将它添加到你的/Views/Shared/_Layout.cshtml中。

#2

I ran into the same problem, and ended up creating two JavaScript functions that mirror the functionality of the MVC Url helper methods Url.Action and Url.Content. The functions are defined in the _Layout.cshtml file, so are available on all views, and work regardless of whether the application is in the root of the localhost or in a subfolder of a server.

我遇到了同样的问题,最终创建了两个JavaScript函数,它们反映了MVC Url帮助器方法Url.Action和Url.Content的功能。这些函数在_Layout.cshtml文件中定义,因此可用于所有视图,无论应用程序是在localhost的根目录中还是在服务器的子文件夹中,都可以正常工作。

<script type="text/javascript">
    function UrlAction(action, controller) {
        var url = ('@Url.Action("--Action--","--Controller--")').replace("--Action--", action).replace("--Controller--", controller);
        return url;
    }

    function UrlContent(url) {
        var path = "@Url.Content("~/--file--")";
        path = path.replace("--file--", url.replace('~/', ''));
        return path;
    }
</script>

These can then be called like so:

然后可以像这样调用它们:

var url = UrlAction('AvailableAssetClasses', 'Assessment');
var url2 = UrlContent('~/Images/calendar.gif');

#3

Always use Url helpers when generating urls in an ASP.NET MVC application and never hardcode them. So if this script is directly inside the view:

在ASP.NET MVC应用程序中生成URL时始终使用Url帮助程序,并且永远不要对它们进行硬编码。因此,如果此脚本直接位于视图中:

<script type="text/javascript">
    var url = '@Url.Action("a", "b")';
    $.get(url, function (data) {}, "json");
</script>

And if this script is inside a separate javascript file (as it should be) where you don't have access to server side helpers, you could simply put the url in some related DOM element. For example using HTML5 data-* attributes:

如果此脚本位于您无法访问服务器端帮助程序的单独的javascript文件(因为它应该是)中,您可以简单地将url放在一些相关的DOM元素中。例如,使用HTML5 data- *属性:

<div data-url="@Url.Action("a", "b")" id="foo">Click me</div>

and then in your javascript file:

然后在你的javascript文件中:

$('#foo').click(function() {
    var url = $(this).data('url');
    $.get(url, function (data) {}, "json"); 
});

and if you are unobtrusively AJAXifying an anchor or a form, well, you already have the url:

如果你不引人注目地AJAX化锚或表格,那么你已经有了网址:

$('a#someAnchor').click(function() {
    var url = this.href;
    $.get(url, function (data) {}, "json"); 
    return false;
});

#1