Loading...
+ Нов въпрос
venzo avatar venzo 1 Точки

Client и API на Localhost

Здравейте,

Искам да подкарам React приложение и Express API, което да ми изпълнява заявките на localhost с различни портове, но получавам следната грешка в браузъра: 

Cross-Origin Read Blocking (CORB) blocked cross-origin response http://localhost:1234/external with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

Разбирам, че трябва да се позволят заявките между отделни домейни, но не ми е ясно как става това.

Код на клиента:

fetch('http://localhost:1234/external', {
 headers: { 'Content-Type': 'application/json'},
 mode: 'no-cors' 
})
  .then(res => JSON.stringify(res))
  .then(data => console.log(data));

Код на сървъра:

let data = {data: "API request success"};
 module.exports = (req, res) => { 
 console.log("External request");
 if (req.pathname === '/external' && req.method === 'GET'){
 res.writeHead(200, { 
  'content-type':'application/json', 
  'access-control-allow-origin': 'http://localhost:3000', 
  "Access-Control-Allow-Headers": "Content-Type" });
  res.write(data);
  res.end(); }
 else { return true } };

Поздрави!

0
Module: JS Advanced 26/08/2018 19:48:35
dvdty avatar dvdty 497 Точки

{ 'content-type':'application/json', 'access-control-allow-origin': 'http://localhost:3000', "Access-Control-Allow-Headers": "Content-Type" }

 

Това не е валиден JSON. Само двойни кавички работят. Не съм сигурен дали е само там проблема, но след като си въвел MIME type json, а имаш грешка MIME type text/html, не мисля, че се разпознава както трябва.

Можеш да валидираш JSON с някой web tool, като: https://jsonlint.com/

-1
26/08/2018 19:28:29
Jeliozver avatar Jeliozver 356 Точки

Прав е голегата, че не е валиден JSON data обекта. Пробвай първо да го промениш на

let data = {"data": "API request success"};

или 

res.write(JSON.stringify(data));

Но след като си на експрес защо си пишеш ти хедърите? Express трабва да го прави автоматично за теб.

Препоръчвам ти да си инсталираш библиотеките body-parser и cors.

const EXPRESS = require('express');
const BODY_PARSER = require('body-parser');
const CORS = require('cors');

const APP = EXPRESS();

APP.use(BODY_PARSER.urlencoded({ extended: true }));
APP.use(BODY_PARSER.json());
APP.use(CORS());

И така кода в if-а може да остане само това

res.status(200).json(data); 

И то само би трябвало да свърши останалата работа.

0
27/08/2018 08:52:33
venzo avatar venzo 1 Точки

Колеги, благодаря и на двама Ви. Поствам като референция за други, които може да имат такъв проблем:

Клиент

const fetch = require('node-fetch');

fetch("http://localhost:1234")
    .then(res => res.json())	
    .then(body => console.log("response: ", body));	

Сървър

var express = require('express')
var app = express()

app.get('/', function (req, res) {
	console.log("Request received");
    res.json({name: "Admin is here"})
}).listen(1234);

console.log("Server listen on port: 1234")

 

0
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.