4

フラスコ アプリケーション内で CORS をセットアップしたいと考えており、フラスココアを追加すると、特定のポイントまで役立ちました。「CORS(app)」は承認を必要としないすべてのルートに役立ちましたが、承認を必要とするルートにアクセスできません。

問題の1つのルートは次のようになります。

@users_blueprint.route('/users/<user_id>', methods=['GET'])
@authenticate
def get_single_user(resp, user_id):
response_object = {
    'status': 'failure',
    'message': 'Invalid Payload'
}

if resp != user_id:
    response_object['message'] = 'You are not authorized to view this user'
    return jsonify(response_object), 400

try:
    user = User.query.filter_by(user_id=user_id).first()
    if user:
        response_object['status'] = 'success'
        response_object['data'] = user.to_json()
        return jsonify(response_object), 200
    else:
        response_object['message'] = 'The user does not exist'
        return jsonify(response_object), 400
except (exc.IntegrityError, ValueError, TypeError) as e:
    db.session().rollback()
    return jsonify(response_object), 400

私はCORS設定をいじって、これまでのところこれを得ました:

#enable CORS
CORS(app, allow_headers=["Content-Type", "Authorization", \
        "Access-Control-Allow-Credentials"], supports_credentials=True)

しかし、フェッチを介して React アプリケーション内から問題のルートにアクセスしようとすると、次のエラーが発生します。

MYROUTE を読み込めませんでした: 要求されたリソースに「Access-Control-Allow-Origin」ヘッダーがありません。したがって、オリジン ' http://localhost:3000 ' へのアクセスは許可されません。応答に HTTP ステータス コード 502 が含まれていました。不透明な応答が必要な場合は、要求のモードを「no-cors」に設定して、CORS を無効にしてリソースをフェッチしてください。

他に何ができますか？

編集

CURL 経由で OPTIONS リクエストを送信すると、問題のルートが「access-control-allow」ヘッダーで応答することがわかります。だから私は何が起こっているのか本当に無知です。ここにも私のフェッチリクエストがあります:

const url = `myurlendpoint/myuserid`
const token = my_id_token
const options = {
  method: 'GET',
  headers: {
    'Authorization': `Bearer ${token}`,
    'Content-Type': 'application/json'
  }
};
fetch(url, options)
  .then(response => console.log(response.json()))
  .catch(error => console.log(error))

また、ヘッダー「承認」なしでルートを呼び出すと、クロスオリジンの問題ではなく、「認証が提供されていません」という正しい応答が返されます。このルートに cross-origin-allow が本当に設定されていない場合、承認なしでリクエストにそれを記載する必要がありますよね? したがって、Authorizationヘッダーと関係があります...

4

0 に答える 0