springboot vue 登陆发送请求(跨域问题)02
2017-09-28 22:17
766 查看
1.前后端分离之间进行通讯首先要进行跨域请求,以前的做法就是写个过滤器来操作,还有就是nginx代理了。
现在用vue和springboot都有新的方式
第一种
vue2 本身也支持跨域,开发过程中支持这个,方便
第二种
springboot 简单一个类就可以支持
第三种
生产环境用nginx就不用说了,必须的。像什么复杂的代理请求和负载等等都可以
先弄第一种
引入resource
在App.vue 加入请求方法
methods: {
getData () {
}
2.第二种 springboot 配置也可以
去掉之前vue代理请求就提示跨域问题了,我们先删除代理运行看看
访问地址修改成
再次访问就有跨域问题
接下来在项目种加入CorsConfig类,如图
重启项目刷新页面,跨域问题就解决了
第三种nginx跨域解决问题后面部署服务器的时候再一起学习
现在用vue和springboot都有新的方式
第一种
vue2 本身也支持跨域,开发过程中支持这个,方便
第二种
springboot 简单一个类就可以支持
第三种
生产环境用nginx就不用说了,必须的。像什么复杂的代理请求和负载等等都可以
先弄第一种
引入resource
在App.vue 加入请求方法
methods: {
getData () {
var that = this.$http.get('api/sysuser/list') .then(function (response) { console.log(response.data) console.log(this) that.serverData = response.data }) .catch(function (error) { console.log(error) }) }
}
2.第二种 springboot 配置也可以
去掉之前vue代理请求就提示跨域问题了,我们先删除代理运行看看
访问地址修改成
再次访问就有跨域问题
接下来在项目种加入CorsConfig类,如图
@Configuration public class CorsConfig extends WebMvcConfigurerAdapter{ @Override public void addCorsMappings(CorsRegistry registry) { System.out.println("----------------------"); registry.addMapping("/**") .allowedOrigins("*") .allowCredentials(true) .allowedMethods("GET", "POST", "DELETE", "PUT") .maxAge(3600); } }
重启项目刷新页面,跨域问题就解决了
第三种nginx跨域解决问题后面部署服务器的时候再一起学习
相关文章推荐
- 【SpringBoot学习笔记】SpringBoot_02_vue和SpringBoot的跨域请求
- Spring boot + shiro 解决跨域登陆问题
- Spring boot 完美解决ajax跨域请求问题
- vue开发:VUE axios发送跨域请求需要注意的问题
- Spring Boot学习总结(6)——SpringBoot解决ajax跨域请求问题的配置
- Spring boot 和Vue开发中CORS跨域问题解决
- springboot vue (跨域问题)
- vue+springboot前后端分离实现单点登录跨域问题解决方法
- vue+springboot实现项目的CORS跨域请求
- vuejs中vue-resource或使用axios发送请求及解决跨域问题
- 百度地图API 云存储·LBS.云 跨域问题解决方法——通过java.net.URLConnection发送HTTP请求
- SpringBoot下如何配置实现跨域请求?
- spring boot security 实现登陆时ajax请求返回json,而不是直接页面跳转
- [置顶] spring boot项目实战:跨域问题解决
- 【spring boot】2.0增加跨域请求支持 全局配置 以及局部配置
- Spring Boot使用CORS解决跨域问题
- Java Spring boot 2.0 跨域问题的解决
- 解决angular+spring boot的跨域问题
- Spring-Boot允许跨域请求
- ajax跨域问题解决(spring boot)