web-dev-qa-db-fra.com

Swagger UI - "TypeError: Impossible de récupérer" sur une réponse valide

Je viens de sortir le dernier Swagger du dépôt Git (3.0.19) en utilisant: https://github.com/swagger-api/swagger-ui.git et j'ai mis à jour mon API pour l'utiliser la nouvelle version.

Ran git describe --tags pour confirmer et ma version est actuellement: v3.0.19-6-gaab1403

Le problème que j'ai est celui décrit ici , où ma réponse est un 403 (je peux le voir dans l'inspecteur sur le navigateur) et bien que j'ai une réponse pour l'erreur 403, j'obtiens toujours le TypeError: Failed to fetch message.

enter image description here

enter image description here

Voici un extrait de ma définition concernant la réponse 403:

                    "403": {
                    "description": "Forbidden",
                    "headers": {
                        "Access-Control-Allow-Origin": {
                            "type": "string"
                        }
                    }
                },

J'ai également remarqué qu'il a été signalé ici cependant, je sais que ce n'est pas un problème CORS car j'ai testé les points de terminaison et les OPTIONS retournent correctement, tout comme les points de terminaison s'ils sont appelés avec des informations valides (je force ce 403).

Quelqu'un pourrait-il m'orienter dans la bonne direction, s'il vous plaît?

Mise à jour: J'ai depuis testé sur une réponse 401, avec la même réponse.

enter image description here

Et qu'un 400 fonctionne comme prévu:

enter image description here

swaggerswagger-uiswagger-2.0
12
Hexie

Pour tous ceux qui rencontrent ce problème;

Après une journée de dépannage et les gars du support Swagger me pointant dans la bonne direction, il s'avère que cela est actuellement provoqué par un bogue dans les autoriseurs personnalisés AWS API Gateway.

Nous utilisons actuellement AWS API Gateway pour gérer nos API, cela comprend la gestion de toutes nos autorisations via un autoriseur personnalisé. Le problème est que les autoriseurs personnalisés ne prennent actuellement pas en charge le passage des en-têtes dans la réponse et que Swagger UI a besoin du Access-Control-Allow-Origin:* dans les en-têtes de réponse pour afficher le code d'état HTTP correct.

Consultez ce fil AWS concernant le problème (qui remonte à plus d'un an déjà):

https://forums.aws.Amazon.com/thread.jspa?messageID=728839

Discussion sur l'interface utilisateur Swagger sur le même: https://github.com/swagger-api/swagger-ui/issues/34

MODIFIER/METTRE À JOUR

Ce problème a depuis été résolu grâce à l'utilisation des réponses de passerelle. Voir ce même forum (page 2):

https://forums.aws.Amazon.com/thread.jspa?messageID=728839

10
Hexie

J'ai rencontré cette erreur lors du développement local (c'est-à-dire qu'elle n'avait rien à voir avec AWS). La cause sous-jacente (violation CORS) est identique. Les informations suivantes peuvent aider les autres personnes qui rencontrent ce problème.

J'ai configuré connexion avec une spécification openapi qui faisait référence à http: // localhost: 9090 / . Lorsque le serveur de développement démarre, il indique "Running on http://0.0.0.0:9090/ ". Cette page semble fonctionner, mais l'interface utilisateur swagger utilise http: // localhost: 9090 / de la spécification openapi pour les demandes suivantes et affiche TypeError: Failed to fetch dans les résultats. La console du navigateur affiche Access to fetch at 'http://localhost:9090/vr/variation' from Origin 'http://0.0.0.0:9090'. La commande curl fournie a bien fonctionné; bien qu'initialement déroutant, le succès de la boucle est un indice que le problème est dû au blocage du navigateur plutôt qu'à une défaillance côté serveur.

(La connexion est basée sur Python flask et fournit un support étendu pour l'intégration openapi.)

5
Reece

Parce que le problème de l'origine croisée signifie que votre site Web est hébergé sur local ou avec le port 8000 ou un port différent, et que le numéro de port de votre swagger est différent, donc ce problème est authentique. Nous pouvons le réparer en donnant la permission.

Voici le code du nœud:

app.use( (request, response, next) => {
    response.header("Access-Control-Allow-Origin", "*");
    response.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

Nous pouvons également résoudre le problème en utilisant CORS npm. https://www.npmjs.com/package/cors

1
Chandan Gupta

Avertissement: - Cette réponse concerne les API développées à l'aide d'Asp.net Core

J'ai rencontré un problème similaire en essayant d'accéder aux API à partir de l'éditeur d'interface utilisateur Swagger. J'essayais d'accéder à certaines API développées à l'aide d'Asp.net Core, alors que l'éditeur d'interface utilisateur Swagger était hébergé sur Apache. J'étais face à CORS (Cross Orgin Request).

Je dois modifier mon code API pour autoriser la demande CORS en utilisant le code suivant: - Déclarez dans le fichier Startup.cs ayant la classe "StartupShutdownHandler"

private readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

Ajout d'une section de code dans la méthode ConfigureServices.

var str = ConfigurationHandler.GetSection<string>(StringConstants.AppSettingsKeys.CORSWhitelistedURL);
        if (!string.IsNullOrEmpty(str))
        {
            services.AddCors(options =>
            {
                options.AddPolicy(MyAllowSpecificOrigins,
                builder =>
                {
                    builder.WithOrigins(str);
            });
            });
        }

Ajout d'une ligne de code dans Configure Method.

 app.UseCors(MyAllowSpecificOrigins);

Référence Activer les demandes d'origine croisée (CORS) dans ASP.NET Core

1
hellowahab