swaggerからlaravelにリクエストするとCORS制限に引っかかる

swaggerとlaravelを別コンテナで動かしている。その時にswaggerからlaravelにリクエストしたら、以下のようなエラーが表示されてリクエストに失敗する。

Failed to fetch.
Possible Reasons:
CORS
Network Failure
URL scheme must be "http" or "https" for CORS request.

それぞれ以下の状態。動いているポートが違うので別のオリジン？となるらしく、ブラウザによりswagger → laravelへのリクエストが制限される。

swagger
- http://localhost:4000/
laravel
- http://localhost:8080/

制限を回避したいので、やり方をChatGPTに聞いたら、以下の回答があった。

自作ミドルウェアを作る
fruitcake/laravel-cors をインストールする

上記、どちらもlaravel側で対応する方法。開発中にしか実施しないので、laravelのソースに余計なものは入れたくない。。なので、laravelを動かすコンテナをビルドするときのapacheの設定で回避する。

Dockerfile

Dockerfileで、headersモジュールを有効にする。

RUN a2enmod rewrite headers

apache.conf

apache.confにAccess-Control-Allow部分を追記する。

<VirtualHost *:80>
    DocumentRoot /var/www/html/public

    <Directory /var/www/html/public>
        AllowOverride All
        Require all granted
    
        <IfModule mod_headers.c>
            Header set Access-Control-Allow-Origin "*"
            Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
            Header set Access-Control-Allow-Headers "Origin, Content-Type, Authorization, X-Requested-With"
        </IfModule>
    </Directory>
</VirtualHost>

上記に変更して再度、コンテナをビルドする。laravelのpublic/.htaccessに書く方法もあったけど、laravelはあまり変更したくないのでapache.confに書いた。