0

我正在为学校做一个非常简单的项目。我和我的队友选择 AWS-Cloud9 作为我们的平台，随着我们的进步，我学会了动态使用它。我的工作是脚本。我有一个使用 Express 来查询我的数据库的 NodeJS 后端，并且我有一个客户端 JS 将带有表单数据的帖子发送到后端。由于我不明白的原因，我收到以下错误：Cross-Origin Read Blocking (CORB) blocked cross-origin response / Address of my project /search.js with MIME type text/html

在过去的 8 个小时里，我一直在互联网上上下移动，但找不到有效的解决方案。我尝试将 cors 包添加到我的后端，我尝试操作客户端和后端标头

客户端

document.getElementById("search_form").onsubmit = function(event) {
    var val = document.getElementById("search_bar").textContent;
    var data = JSON.stringify(val);

    var fetchParams = {
        headers: {
            'Access-Control-Allow-Origin': '*',
            'User-Agent': 'JDevo/1.0',
            'Content-Type': 'application/json',
        },
        body: data,
        method: 'POST',
        mode: 'cors'
    };

    window.fetch('/*c9 address of my project*//queryDB.js/', fetchParams)
        .then(res => function(res) {
            document.getElementById("main_page").style.display = "none";
            document.getElementById("results_page").style.display = "block";
            if (res.status !== 200) {
                document.getElementById("dummy").innerHTML = "There was a problem with the response";
                return;
            }
            var games = JSON.parse(res.body);
            document.getElementById("dummy").innerHTML = games;
        });
    event.preventDefault();
}

后端

var mysql = require('mysql');
var express = require("express");
var cors = require('cors');

var app = express();
app.use(cors());

var con = mysql.createConnection({/*DB params*/
});

app.post('/*c9 project address*//queryDB.js/', function(req, res) {
    //var searchItem = req.body.query;
    var searchItem = 'sekiro';/*testing backend with locked value to make sure a response is being sent*/

    con.connect(function(err) {
        if (err) throw err;
        console.log("Connected");

        var sql = 'Select * FROM gamesMerged WHERE gameName LIKE "%' + searchItem + '%";';

        con.query(sql, function(err, result) {
            if (err) throw err;
            console.log(result);
            res.status(200).json(JSON.stringify(result));
        });
    });

});
app.listen(3000);

期望帖子成功拉出响应，然后导致主页 div 在结果页面 div 弹出时隐藏，“虚拟” div 用作响应区域以显示指示后端失败的消息它是请求，或者以其他方式显示响应对象。这是一个测试场景，一旦我通过了这个障碍，我将解析成功返回的响应对象并更准确地操作响应页面

4

1 回答 1

0

没关系，我想通了。经过进一步审查，我发现我的 html 脚本标签的 src 属性写错了

于 2019-04-25T03:56:09.357 回答