MVC web api: Nenhum header ‘Access-Control-Allow-Origin’ está presente no recurso solicitado

Eu tentei tudo o que está escrito neste artigo: http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api , mas nada funciona. Eu estou tentando obter dados de webAPI2 (MVC5) para usar em outro domínio usando angularJS.

meu controlador fica assim:

namespace tapuzWebAPI.Controllers { [EnableCors(origins: "http://local.tapuz.co.il", headers: "*", methods: "*", SupportsCredentials = true)] [RoutePrefix("api/homepage")] public class HomePageController : ApiController { [HttpGet] [Route("GetMainItems")] //[ResponseType(typeof(Product))] public List GetMainItems() { HomePageDALcs dal = new HomePageDALcs(); //Three product added to display the data //HomePagePromotedItems.Value.Add(new HomePagePromotedItem.Value.FirstOrDefault((p) => p.ID == id)); List items = dal.MobileSelectTopSecondaryItemsByCategory(3, 5); return items; } } } 

Você precisa ativar o CORS na sua Web Api . A maneira mais fácil e preferida de ativar o CORS globalmente é adicionar o seguinte no web.config

          

Por favor, note que os Métodos são todos especificados individualmente, em vez de usar * . Isso ocorre porque há um bug ocorrendo ao usar * .

Você também pode ativar o CORS por código.

Atualizar
O seguinte pacote NuGet é necessário: Microsoft.AspNet.WebApi.Cors .

 public static class WebApiConfig { public static void Register(HttpConfiguration config) { config.EnableCors(); // ... } } 

Então você pode usar o atributo [EnableCors] em Actions ou Controllers como este

 [EnableCors(origins: "http://www.example.com", headers: "*", methods: "*")] 

Ou você pode registrá-lo globalmente

 public static class WebApiConfig { public static void Register(HttpConfiguration config) { var cors = new EnableCorsAttribute("http://www.example.com", "*", "*"); config.EnableCors(cors); // ... } } 

Você também precisa manipular as solicitações de Options comprovação com solicitações HTTP OPTIONS .

Web API precisa responder à solicitação de Options para confirmar se está realmente configurada para suportar o CORS .

Para lidar com isso, tudo o que você precisa fazer é enviar uma resposta vazia de volta. Você pode fazer isso dentro de suas ações, ou você pode fazer isso globalmente assim:

 # Global.asax.cs protected void Application_BeginRequest() { if (Request.Headers.AllKeys.Contains("Origin") && Request.HttpMethod == "OPTIONS") { Response.Flush(); } } 

Esta verificação extra foi adicionada para garantir que as APIs antigas que foram projetadas para aceitar somente solicitações GET e POST não serão exploradas. Imagine enviar uma solicitação DELETE para uma API projetada quando esse verbo não existe. O resultado é imprevisível e os resultados podem ser perigosos .

@ Mihai-Andrei resposta Dinculescu está correta, mas para o benefício dos pesquisadores, há também um ponto sutil que pode causar esse erro.

Adicionar um ‘/’ no final do seu URL impedirá que o EnableCors funcione em todas as instâncias (por exemplo, na página inicial).

Ou seja, isso não vai funcionar

 var cors = new EnableCorsAttribute("http://testing.azurewebsites.net/", "*", "*"); config.EnableCors(cors); 

mas isso vai funcionar:

 var cors = new EnableCorsAttribute("http://testing.azurewebsites.net", "*", "*"); config.EnableCors(cors); 

O efeito é o mesmo se estiver usando o atributo EnableCors.

Eu segui todos os passos acima indicados por Mihai-Andrei Dinculescu .
Mas no meu caso, eu precisava de mais um passo porque o http OPTIONS estava desabilitado no Web.Config pela linha abaixo.

Acabei de removê-lo do Web.Config (apenas comentá-lo como abaixo) e Cors funciona como um encanto

    

Pode ser por causa da instalação de pacotes Cors Nuget.

Se você enfrenta o problema depois de instalar e enabaling cors de nuget, então você pode tentar reinstalar o Api web.

No gerenciador de pacotes, execute Update-Package Microsoft.AspNet.WebApi -reinstall

Tente isto, para ter certeza que você configurou o CORS corretamente:

 [EnableCors(origins: "*", headers: "*", methods: "*")] 

Ainda não funciona? Verifique a presença de headers HTTP.

Para que qualquer protocolo CORS funcione, você precisa ter um método OPTIONS em cada nó de extremidade (ou um filtro global com esse método) que retornará esses headers:

 Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET, POST, PUT, DELETE Access-Control-Allow-Headers: content-type 

O motivo é que o navegador enviará primeiro uma solicitação OPTIONS para “testar” seu servidor e ver as autorizações

@ Mihai-Andrei resposta Dinculescu funcionou para mim, por exemplo:

  • Adicionando um na seção do web.config
  • Retornando resposta vazia para pedidos OPTIONS via o mencionado Application_BeginRequest() em global.asax

Exceto que seu cheque para Request.Headers.AllKeys.Contains("Origin") não funcionou para mim, porque o pedido continha uma origing , então com letras minúsculas. Eu acho que meu navegador (Chrome) envia assim para solicitações CORS.

Eu resolvi isso um pouco mais genericamente usando uma variante insensitiva a maiúsculas e minúsculas de sua verificação Contains vez disso: if (culture.CompareInfo.IndexOf(string.Join(",", Request.Headers.AllKeys), "Origin", CompareOptions.IgnoreCase) >= 0) {

 Please make this change in webapi.config file to enable cors and avoid the below error 

asp.net webapi A resposta à solicitação de comprovação não passa na verificação de controle de access: Nenhum header ‘Access-Control-Allow-Origin’ está presente no recurso solicitado.

 public static class WebApiConfig { public static void Register(HttpConfiguration config) { // Web API configuration and services var cors = new EnableCorsAttribute("*", "*", "*"); config.EnableCors(cors); //... existing values in register seection } 

}