Vue3+axios+Vite配置Proxy代理解决跨域

以这个API为例：https://www.rootdata.com/Api/Doc

vite新建vue项目之后

• vite.config.js \

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'export default defineConfig({server:{proxy: {'/rootdata':{target: 'https://api.rootdata.com/open/ser_inv',changeOrigin: true,rewrite: (path)=>path.replace(/^\/rootdata/, '')}}},plugins: [vue()],resolve: {alias: {"@": path.resolve("./src") // 相对路径别名配置，使用 @ 代替 src}}
})

• APP.vue
  script标签中（记得pnpm install axios）
  这段代码是把https://www.rootdata.com/Api/Doc中的示例代码转换过来的

import HelloWorld from './components/HelloWorld.vue'
// 导入 axios 用于发送 HTTP 请求
import { ref, onMounted } from 'vue';
import axios from 'axios';const getdata = ()=>{axios.post('/rootdata', {query: 'ETH'}, {headers: {"apikey": "XXXXXXX", 这里写自己的KEY"language": "en","Content-Type": "application/json"}}).then(response => {console.log(response);}).catch(error => {console.error("Error:", error);});
}
onMounted(()=>{getdata()
});