问题遇到的现象和发生背景
跨域
用代码块功能插入代码，请勿粘贴截图
vite.config.js
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
server: {
open: true,
https:false,
assetsPublicPath: '/',
proxy: {
"/api": {
//域名隐藏
target: "https://..com.cn:6443",
changeOrigin: true,
secure: false,
rewrite: (path) => path.replace(/^\/api/, ''),
selfHandleResponse : true,
configure: (proxy, options) => {
proxy.on('proxyRes', function (proxyRes, req, res) {
var body = [];
proxyRes.on('data', function (chunk) {
body.push(chunk);
});
proxyRes.on('end', function () {
body = Buffer.concat(body).toString();
//域名隐藏
body=body.replace('<head>','<head><base href="https://..com.cn:6443/">')
console.log("res from proxied server:", body);
res.end(body);
});
})
},
},
},
host: 'localhost', //本地ip
},
plugins: [vue()],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
})
运行结果及报错内容
域名已隐藏
Access to XMLHttpRequest at 'https://..com.cn:6443/join/740210553' from origin 'http://127.0.0.1:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
我的解答思路和尝试过的方法
App.vue
<template>
<div>
<a href="http://127.0.0.1:5173/api">客服</a>
</div>
</template>
<script>
export default {
setup() {
return {}
}
}
</script>
<style lang="scss" scoped>
</style>
我想要达到的结果
成功跨域
