vue.js - 有什么办法可以解决Vite js中的CORS错误吗？-6ren

vue.js - 有什么办法可以解决Vite js中的CORS错误吗？

转载作者：行者123 更新时间：2023-12-02 01:40:41

<分区>

对于同一问题，我尝试了开发人员提供的所有解决方案。我像那样更新了 Vite.config.js 文件-

//vite.config.js

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': resolve(__dirname, 'src'),
    },
  },
  server: {
    proxy: {
    '/api': {
      target: 'http://localhost:3000/',
      changeOrigin: true,
      secure: false,
      rewrite: (path) => path.replace(/^\/api/, '')
    },
    cors:false
    },
  },
  define: {
    'process.env': {}
  }
})

我在两个文件中都添加了标题属性-

//Login.vue

 const header = {
              headers: {
                  'Authorization': 'Bearer ${accessToken}',
                  'Content-Type': 'application/json',
                  'Access-Control-Allow-Origin': '*',
                  'Access-Control-Allow-Headers': '*',
                  'Access-Control-Allow-Methods': POST, GET, OPTIONS,
                  'Access-Control-Allow-Credentials': true,
                  'Sec-Fetch-Mode': no-cors,
                  'Sec-Fetch-Site': same-site
                  
              },

//App.vue

const header = {
              headers: {
                  'Authorization': `Bearer ${accessToken}`,
                  'Content-Type': 'application/json',
                  'Access-Control-Allow-Origin': '*',
                  'Access-Control-Allow-Headers': '*',
                  'Access-Control-Allow-Credentials': true,
                  'Sec-Fetch-Mode': no-cors,
                  'Sec-Fetch-Site': cross-site,
                  
              },

但是，当我检查代码并在网络 header 属性下看到时-

如何更改这些 header 属性或任何其他方式来解决此 CORS 问题。我只想解决前端问题。目前，我通过禁用安全性在 Chrome 中运行此应用程序chrome.exe --user-data-dir="C://Chrome dev session"--disable-web-security 但我想在不禁用安全性的情况下在所有浏览器上运行它。 p>

获取错误-