3
votes

L'accès à xmlhttprequest à partir de l'origine a été bloqué par la stratégie cors dans Angular 6

J'utilise Asp.Net Core Boilerplate framework pour mon projet côté serveur. Angular 6 pour le projet côté client. Projet côté serveur fonctionnant sans aucune erreur. (Affichage de l'API Swagger - et les API fonctionnent également)

Aucune erreur de compilation du projet Angular. Lorsque vous exécutez le projet angulaire à l'aide de Google Chrome, ( http: // localhost: 4200 / ) il affiche le message d'erreur suivant.

 entrez la description de l'image ici

La console du navigateur affiche ceci: -

Accès à XMLHttpRequest à l'adresse ' http://server.projectName.lk//AbpUserConfiguration/GetAll 'de l'origine " http: // localhost: 4200 " a été bloqué par la stratégie CORS: la réponse à la demande de contrôle en amont ne passe pas le contrôle d'accès vérifier: Aucun en-tête "Access-Control-Allow-Origin" n'est présent sur la ressource demandée.

Lorsque vous cliquez sur le bouton '' http://server.projectName.lk/ / AbpUserConfiguration / GetAll '', il s'ouvre dans un autre onglet et affiche l'erreur ci-dessous,

 entrez la description de l'image ici

Très bien appréciez vos idées pour résoudre ce problème.

REMARQUE: Aucune des questions précédentes ne m'a donné de solution.

Ceci est le journal des erreurs de débogage que vous recevoir pour ce numéro

> The thread 0x54b0 has exited with code 0 (0x0).
> Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request
> starting HTTP/1.1 OPTIONS
> http://localhost:21021/AbpUserConfiguration/GetAll  0
> Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Information: CORS
> policy execution failed.
> Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Information:
> Request origin http://localhost:4200 does not have permission to
> access the resource.
> Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request
> finished in 311.689ms 204 
> Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information:
> Route matched with {action = "Index", controller = "Home", area = ""}.
> Executing action San.BA.Web.Host.Controllers.HomeController.Index
> (San.BA.Web.Host) The program '[21292] dotnet.exe' has exited with
> code -1 (0xffffffff).

startup Fichier .cs


10 commentaires

" server.projectName.lk/AbpUserConfiguration/GetAll ", pouvez-vous simplement ouvrir un nouvel onglet et entrer cette URL.


Oui. Mais il donne un message d'erreur ci-dessus 404.0.


Qu'avez-vous changé avec le modèle de projet abp par défaut? Avez-vous publié le backend ou exécuté à partir de VS? Pour 404, il semble que l'url de la demande soit incorrecte, vérifiez la méthode dans swagger et partagez-nous la façon dont vous envoyez la demande du client.


La méthode api AbpUserConfiguration / GetAll n'existe pas du côté de votre serveur.


Salut Tao, j'ai ajouté des fichiers de projet existants dans le modèle de projet Abp par défaut téléchargé. Et j'ai dirigé le projet Abp avec VS ..


Existe-t-il une démo pour reproduire votre problème? Quelle est votre Startup et quelle est la AbpUserConfiguration ?


si vous obtenez une erreur pour l'action GetAll. consultez les journaux sur votre hôte


Créez un projet de repro sur GitHub.


@Tao Zhou Ajout du lien du fichier startup.cs à la fin de la question. Il n'y a aucune méthode ou fichier appelé AbpUserConfiguration dans le projet. Mais il est mentionné dans les anciens journaux.


Oui @HameedSyed .. La méthode api AbpUserConfiguration / GetAll n'existe pas du côté de mon serveur. Alors, que puis-je faire pour cela, pour me débarrasser de cette erreur?


3 Réponses :


2
votes

Le partage de ressources croisées d'origine (CORS) est une norme W3C qui permet à un serveur d'assouplir la politique de même origine. À l'aide de CORS, un serveur peut autoriser explicitement certaines demandes d'origine croisée tout en en rejetant d'autres. CORS est plus sûr et plus flexible que les techniques antérieures, telles que JSONP. Cette rubrique montre comment activer CORS dans une application ASP.NET Core.

Cela se produit en raison de l'échec de la politique CORS côté serveur. Comme vous devez soit ajouter l'URL du client dans le fichier appsettings.json dans le projet hôte.

"App": { ...... "CorsOrigins": " http: // localhost: 4200 " ...... }

Pour plus d'informations, vous pouvez vérifier l'URL suivante:
https://docs.microsoft .com / fr-fr / aspnet / core / security / cors? view = aspnetcore-2.2


2 commentaires

Réponse vraiment précieuse et utile. Mais "CorsOrigins" est déjà défini dans mon fichier appsettings.json lorsque vous avez répondu.


hébergez-vous l'API dans IIS?



0
votes

Je sais que c'est une vieille question, mais j'ai pensé que cela aiderait quiconque serait confronté à ce problème. Nous avons récemment rencontré la même erreur lorsque nous avons déplacé notre application basée sur ASP.NET WebAPI vers AWS. Il s'est avéré que l'équilibreur de charge (ALB) avait un délai d'expiration d'une minute, ce qui signifie que si une API prend plus d'une minute, ALB annulait la demande et étrangement Chrome donne l'erreur liée à CORS. Dans les journaux HTTPERR IIS, une telle demande était marquée comme Request_Cancelled. Comme l'une de nos API prenait plus d'une minute, nous avons dû changer la configuration du délai d'expiration dans l'ALB et les choses ont commencé à fonctionner sans problème! C'est un mystère pourquoi Chrome l'appelle CORS!


0 commentaires

1
votes

Allez simplement dans le fichier web.config et collez le code ci-dessous sous

system.webServer

<httpProtocol>  
    <customHeaders>  
     <add name="Access-Control-Allow-Origin" value="*" />  
     <add name="Access-Control-Allow-Headers" value="Content-Type" />  
     <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />  
    </customHeaders>  
  </httpProtocol> 


0 commentaires