对预检请求的响应未通过访问控制否'Access-Control-Allow-Origin'

问题描述

我有一个使用axios将请求发送到ApiGee服务器的Vue.js应用程序。

这是我用来向APIgee发送请求的代码。

tab1_layout = [
                    [sg.ListBox(values=list_of_workers,size=(15,7),key='-WORKERS_LISTBox-',select_mode=sg.LISTBox_SELECT_MODE_EXTENDED),sg.Button('',image_data=convert_to_bytes(cogwheel_icon,(30,30)),border_width=5,key='cogwheel',tooltip='Workers options')],[sg.Button('',image_data=convert_to_bytes(plus_icon,key='plus',tooltip='Add worker'),image_data=convert_to_bytes(minus_icon,key='minus',tooltip='Delete worker'),sg.Button('Delete all',size=(8,3))]
                   ] 

由于我是从客户端浏览器完成请求的，因此我可以首先看到来自ApiGee的OPTIONS请求。 我还可以看到 const headers = { 'X-API-Key': 'randomKey123123' } return axios({ method: 'get',url: url,headers: headers }).then(response => { console.log(response) }) 标头键，但是缺少该值。

我从浏览器控制台收到的错误是

X-API-Key

解决方法

以下代码帮助我您可以尝试以下格式：

created() {
  // POST request using axios with set headers
  const article = { title: "Vue POST Request Example" };
  const headers = { 
     'X-API-Key': 'randomKey123123'
  };
  axios.post(url,article,{ headers })
    .then(response => console.log(response.data)
   );
}