has been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header is present on the requested

在我们运行前端文件时出现跨域问题

                                       No 'Access-Control-Allow-Origin' header is present on the requested

 一般出现这种问题先看服务代码

const http = require('http');

// const hostname = '127.0.0.1';
const hostname = 'localhost';
const port = 5000;

const server = http.createServer((req, res) => {
  res.statusCode = 200; 
  res.setHeader('Access-Control-Allow-Origin', '*') // 允许所有的地址跨域访问        
  res.end('Hello World');
});

server.listen(port, hostname, () => {
  // console.log('Server running at http://${hostname}:${port}/');
   // console.log('http://127.0.0.1:5000');
   console.log('http://localhost:5000');
   console.log('端口被调用1')
});

发现setHeader需要配置Access-Control-Allow-Origin且允许所有的地址跨域访问

当然也需要我们在代理配置中vue.config.js文件中配置

                    devServer: {     
                                 proxy: {
                                      '/api': {
                                       target: 'http://localhost:5000',   //这里以5000测试网址为例
                                       ws: true,
                                      changeOrigin: true,        
                 }
         } 
    }