локальная разработка в локальном веб-приложении и локальный доступ заблокирован политикой Cors - PullRequest
Новая
       45

локальная разработка в локальном веб-приложении и локальный доступ заблокирован политикой Cors

0 голосов
/ 09 июля 2019

Я пытаюсь разработать как веб-приложение, так и API, но я работаю над блокировкой cors. Это немного ново для меня, но я бы хотел быть лучше.

Итак, у меня есть экспресс-сервер для API: 

const express = require('express')
const cors = require('cors')
const app = express()

module.exports = app.post('/posttest/', cors(), async (req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  res.json({ msg: 'WHOAH with CORS it works!' })
})

Служит локально http://localhost:3000 "posttest" - модуль, указанный выше для моего маршрута. 

const posttest = require('./src/routes/posttest.js')
const server = require('http').createServer();
const { Router } = require('express');

server
  .on(
    'request',
    Router({ mergeParams: true })
    .use( posttest )
  )
  .on('listening', () =>{
    console.log('listeing');
  })
  .on('error', () => {
    console.log('ERROR!!!!');
  })
  .listen(3000);

Тогда у меня есть веб-приложение, которое отправляет запрос Post с использованием fetch: 

fetch('http://localhost:3000/posttest/', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
    },
    body: JSON.stringify({text:'test'}),
    mode: 'cors' }) .then( (res) => {   //resolve }) .catch( (err) => {   //error    });

Следует также отметить, что веб-приложение обслуживается локально на localhost: 8080

Итак, проблема в том, что когда я пытаюсь сделать запрос по почте, я получаю

следующая ошибка. Доступ к выборке в 'http://localhost:3000/posttest/' из источника 'http://localhost:8080' заблокирован политикой CORS: Ответ на предполетный запрос не проходит проверку контроля доступа: Нет Заголовок «Access-Control-Allow-Origin» присутствует в запрошенном ресурс. Если непрозрачный ответ удовлетворяет вашим потребностям, установите запрос режим 'no-cors' для извлечения ресурса с отключенным CORS.

Для чего стоит я использую хром. Так что здесь происходит? Я думал, что если бы я включил res.header('Access-Control-Allow-Origin', '*'); Это решило бы мои проблемы. Почтальон может успешно получить доступ к маршруту. Но когда я использую браузер, ему отказывают. То же самое происходит, если я запускаю сервер и веб-приложение в производство. Что мне не хватает? Не могли бы вы объяснить, что мне пять лет?

Заранее спасибо за вашу помощь.

1 Ответ

0 голосов
/ 09 июля 2019

предполетный запрос является запросом OPTIONS, а ваш обработчик cors() привязан только к POST запросам (через .post).Используйте 

  app.use(cors());

для глобального отключения CORS (и ответа на предварительные полеты).Вы также можете включить предполетные запросы для одного маршрута: 

  app.options("/posttest/", cors());
  app.post('/posttest/', cors(), async (req, res, next) => {  
   res.json({ msg: 'WHOAH with CORS it works!' });
  });
...