自分用めも

初心者ちっくなプログラムネタを中心に、自分用の覚え書きをメモっていくための場所です。

flask + flask_cors + blueprint + vueでCORSエラーでハマったメモ

Dockerで構築。

flaskがデフォルトで勝手に末尾のスラッシュをURL補完してリダイレクトする問題と、
flask_corsとnginxの設定が重複する問題
この2つが混ざってて2日ほどハマった。

結論としては、
リダイレクトせずスラッシュ無しを許容する(フロントエンド側のリクエスト方法の統一・管理は別問題とする)対応と、nginxの不要な設定を消す。
これでやっと動くようになった。

flask_cors

from flask_cors import CORS

# ~中略~

    # CORS
    CORS(
        app,
        expose_headers='token',
        supports_credentials=True
    )

APIのnginx.conf

    location / {
        include uwsgi_params;
        uwsgi_pass unix:/tmp/uwsgi.sock;

        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        add_header Access-Control-Allow-Methods '*';
        add_header Access-Control-Allow-Headers '*';
    }

flask_corsの設定と重複するため、nginx側に
add_header Access-Control-Allow-Origin '*';
は書かない。

Blueprint

@login.post('/', strict_slashes=False)
def index():

各デコレータにstrict_slashes=Falseを付与し、末尾のスラッシュ無しを許容するように修正。

この三点の修正でなんとか動くようになった。
疲れた。