Question

针对ajax（how can I use data posted from ajax in flask?）的以下Flask发布请求：

$.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 );
    }   
});

我收到Cross Origin Resource Sharing (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

这是处理Flask的{{1}}扩展，可以使跨域AJAX成为可能。

我的 pythonServer.py 使用此解决方案：

CORS

使用特定的Flask Decorator

这是一个官方 Flask代码段，定义了一个装饰器，它应该允许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()装饰它的功能。

我的 pythonServer.py 使用此解决方案：

CORS

能否请您说明原因？

Answer 1

您可以通过简单的方式获得结果：

data

Answer 2

在对代码进行位修改之后，它就像一个冠军一样

# 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替换了*。因为在我阅读许多博客和帖子时，您应该允许访问特定域

Answer 3

好吧，我遇到了同样的问题。适用于可能登陆此页面的新用户。只需按照他们的官方文档。

安装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!"

Answer 4

请注意，在Flask响应对象中设置Access-Control-Allow-Origin标头在许多情况下都很好（例如此标题），但在提供静态资源时（至少在生产设置中）它没有任何效果。这是因为静态资产由前端Web服务器（通常是Nginx或Apache）直接提供。因此，在这种情况下，您必须在Web服务器级别设置响应标头，而不是在Flask中。

有关详细信息，请参阅我之前写过的这篇文章explaining how to set the headers（在我的情况下，我试图对Font Awesome资产进行跨域服务）。

另外，正如@Satu所说，在JS AJAX请求的情况下，您可能只需要允许访问特定域。对于请求静态资产（如字体文件），我认为规则不太严格，允许任何域的访问更容易接受。

Answer 5

我使用decorator given by Armin Ronacher进行了一些修改（由于客户端请求的标头不同）。（我使用angular作为请求应用程序/ json类型的请求者）。

在以下位置对代码进行了稍微的修改，

from flask import jsonify

@app.route('/my_service', methods=['POST', 'GET','OPTIONS'])
@crossdomain(origin='*',headers=['access-control-allow-origin','Content-Type'])
def my_service():
    return jsonify(foo='cross domain ftw')

jsonify将发送一个application / json类型，否则为text / html。在我针对这些标头的请求中，标头被添加为客户端

 const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin':'*'
      })
    };
    return this.http.post<any>(url, item,httpOptions)

Answer 6

我用类似的东西挣扎了很多。请尝试以下方法：

使用某种可以显示HTML标题的浏览器插件。
输入服务的URL，并查看返回的标头值。
确保将Access-Control-Allow-Origin设置为一个且只有一个域，该域应该是请求源。不要将Access-Control-Allow-Origin设置为*。

如果这没有帮助，请看一下这篇文章。它是关于PHP的，但它确切地描述了必须将哪些头设置为CORS的工作值。

CORS That Works In IE, Firefox, Chrome And Safari

Answer 7

注意：cross_origin的位置应该正确并且已安装依赖项。在客户端，请确保指定使用哪种类型的数据服务器。例如application / json或text / html

对我来说，下面编写的代码很神奇

from flask import Flask,request,jsonify
from flask_cors import CORS,cross_origin
app=Flask(__name__)
CORS(app, support_credentials=True)
@app.route('/api/test', methods=['POST', 'GET','OPTIONS'])
@cross_origin(supports_credentials=True)
def index():
    if(request.method=='POST'):
     some_json=request.get_json()
     return jsonify({"key":some_json})
    else:
        return jsonify({"GET":"GET"})


if __name__=="__main__":
    app.run(host='0.0.0.0', port=5000)

Answer 8

我可能在这个问题上迟到了，但通过以下步骤解决了该问题

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

使用Flask解决跨源资源共享问题

8 个答案: