前言

我们在写前后端分离的时候，请求后端接口是必要步骤，但是这个时候就有个问题，因为前端和后端是归属于不同端口，我们在直接访问后端时，会触发csrf（跨站请求伪造）

一、vue.config.js文件

vue项目中可选的配置文件，你可以选择用这个文件去配置vue项目，也可以选择在package.json文件中vue字段去配置，但是你需要严格按照json的写法

提示：我创建完项目之后，里面没有vue.config.js文件，所以我自己在根目录中新增了一个
你创建了这个文件之后，你可以选择上面两种方式中随便一个，作为导出对象即可

二、配置代理参数

// 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"]: ""}}}}
}

总结

以上就是解决vue前端如何跨域访问后端接口的方法

解决Vue跨域访问后端API问题相关推荐

Vue跨域访问后端接口问题解决
VUE访问接口的时候,很可能出现跨域请求,从而被提供接口的服务器拒绝,下面这篇文章主要给大家介绍了关于Vue如何解决跨域问题的相关资料,需要的朋友可以参考下什么是跨域跨域指浏览器不允许当前页面的所 ...
[Cookie]解决Cookie跨域访问
前言随着工程的不断扩大,要部署很多不同的服务,这其中就避免不了Cookie的跨域问题,如何实现Cookie在不同域之前实现传输,本文将详细描述. Cookie介绍 1.path Cookie路径是由 ...
jsonp跨域的缺点ajax缺点,浅析JSONP解决Ajax跨域访问问题的思路详解
前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息.实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问 ...
[解决]WebLogic跨域访问安全问题
[解决]WebLogic跨域访问安全问题参考文章: (1)[解决]WebLogic跨域访问安全问题 (2)https://www.cnblogs.com/boazy/archive/2013/06/ ...
react 访问后端_react前端用nginx怎么配置跨域访问后端restful api？
开发机器是windows,windows中安装了centos虚拟机做restful api服务器,在浏览器中可以正常访问该api服务器: http://192.168.33.3:8080/articl ...
解决cookie跨域访问
v一.前言随着项目模块越来越多,很多模块现在都是独立部署.模块之间的交流有时可能会通过cookie来完成.比如说门户和应用,分别部署在不同的机器或者web容器中,假如用户登陆之后会在浏览器客户端写入 ...
【JavaWeb】解决cookie跨域访问
随着项目模块越来越多,很多模块现在都是独立部署.模块之间的交流有时可能会通过cookie来完成.比如说门户和应用,分别部署在不同的机器或者web容器中,假如用户登陆之后会在浏览器客户端写入cookie ...
SpringBoot 解决VUE跨域问题
今天使用VUE 调用SpringBoot 后台服务接口,提示跨域. 我参考网上解决Vue + SpringBoot 跨域代码,源码如下: package com.zzg.configuration;i ...
普元EOS中，子系统和portal不在同一个域中，使用jquery的jsonp来解决portal跨域访问
转至元数据起始 [背景] 子系统和portal不在同一个域中且项目中要求不能使用nginx.apache等反向代理软件,故使用jsonp从代码角度解决ajax跨域问题 [实现思路] 通过jquery的 ...

解决Vue跨域访问后端API问题

文章目录

前言

一、vue.config.js文件

二、配置代理参数

总结

解决Vue跨域访问后端API问题相关推荐

最新文章

热门文章