相关疑难解决方法(0)

我有一个涉及的设置

前端服务器(Node.js,domain:localhost:3000)<--->后端(Django,Ajax,域:localhost:8000)

浏览器< - webapp < - Node.js(服务应用)

浏览器(webapp) - > Ajax - > Django(服务ajax POST请求)

现在,我的问题在于CORS设置,webapp使用它来向后端服务器进行Ajax调用.在chrome中,我一直在努力

当credentials标志为true时,无法在Access-Control-Allow-Origin中使用通配符.

在Firefox上也不起作用.

我的Node.js设置是:

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', 'http://localhost:8000/');
    res.header('Access-Control-Allow-Credentials', true);
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
};

而在Django我使用这个中间件 与此相伴

webapp发出如下请求:

$.ajax({
    type: "POST",
    url: 'http://localhost:8000/blah',
    data: {},
    xhrFields: {
        withCredentials: true
    },
    crossDomain: true,
    dataType: 'json',
    success: successHandler
});

因此,webapp发送的请求标头如下所示:

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: "Origin, X-Requested-With, Content-Type, Accept"
Access-Control-Allow-Methods: 'GET,PUT,POST,DELETE'
Content-Type: application/json 
Accept: */*
Accept-Encoding: gzip,deflate,sdch
Accept-Language: …

对于以下ajax发布请求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 );
    }   
});

我收到一个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.

我尝试用以下两种方式解决它,但似乎没有一种方法可行.

1. 使用Flask-CORS

这是Flask处理的扩展CORS,应该使跨源AJAX成为可能.

• http://flask-cors.readthedocs.org/en/latest/
• 如何在flask和heroku中启用CORS
• 当应用jwt auth包装时,Flask-cors包装器不工作.
• Javascript - 请求的资源上没有"Access-Control-Allow-Origin"标头

我的pythonServer.py使用这个解决方案:

from flask import Flask …

我对反应很陌生，我正在尝试掌握如何正确使用 fetch。我有这个 python 烧瓶路线，我试图从后端点击它，它看起来像这样：

@app.route('/api/v1', methods=['POST'])
def postTest():
    if not request.json:
        return "not a json post"
    return "json post succeeded"

现在，当我与邮递员达成这一点时，我实际上能够获得成功的信息。

这是我的 reactjs fetch 的样子：

@app.route('/api/v1', methods=['POST'])
def postTest():
    if not request.json:
        return "not a json post"
    return "json post succeeded"

每当我运行我的应用程序并尝试将这个函数读到控制台时，我得到的结果是这样的：

有人可以向我解释我做错了什么以及我能做些什么来解决这个问题。我将不胜感激。

我是烧瓶和角度的新手，请耐心等待。

我一直被 CORS 的问题困扰。我应用了不同的代码修复只是为了使其工作。现在我得到的错误是

Access to XMLHttpRequest at \'http://localhost:5000/dashboard/clientscount/2019/2020\' from origin \'http://localhost:8080\' has been blocked by CORS policy: Response to preflight request doesn\'t pass access control check: It does not have HTTP ok status.\n

我认为我的问题的答案来自这篇文章的已回答问题：已被 CORS 策略阻止：对预检请求的响应不\xe2\x80\x99t 通过访问控制检查，特别是此代码

if r.Method == "OPTIONS" {\n    w.WriteHeader(http.StatusOK)\n    return\n}\n

但这是用go语言写的。我正在烧瓶中工作。我的问题是如何在烧瓶中制作这个？同样在参考答案中，它说响应最初的请求，但我不确定如何继续该请求。

如果您能为我指出正确的方向或文档，我将非常感激。