How do I modify my Web API server code to add a Access-Control-Allow-Origin' header?

爷,独闯天下 提交于 2019-12-08 01:59:14

问题


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.

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.

I also tried replacing calling "localhost" with my machine name, and with my IP Address, but they all lead to that same err msg.

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!

UPDATE

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> 

...and searching Online packages in the NuGet GUI for "Microsoft.AspNet.WebApi.Cors" results in "No items found."


回答1:


From here, I see that there are simple ways with ASP.NET MVC/Web API.

For ASP.NET 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);
    }
}

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.

Tag a whole API controller:

[AllowCrossSiteJson]
public class ValuesController : ApiController
{

Or individual API calls:

[AllowCrossSiteJson]
public IEnumerable<PartViewModel> Get()
{
    ...
}

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.

Hope that helps! :)



来源:https://stackoverflow.com/questions/21561121/how-do-i-modify-my-web-api-server-code-to-add-a-access-control-allow-origin-hea

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!