如何修改我的Web API服务器代码以添加Access-Control-Allow-Origin'标头? [英] How do I modify my Web API server code to add a Access-Control-Allow-Origin' header?
问题描述
我有一个Web API应用程序,并且能够使用Windows窗体实用程序调用其REST方法;我也想从HTML/jQuery实用程序中调用它们,并尝试通过跟随
I have a Web API app and am able to call its REST methods with a Windows forms util; I want to call them from an HTML/jQuery util, too, and tried to do so by following along with this tutorial.
我发现了一些信息,该信息指示我需要以某种方式在服务器端添加一条指令以允许这种类型的调用,例如来自
And I find info that indicates that I need to somehow add a directive on the server side allowing this type of call, such as from here.
...但是不确切知道我需要添加什么以及在哪里使它起作用.
...but do not know exactly what I need to add, and where, to get this to work.
我在浏览器控制台(在Chrome中)收到的特定消息是:
The specific message I get in the browser Console (in Chrome) is:
XMLHttpRequest cannot load http://localhost:28642/api/VendorItems/GetAll. No 'Access-
Control-Allow-Origin' header is present on the requested resource. Origin
'http://localhost:54161' is therefore not allowed access.
我还尝试用我的计算机名称和IP地址替换调用"localhost",但是它们都导致相同的err msg.
I also tried replacing calling "localhost" with my machine name, and with my IP Address, but they all lead to that same err msg.
无论如何,如果我很奇怪,我可以从Windows Forms应用程序中毫无问题地调用这些方法,而从浏览器-whammo中调用这些方法!
At any rate, it's kind if odd/I'm kind of awed that I can call those methods from a Windows Forms app with no problem, but from a browser - whammo!
我试图通过将Cors软件包安装到我的Web API/服务器应用程序中来做注释中提供的链接中的第一件事,但失败了:
I tried to do the first thing necessary in the link provided in the comment, by trying to install the Cors package into my Web API/server app, and it failed:
PM> Install-Package Microsoft.AspNet.WebApi.Cors -pre -project WebService
Install-Package : No compatible project(s) found in the active solution.
At line:1 char:1
+ Install-Package Microsoft.AspNet.WebApi.Cors -pre -project WebService
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ CategoryInfo : InvalidOperation: (:) [Install-Package], InvalidOperationException
+ FullyQualifiedErrorId : NuGetNoCompatibleProjects,NuGet.PowerShell.Commands.InstallPackageCommand
PM>
......,然后在NuGet GUI的"Online"程序包中搜索"Microsoft.AspNet.WebApi.Cors",结果为未找到任何项目."
...and searching Online packages in the NuGet GUI for "Microsoft.AspNet.WebApi.Cors" results in "No items found."
推荐答案
From here, I see that there are simple ways with ASP.NET MVC/Web API.
using System;
using System.Web.Http.Filters;
public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
{
public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
{
if (actionExecutedContext.Response != null)
actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Origin", "*");
base.OnActionExecuted(actionExecutedContext);
}
}
因此,现在您已经定义了AllowCrossSiteJson
操作过滤器属性的含义.剩下的只是将动作过滤器属性添加到您选择的控制器或方法中.
So now you have defined what an AllowCrossSiteJson
Action Filter Attribute means. The rest is just a matter of adding the Action Filter Attribute to the controllers or methods of your choice.
[AllowCrossSiteJson]
public class ValuesController : ApiController
{
或单个API调用:
[AllowCrossSiteJson]
public IEnumerable<PartViewModel> Get()
{
...
}
您还可以将CORS实施限制为您选择的受信任站点.您只需将"*"
更改为"http://your-domain.com,http://your-domain-2.com"
等即可.请注意,逗号分隔以及协议(http://或https://)已包含在原始规范中.如果要提供localhost,请确保已包含端口号.
You could also restrict the CORS implementation to your selection of trusted sites. You should just change the "*"
to "http://your-domain.com,http://your-domain-2.com"
etc. Note the comma separation and the inclusion of the protocol (http:// or https://) in the origin specification. If you are providing localhost, make sure the port number is included.
希望有帮助! :)
这篇关于如何修改我的Web API服务器代码以添加Access-Control-Allow-Origin&#39;标头?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!