Web API URL在浏览器之间的行为不同

Question

我正在使用jQuery在我的网站上进行一些Web API调用。

• 当我使用Chrome测试时，它可以正常使用
• 当我使用IE 11测试时，它失败为404

我注意到IE 11正在为我提供子网站名称，但Chrome没有，这解释了为什么IE 11会显示404。

问：如何解决此问题，以便浏览器无关紧要？

JavaScript的：

$.ajax({
    type: 'GET',
    data: {},
    url: 'outboundevents/api/outboundevent/actions/ping',
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
});

工具'网络'标签报告：

引荐：
这两个浏览器都是一样的

• https://myaddress/outboundevents

Internet Explorer
请注意IE 11如何将网站名称放置两次......

• 请求：/ outboundevents / outboundevents / api / outboundevent / actions / ping HTTPS GET 404
• 网址：https://myaddress/outboundevents/outboundevents/api/outboundevent/actions/ping

铬

• 请求：/ outboundevents / api / outboundevent / actions / ping HTTPS GET 200
• 网址：https://myaddress/outboundevents/api/outboundevent/actions/ping

Answer 1

IE可能会将outboundevents视为目录，Chrome将其视为文件。如果发生这种情况，那么相对路径将会有所不同，因为IE认为您正在追加outboundevents，Chrome认为您正在替换它。我能想到这种情况的唯一方法就是如果你在IE中有一个斜杠，而不是在主URL栏中的Chrome中。

为避免使用相对URL出现问题，您应尽可能让应用程序构建URL。

假设您在Web应用程序上使用ASP.NET MVC：

如果您的javascript在页面中，则可以在那里执行：

$.ajax({
    url: "@Url.Content("~/outboundevents/api/outboundevent/actions/ping")"
});

如果javascript位于单独的文件中，那么您可以在布局页面或HTML中的其他位置定义URL，然后检索它：

<input type="hidden" id="ping-action-url" value="@Url.Content("~/outboundevents/api/outboundevent/actions/ping")">

$.ajax({
    url: jQuery("#ping-action-url").val()
});

您可以在全局javascript变量中编写这些字段，或者只是在布局页面上编写根目录，并将根目录与脚本文件中的本地URL连接起来，而不是单个隐藏字段。