我正在尝试使用jquery发出跨域请求,但它一直被消息拒绝
XMLHttpRequest无法加载http://..。请求的资源上不存在“Access-Control-Allow-Origin”标头。起源..。因此不允许访问。
我正在使用flask、heroku和jquery
客户端代码如下所示:
$(document).ready(function() {
$('#submit_contact').click(function(e){
e.preventDefault();
$.ajax({
type: 'POST',
url: 'http://...',
// data: [
// { name: "name", value: $('name').val()},
// { name: "email", value: $('email').val() },
// { name: "phone", value: $('phone').val()},
// { name: "description", value: $('desc').val()}
//
// ],
data:"name=3&email=3&phone=3&description=3",
crossDomain:true,
success: function(msg) {
alert(msg);
}
});
});
});
在heroku端,我使用的是flask,它是这样的
from flask import Flask,request
from flask.ext.mandrill import Mandrill
try:
from flask.ext.cors import CORS # The typical way to import flask-cors
except ImportError:
# Path hack allows examples to be run without installation.
import os
parentdir = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
os.sys.path.insert(0, parentdir)
from flask.ext.cors import CORS
app = Flask(__name__)
app.config['MANDRILL_API_KEY'] = '...'
app.config['MANDRILL_DEFAULT_FROM']= '...'
app.config['QOLD_SUPPORT_EMAIL']='...'
app.config['CORS_HEADERS'] = 'Content-Type'
mandrill = Mandrill(app)
cors = CORS(app)
@app.route('/email/',methods=['POST'])
def hello_world():
name=request.form['name']
email=request.form['email']
phone=request.form['phone']
description=request.form['description']
mandrill.send_email(
from_email=email,
from_name=name,
to=[{'email': app.config['QOLD_SUPPORT_EMAIL']}],
text="Phone="+phone+"\n\n"+description
)
return '200 OK'
if __name__ == '__main__':
app.run()
发布于 2014-10-16 11:11:49
以下是当我部署到Heroku时对我起作用的方法。
http://flask-cors.readthedocs.org/en/latest/
通过运行- pip install -U flask-cors
安装flask-cors
from flask import Flask
from flask_cors import CORS, cross_origin
app = Flask(__name__)
cors = CORS(app)
app.config['CORS_HEADERS'] = 'Content-Type'
@app.route("/")
@cross_origin()
def helloWorld():
return "Hello, cross-origin-world!"
发布于 2017-08-22 20:55:25
好吧,我不认为galuszkak提到的官方代码片段应该到处使用,我们应该关注在处理过程中可能会触发一些bug的情况,比如hello_world
函数。无论响应是否正确,我们都应该关注Access-Control-Allow-Origin
报头。所以,事情很简单,就像bellow:
@blueprint.after_request # blueprint can also be app~~
def after_request(response):
header = response.headers
header['Access-Control-Allow-Origin'] = '*'
return response
这就是全部~~
发布于 2018-10-18 22:06:25
我刚刚遇到了同样的问题,我开始相信其他答案比它们需要的要复杂一些,所以对于那些不想依赖更多库或装饰器的人,这里是我的方法:
CORS请求实际上由两个HTTP请求组成。印前检查请求,然后是仅在印前检查成功通过时才发出的实际请求。
印前检查请求
在实际的跨域POST
请求之前,浏览器会发出一个OPTIONS
请求。此响应不应返回任何正文,而是只返回一些令人放心的头部,告诉浏览器执行此跨域请求是正常的,并且它不是某些跨站点脚本攻击的一部分。
我编写了一个Python函数来使用flask
模块中的make_response
函数构建此响应。
def _build_cors_preflight_response():
response = make_response()
response.headers.add("Access-Control-Allow-Origin", "*")
response.headers.add("Access-Control-Allow-Headers", "*")
response.headers.add("Access-Control-Allow-Methods", "*")
return response
此响应是一个适用于所有请求的通配符响应。如果您想通过CORS获得额外的安全性,您必须提供来源、headers和方法的白名单。
此响应将说服您的(Chrome)浏览器继续执行实际请求。
实际的请求
在处理实际请求时,您必须添加一个CORS头-否则浏览器不会向调用的JavaScript代码返回响应。相反,请求将在客户端失败。使用jsonify的示例
response = jsonify({"order_id": 123, "status": "shipped"}
response.headers.add("Access-Control-Allow-Origin", "*")
return response
我还为此编写了一个函数。
def _corsify_actual_response(response):
response.headers.add("Access-Control-Allow-Origin", "*")
return response
允许您返回一行代码。
最终代码
from flask import Flask, request, jsonify, make_response
from models import OrderModel
flask_app = Flask(__name__)
@flask_app.route("/api/orders", methods=["POST", "OPTIONS"])
def api_create_order():
if request.method == "OPTIONS": # CORS preflight
return _build_cors_preflight_response()
elif request.method == "POST": # The actual request following the preflight
order = OrderModel.create(...) # Whatever.
return _corsify_actual_response(jsonify(order.to_dict()))
else:
raise RuntimeError("Weird - don't know how to handle method {}".format(request.method))
def _build_cors_preflight_response():
response = make_response()
response.headers.add("Access-Control-Allow-Origin", "*")
response.headers.add('Access-Control-Allow-Headers', "*")
response.headers.add('Access-Control-Allow-Methods', "*")
return response
def _corsify_actual_response(response):
response.headers.add("Access-Control-Allow-Origin", "*")
return response
https://stackoverflow.com/questions/25594893
复制相似问题