LoginSignup
5

More than 3 years have passed since last update.

Swagger-UI で TypeError: Failed to fetch が出て死ぬ

Last updated at Posted at 2020-05-08

apiの開発を行うため、swagger-uiを利用していたが、ローカル上のapiに通信を行っても、TypeError: Failed to fetch となり結果が表示できなかった。

原因

CORSの設定が必要な構成になっていたこと。

構成

api → localhost:80
swagger-ui → localhost:8001

修正内容

同じドメイン、ポート上で動くようにした(しろと公式に書いてあった)。
https://swagger.io/docs/open-source-tools/swagger-ui/usage/cors/

構成

nginx → localhost:80
nginxから振り分けでapi or swagger-ui


調査してわかったこと

別コンテナで動かしている際、下記で解決したと思っていたが、これではgetしか動かなかった

Access-Control-Allow-Origin を設定する

自分の場合は phpでslimを利用しているため


/** @var Psr\Http\Message\ResponseInterface $response */
$response->withHeader('Access-Control-Allow-Origin', '*');

とすることで解決した。(*は後で変えようとは思う。)

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
5