Erreur Access-Control-Allow-Origin lors de l'utilisation Owin

Question

J'ai un client aurelia et un serveur web. Quand j'utilise localhost et que je cours sur la même machine, ça marche très bien.

Mais lorsque je veux accéder au serveur à partir d'un autre ordinateur, la page se charge mais les appels api donnent l'erreur suivante: Non Access-Control-Allow-Origin En-tête est présent sur la ressource demandée. J'utilise owin et à mon insu j'ai besoin d'activer CORS pour owin.

J'ai fait follwing dans ma classe de démarrage: -

MISE À JOUR J'ai mis à jour ma classe avec la participation de Nenad mais est d'obtenir toujours la même erreur. Ci-dessous j'ai ajouté l'appel du client.

public void Configuration(IAppBuilder app) 
     { 

      this.container = new Container(); 
      // Create the container as usual. 
      container.Options.DefaultScopedLifestyle = new AsyncScopedLifestyle(); 

      // Register your types, for instance using the scoped lifestyle: 
      container.Register<IWebDeps, WebDeps>(Lifestyle.Singleton); 

      // This is an extension method from the integration package. 
      container.RegisterWebApiControllers(GlobalConfiguration.Configuration, Assembly.GetExecutingAssembly()); 

      container.Verify(); 

      app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll); 

      // Configure Web API for self-host. 
      var config = new HttpConfiguration() 
      { 
       DependencyResolver = 
       new SimpleInjectorWebApiDependencyResolver(container) 
      }; 

      var cors = new EnableCorsAttribute("*", "*", "*"); 
      config.EnableCors(cors); 

      config.MapHttpAttributeRoutes(); 
      config.Routes.MapHttpRoute(
       name: "DefaultApi", 
       routeTemplate: "api/{controller}/{id}", 
       defaults: new { id = RouteParameter.Optional } 
      ); 
      //// Custom Middleare 
      app.Use(typeof(CustomMiddleware)); 
      app.UseWebApi(config); 

      //New code: 
      app.Run(context => 
      { 
       context.Response.ContentType = "text/plain"; 
       return context.Response.WriteAsync("Hello, world."); 
      }); 
     } 

Mon programme principal appelle la classe STARTUP: -

using (Microsoft.Owin.Hosting.WebApp.Start<Startup>("http://localhost:8080")) 
      { 
       Console.WriteLine("Press [enter] to quit..."); 
       Console.ReadLine(); 
      } 

code client, 192.168.178.23 est l'adresse IP du serveur.

let baseUrl2 = "http://192.168.178.23:8080/api/status/getStatus"; 
    getStatus() { 
     return this.client.get(baseUrl2) 
      .then(response => { 
       return this.parseJSONToObject(response.content); 
     }); 
    } 

L'erreur dans Chrome:

XMLHttpRequest cannot load http://192.168.178.23:8080/api/status/getStatus . No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:9000 ' is therefore not allowed access. The response had HTTP status code 400.

Cors doit être activé maintenant droit? Mais je reçois toujours l'erreur lors d'un appel api. Est-ce que je manque des étapes? Notre approche est-elle mauvaise?

Toutes les suggestions sont les bienvenues!

Answer 1

Il s'avère que lorsque vous démarrez OWIN, les adresses doivent être http: // *: 8080. Au lieu de l'hôte local.

Answer 2

Vous devez configurer WebAPI pour qu'il fonctionne avec CORS.

1. Installer le paquet Nuget:

   Install-Package Microsoft.AspNet.WebApi.Cors 
   

2. Activer CORS sur HttpConfiguration objet:

   config.EnableCors(); 
   

3. Ajouter [EnableCors] attribut sur votre contrôleur:

   using System.Net.Http; 
   using System.Web.Http; 
   using System.Web.Http.Cors; 
   
   namespace WebService.Controllers 
   { 
       [EnableCors(origins: "www.example.com", headers: "*", methods: "*")] 
       public class TestController : ApiController 
       { 
       // Controller methods not shown... 
       } 
   } 
   

   ou enregistrer globalement via HttpConfig:

   var cors = new EnableCorsAttribute("www.example.com", "*", "*"); 
   config.EnableCors(cors); 
   

Plus de détails: Enabling Cross-Origin Requests in ASP.NET Web API 2

Answer 3

Ajouter cette ligne et vérifier,

app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll); 

et enlever,

var cors = new EnableCorsAttribute("*", "*", "*"); 
     config.EnableCors(cors); 

cela a fonctionné pour moi.