Как разрешить Access-Control-Allow-Origin с помощью реакций и webpack?

Question

Я запускаю responsejs на локальном сервере с помощью webpack. Мне нужно сделать ajax-вызов от моего приложения-клиента (клиентской стороны) к моему серверу, который также является локальным размещенным сервером, но использует другой порт. Когда я делаю запрос на мой бэкэнд от почтальона, проблем нет. Но когда я пытаюсь сделать то же самое с моей среагировать JS приложения, я получил эту ошибку в моей консоли:

XMLHttpRequest cannot load http://localhost:8888/api. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. 

Uncaught (in promise) Error: Network Error 
at createError (createError.js:15) 
at XMLHttpRequest.handleError (xhr.js:87) 

Это, как представляется, проблема C.O.R.S. После нескольких часов исследований в Интернете я не могу найти решение.

Существует мой код

реагируют:

handleClick(){ 
 
     console.log('focused') 
 
     axios.get('http://localhost:8888/api').then(function(result){ 
 
     console.log(result) 
 
     }) 
 
    }

WebPack конфигурации

devServer: { 
 
    contentBase: 'http://localhost', 
 
    port: 8888, 
 
    // Send API requests on localhost to API server get around CORS. 
 
    proxy: { 
 
     '/api': { 
 
      target: { 
 
       host: "localhost", 
 
       protocol: 'http:', 
 
       port: 3000 
 
      } 
 
     } 
 
    } 
 

 

 
    }

Спасибо за помощь

Answer 1

Попробуйте сделать ваш звонок без хозяина, как это:

handleClick(){ 
    console.log('focused') 
    axios.get('/api').then(function(result){ 
     console.log(result) 
    }) 
}