美文网首页
Vue跨域访问后端API问题(code-200,但无返回内容)

Vue跨域访问后端API问题(code-200,但无返回内容)

作者: jnxc1888 | 来源:发表于2023-03-11 19:24 被阅读0次

之前的代码,是在这里加的

截屏2023-03-12 下午7.21.09.png
但是白屏
因为vue是运行在8080端口,服务器端在8888端口,就猜想会不会是跨域
用了以下方法
解决Vue跨域访问后端API问题
例子:
// vue.config.js
module.exports = {
     devServer: {
        proxy: {
            // 当你vue请求路径中包含/api,那么vue会自动帮你代理请求到你的后端地址
            // 比如我vue请求的是 '/api/user/getUser',那么会帮我代理请求到后端地址
            '/api': {
                // 后端地址
                target: "http://localhost:8081",
                /**
                    官方文档的意思:将主机头的来源更改为目标 URL
                    简单理解就是需不需要代理
                **/
                changeOrigin: true,
                /**
                    重写目标地址,比如我vue请求的是/api/user/getUser
                    经历过重写之后,我们请求的地址是http://localhost:8081/user/getUser
                    这里用的是正则表达式,^符号是用来限制开头
                    意思就是匹配vue请求的开头是否为/api,是的话就进行重写替换
                **/
                pathRewrite: {
                    ["^/api"]: ""
                }
            }
        }
    }
}

在本项目中修改为:

proxyTable: {
      '/': {
        target: 'http://localhost:8888/xxx_admin/',
        changeOrigin: true,
        pathRewrite: {
          '^/': ''
        }
      }
    },
截屏2023-03-12 下午7.21.09.png

成功

相关文章

  • Vue学习笔记(一)

    跨域问题 vue前端跨域问题 1. 利用vue-cli框架与axios结合,访问服务器后端接口,axios不需要太...

  • 什么是跨域问题?

    什么是跨域问题? 前后端分离,前端服务和后端服务域名不一样,导致前端访问后端服务的时候报错,这个就是Ajax跨域问题

  • 1、前后端搭建

    预备知识(备查):1)vue+servlet2 ) axios 目标 本章制作前后端分离的项目,前后端实现跨域访问...

  • 跨域问题

    vue-resource和tp5之间的跨域问题 1.配置后端controller中加入// 指定允许其他域名访问h...

  • 复习jsonp和promise

    一.jsonp 1.jsonp是跨域访问api,ajax不能跨域 2.在vue中使用jsonp首先要安装jsonp...

  • vue cli 解决跨域 线上 nginx 反向代理配置

    vue cli 解决跨域 线上 nginx 反向代理配置 前后分离 axios 接 api 跨域问题如图: 解决办...

  • laravel api请求解决跨域访问问题

    在routes/api.php最下面加上这行代码就可以解决跨域访问问题,(如前后端分离请求api、请求只出现一个o...

  • 60.webpack中的proxyTable

    proxyTable是解决开发环境中的跨域问题,正式环境的跨域需要使用nginx反向代理或者是后端解决 '/api...

  • Flask跨域问题

    前后端分离,前端访问后端flask的请求时出现跨域问题,访问失败。可以使用flask_cor包来解决问题 1. 安...

  • Ajax跨域

    原因(三个条件同时满足) 浏览器限制(请求后端正常返回,但是浏览器不允许跨域访问) 请求是跨域的(协议、域名、端口...

网友评论

      本文标题:Vue跨域访问后端API问题(code-200,但无返回内容)

      本文链接:https://www.haomeiwen.com/subject/hlgxrdtx.html