Я работаю над довольно простым проектом для школы. Я и мой товарищ по команде выбрали AWS-Cloud9 в качестве нашей платформы, которую я научился использовать на лету, когда мы прогрессировали. Моя работа - это сценарии. У меня есть серверная часть NodeJS, использующая Express для запросов к моей БД, и у меня есть JS на стороне клиента, чтобы отправить сообщение с данными формы на серверную часть. По причинам, которые я не понимаю, я получаю следующую ошибку:
Блокировка перекрестного чтения (CORB) заблокировала ответ перекрестного происхождения / Адрес моего проекта / search.js с типом MIME 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();
}
Backend
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 служит областью ответа для отображения либо сообщения, указывающего, что сервер не выполнил свой запрос или иным образом отобразил объект ответа. Это сценарий тестирования. После того, как я преодолею это препятствие, я буду успешно анализировать возвращенные объекты ответа и более точно манипулировать страницей ответа