Vue3.0 跨域问题

最新推荐文章于 2024-03-08 18:35:17 发布

爱生活，爱编程

最新推荐文章于 2024-03-08 18:35:17 发布

阅读量407

点赞数

分类专栏： composition typescript

本文链接：https://blog.csdn.net/qq_15009739/article/details/110791241

版权

本文介绍了在Vue3.0开发阶段遇到的跨域问题及其解决方案。通过vue.config.js设置代理，成功解决接口请求的跨域限制。提供了一个Hook的示例，并分享了之前处理跨域的经验，提醒开发者遇到类似问题时如何配置。

摘要由CSDN通过智能技术生成

这个破问题，也只有开发阶段有问题，上传到服务器都是一个域名有个啥问题

给大家看下

https://acg.xydwz.cn/api/api.php?return=json

我们请求的接口是这个，就必须设置跨域问题

vue.config.js

module.exports = {
    outputDir: 'dist', //build输出目录
    assetsDir: 'assets', //静态资源目录（js, css, img）
    lintOnSave: false, //是否开启eslint
    devServer: {
        open: true, //是否自动弹出浏览器页面
        host: "localhost", //表示启动的时候使用的域名，默认可以不写，则是使用localhost和本机IP
        port: '8081', // 设置端口号
        https: false, //是否使用https协议
        hotOnly: false, //是否开启热更新
        proxy: {
            '/api': {
                target: 'https://acg.xydwz.cn', //API服务器的地址
                ws: true, //代理websockets
                changeOrigin: true // 是否跨域，虚拟的站点需要更管origin
                    ,
                pathRewrite: { // 重写