javascript - 使用 Flask 解決跨來源資源共用問題
對於以下 ajax 發送到 Flask 的 post 請求(我如何在 Flask 中使用從 ajax 發送的數據?)
$.ajax({
url: "http://127.0.0.1:5000/foo",
type: "POST",
contentType: "application/json",
data: JSON.stringify({'inputVar': 1}),
success: function( data ) {
alert( "success" + data );
}
});
我得到一個 跨來源資源共用 (CORS) 錯誤:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'null' is therefore not allowed access.
The response had HTTP status code 500.
我試過用以下兩種方式解決它,但似乎都不行。
- 使用 Flask-CORS
這是一個用於處理 CORS 的 Flask 擴展,應該可以讓跨來源 AJAX 成為可能。
- http://flask-cors.readthedocs.org/zh/latest/
- 如何在 Flask 和 Heroku 中啟用 CORS
- 當應用 jwt 認證封裝時,Flask-cors 封裝無法工作。
- Javascript - 在請求的資源上不存在 'Access-Control-Allow-Origin' 標頭
我的 pythonServer.py 使用這個解決方案:
from flask import Flask
from flask.ext.cors import CORS, cross_origin
app = Flask(__name__)
cors = CORS(app, resources={r"/foo": {"origins": "*"}})
app.config['CORS_HEADERS'] = 'Content-Type'
@app.route('/foo', methods=['POST','OPTIONS'])
@cross_origin(origin='*',headers=['Content-Type','Authorization'])
def foo():
return request.json['inputVar']
if __name__ == '__main__':
app.run()
- 使用特定的 Flask 裝飾器
這是一個 官方 的 Flask 程式碼片段,定義了一個裝飾器,應該允許在它所裝飾的函式上使用 CORS。
- http://flask.pocoo.org/snippets/56/
- Python Flask 跨站 HTTP POST - 對特定允許的來源無效
- http://chopapp.com/#351l7gc3
我的 pythonServer.py 使用這個解決方案:
from flask import Flask, make_response, request, current_app
from datetime import timedelta
from functools import update_wrapper
app = Flask(__name__)
def crossdomain(origin=None, methods=None, headers=None,
max_age=21600, attach_to_all=True,
automatic_options=True):
if methods is not None:
methods = ', '.join(sorted(x.upper() for x in methods))
if headers is not None and not isinstance(headers, basestring):
headers = ', '.join(x.upper() for x in headers)
if not isinstance(origin, basestring):
origin = ', '.join(origin)
if isinstance(max_age, timedelta):
max_age = max_age.total_seconds()
def get_methods():
if methods is not None:
return methods
options_resp = current_app.make_default_options_response()
return options_resp.headers['allow']
def decorator(f):
def wrapped_function(*args, **kwargs):
if automatic_options and request.method == 'OPTIONS':
resp = current_app.make_default_options_response()
else:
resp = make_response(f(*args, **kwargs))
if not attach_to_all and request.method != 'OPTIONS':
return resp
h = resp.headers
h['Access-Control-Allow-Origin'] = origin
h['Access-Control-Allow-Methods'] = get_methods()
h['Access-Control-Max-Age'] = str(max_age)
if headers is not None:
h['Access-Control-Allow-Headers'] = headers
return resp
f.provide_automatic_options = False
return update_wrapper(wrapped_function, f)
return decorator
@app.route('/foo', methods=['GET','POST','OPTIONS'])
@crossdomain(origin="*")
def foo():
return request.json['inputVar']
if __name__ == '__main__':
app.run()
你能否給出一些為什麼會這樣的說明?
答案#1
你可以簡單地得到結果:
@app.route('your route', methods=['GET'])
def yourMethod(params):
response = flask.jsonify({'some': 'data'})
response.headers.add('Access-Control-Allow-Origin', '*')
return response
答案#2
嗯,我也遇到同樣的問題。對於可能會來到這個頁面的新用戶,只需按照他們的官方文檔操作。
安裝 flask-cors
pip install -U flask-cors
然後在應用初始化之後,使用預設參數初始化 flask-cors:
from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
CORS(app)
@app.route("/")
def helloWorld():
return "Hello, cross-origin-world!"
答案#3
在對你的程式碼進行位元修改後,它運作得非常好
initialization
app = Flask(__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"/foo": {"origins": "http://localhost:port"}})
@app.route('/foo', methods=['POST'])
@cross_origin(origin='localhost',headers=['Content- Type','Authorization'])
def foo():
return request.json['inputVar']
if __name__ == '__main__':
app.run()
我把 * 替換為 localhost。因為我在很多博客和帖子中讀到,你應該允許特定域名的訪問
