Как исправить: Origin ‹localhost› не разрешен Access-Control-Allow-Origin. с flask_cors

Я установил сервер с фляжкой CORS, и он работал для отправки данных в созданное мной веб-приложение React, но когда я пошел тестировать метод POST, он перестал работать, и теперь он не работает для отправки и получения. Журнал ошибок в консоли веб-приложения: "Origin http://localhost:3000 не разрешен Access -Control-Allow-Origin. Fetch API не может загрузить http://127.0.0.1:5000/ из-за проверки контроля доступа ".

Я столкнулся с этой проблемой раньше и добавил flask_cors, и какое-то время это работало. Вот мой серверный код:

from flask_cors import CORS, cross_origin

app = FlaskAPI(__name__)
app.config['SECRET_KEY'] = 'the quick brown fox jumps over the lazy dog'
app.config['CORS_HEADERS'] = 'Content-Type'

cors = CORS(app, resources={r"/": {"origins": "http://localhost:port"}})
# Also fails with this variation
# cors = CORS(app, resources={r"/api/*": {"origins": "*"}})

@app.route("/", methods=['GET', 'POST'])
@cross_origin(origin='localhost',headers=['Content- Type','Authorization'])
# Also fails with these variations
# @cross_origin(origin='http://127.0.0.1:5000/',headers=['Content- Type','Authorization'])
# @cross_origin(origin='http://localhost:3000',headers=['Content- Type','Authorization'])  
def job_api():
    with app.app_context():
        job_data = get_job_data()
        json_data = jsonify(eqtls=[job.data for job in job_data])
        return json_data

if __name__ == "__main__":
    app.run(debug=True)

Вот мой клиентский код:

  componentDidMount() {
        fetch('http://127.0.0.1:5000/')
        .then(res => res.json())
        .then((data) => {
          this.setState({ job_data: data.eqtls })
        })
        .catch(console.log)
  }

person kuck1    schedule 06.10.2019    source источник


Ответы (1)


Вам необходимо включить политику CORS в вашем API, чтобы он мог принимать запросы с разных хостов.

Просто сделайте cors Google Flask и убедитесь, что вы принимаете '*' или, в частности, свой URL.

Если вы принимаете cors, вы должны иметь возможность принять все CORS, а затем сделать свой API достаточно надежным, чтобы нельзя было запрашивать неприятные данные.

Пытаться:

from flask_cors import CORS, cross_origin

app = FlaskAPI(__name__)
app.config['SECRET_KEY'] = 'the quick brown fox jumps over the lazy dog'
app.config['CORS_HEADERS'] = 'Content-Type'


@app.route("/", methods=['GET', 'POST'])
@cross_origin()
def job_api():
    with app.app_context():
        job_data = get_job_data()
        json_data = jsonify(eqtls=[job.data for job in job_data])
        return json_data

if __name__ == "__main__":
    app.run(debug=True)

Я прочитал документацию и могу просто добавить @cross_origin () в качестве простого декоратора: https://flask-cors.readthedocs.io/en/latest/#route-specific-cors-via-decorator

person Sweet Chilly Philly    schedule 06.10.2019
comment
Я попробовал пару модификаций на основе вашего комментария (и просто добавил то, что пытался, к исходному вопросу), но он все равно не работает. - person kuck1; 07.10.2019
comment
cors = CORS (app, resources = {r /: {origins: localhost: port}}) эта строка выглядит неправильно. .. Что это делает? а также Port должен быть вашим портом, и это не похоже на то, что вы используете эту переменную cors. Также @cross_origin (origin = 'localhost', headers = ['Content- Type', 'Authorization ... Content-Type не имеет места в нем. Попробуйте добавить звездочку вместо localhost: @cross_origin (origin = '*' - person Sweet Chilly Philly; 07.10.2019
comment
Я не уверен, для чего нужен r, но он используется в таких примерах, как: flask-cors .readthedocs.io / en / latest. Я попытался заменить обе ссылки localhost на '*', но результат не изменился. - person kuck1; 07.10.2019
comment
Обновил мой ответ на основе документации, которую вы связали. - person Sweet Chilly Philly; 07.10.2019
comment
Итак, я вернул свой код туда, где он был раньше, и ваш метод работает (как и моя предыдущая версия). Это очень интересно, потому что я меняю то, откуда берутся данные: если get_job_data () вызывает Selenium в другом файле, он работает отлично, в противном случае, если у меня есть жестко закодированные тестовые значения того же типа в том же файле это не удается ... - person kuck1; 07.10.2019
comment
Рад, что помог :) Ваша проблема с архитектурой данных звучит как еще одна проблема. Или всего за пару часов трясти головой :) вы доберетесь до цели! - person Sweet Chilly Philly; 07.10.2019