python[flask] ✖︎ dockerでAPIを作成

ディレクトリ構成
Dockerfile
docker-compose.yml
app.py
1. つまづきポイント
  1. CORSを怠った状態の記述
  2. ドキュメント通りに記述
requirements.txt

ディレクトリ構成

ディレクトリ構成は以下のようになります

.
├── Dockerfile
├── app
│   ├── app.py
│   └── requirements.txt
└── docker-compose.yml

Dockerfile

# pythonのバージョンは任意
FROM python:3.8

WORKDIR /usr/src/app
ENV FLASK_APP=app

COPY /app/requirements.txt ./

RUN pip install --upgrade pip
RUN pip install -r requirements.txt

docker-compose.yml

version: "3"
services:
  app:
    build: .
    ports:
      - "5001:5000"
    container_name: app
    volumes:
      - ./app:/usr/src/app
    command: flask run --host=0.0.0.0

app.py

from flask import Flask, request

app = Flask(__name__)

@app.after_request
def after_request(response):
    response.headers.add('Access-Control-Allow-Origin', '*')
    response.headers.add('Access-Control-Allow-Headers', 'Content-Type,Authorization')
    response.headers.add('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS')
    return response

@app.route("/", methods=["GET"])
def index():
    return "a"

つまづきポイント

API化するので、CORS対策が必要。動けばいいという方はつまづきポイントはスキップして大丈夫です。

CORSは、悪意のある行動を起こしかねないリソースの分離を目的としている仕組みです(セキュリティ対策)。

CORSを怠った状態の記述

from flask import Flask

app = Flask(__name__)

@app.route("/")
def helloWorld():
  return "Hello, cross-origin-world!"

この記述では、Access to XMLHttpRequest at ......... No 'Access-Control-Allow-Origin' header is present on the requested resource.

というエラーがデベロッパーツール上で表示されます。

CORS対策が必要なので、ドキュメントを参照します。

ドキュメント通りに記述

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route("/")
def helloWorld():
  return "Hello, cross-origin-world!"

しかし、CORS対策をドキュメント通りに記述しても、私の環境では解決できませんでした。

調べると、こちらのサイトに解決策が記述されておりました。

requirements.txt

flask==2.0.1