首页 > 解决方案 > 将 AWS Amplify 前端连接到 AWS Elastic Beanstalk 后端时出现 CORS 问题

问题描述

背景:我的应用程序的前端 (Vue) 部署在 AWS Amplify 上,后端 (Python) 部署在 AWS Elastic Beanstalk 上。我的前端通过 Axios 连接到后端。

问题:从前端向后端发送数据时,我得到一个CORS error Access to XMLHttpRequest at '***' from origin '***' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

当我的前端向本地主机发送数据时,没有问题,所以我认为我的代码没有问题。我需要更改 Elastic Beanstalk 配置吗?

我不确定我需要包含哪些代码才能得到正确的答案,所以请让我知道你想看到什么,我可以适当地更新问题。我在application.py下面添加了我的代码,目前正在使用 Flask-CORS。

from flask import Flask, render_template
from flask import request, session
from flask_cors import CORS
import os
from common.api import api
from journal_blueprint import journal_blueprint
from manuscript_blueprint import manuscript_blueprint
from user_blueprint import user_blueprint
from models.decorators import requires_login
from models.user import User
from models.manuscript import Manuscript
from models.journal import Journal
from config_file import BaseConfig

application=Flask(__name__)

application.secret_key = BaseConfig.SECRET_KEY
application.config['SQLALCHEMY_DATABASE_URI'] = os.environ["DATABASE_URL"]

CORS(application)

application.register_blueprint(journal_blueprint, url_prefix='/journal')
application.register_blueprint(user_blueprint, url_prefix='/user')
application.register_blueprint(manuscript_blueprint, url_prefix='/manuscript')
application.register_blueprint(api, url_prefix="/api")


@application.route('/')
def home_template():
    return render_template('index.html')


@application.route('/login')
def login_template():
    return render_template('user/login.html')


@application.route('/register')
def register_template():
    return render_template('user/register.html')


if __name__ == '__main__':
    # application.run(debug=True)
    application.run()

标签: pythonamazon-web-servicesvue.jsflaskcors

解决方案


您的配置看起来不错。请在 elasticbeantalk 日志中查找错误。应用程序可能会在 elasticbeanstalk 环境中抛出一些错误,在此期间不会返回 CORS 标头。


推荐阅读