前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue跨域解决方案 简书_springboot允许跨域

vue跨域解决方案 简书_springboot允许跨域

作者头像
全栈程序员站长
发布2022-09-29 11:54:39
2870
发布2022-09-29 11:54:39
举报
文章被收录于专栏:全栈程序员必看

大家好,又见面了,我是你们的朋友全栈君。

一:为什么会出现跨域问题?

代码语言:javascript
复制
出于浏览器的同源策略限制。 同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。

二:什么是跨域?

代码语言:javascript
复制
当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。
1 . 两个相同的源之间浏览器默认其是可以相互访问资源和操作DOM的。
2 .两个不同的源之间 若想要相互访问资源或者操作DOM,那么会有一套基础的安全策略的制约。

三:后台解决方案

1.方法一:@CrossOrigin 注意: 1、springMVC的版本要在4.2或以上版本才支持@CrossOrigin 2、非@CrossOrigin没有解决跨域请求问题,而是不正确的请求导致无法得到预期的响应,导致浏览器端提示跨域问题。 3、在Controller注解上方添加@CrossOrigin注解后,仍然出现跨域问题,解决方案之一就是:在@RequestMapping注解中没有指定Get、Post方式,具体指定后,问题解决。其中@CrossOrigin中的2个参数:origins : 允许可访问的域列表 maxAge:准备响应前的缓存持续的最大时间(以秒为单位)。可以配置在Controller上 也可以配置在方法上。

2. 方法二: 过滤器

代码语言:javascript
复制
package com.sysg.config;
import org.springframework.core.annotation.Order;
import org.springframework.stereotype.Component;
import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/** * @author 77916 */
@Component
@Order(1)
@WebFilter(filterName = "CoresFilter", urlPatterns = "/*")
public class CoresFilter implements Filter { 

@Override
public void destroy() { 

}
@Override
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
throws IOException, ServletException { 

HttpServletResponse response = (HttpServletResponse) servletResponse;
//表示所有的域都可以接受
response.setHeader("Access-Control-Allow-Origin", "*");
//允许所有的方法
response.setHeader("Access-Control-Allow-Methods","POST,GET,DELETE,PUT,OPTIONS");
//请求得到结果的有效期
response.setHeader("Access-Control-Max-Age","3600");
response.setHeader("Access-Control-Allow-Headers","x-requested-with,Content-Type,access-control-allow-origin,version-info");
//该值是一个boolean值,表示允许发送cookie,默认情况下cookie不包含在cores中,设置为true
response.setHeader("Access-Control-Allow-Credentials","true");
filterChain.doFilter(servletRequest,servletResponse);
}
@Override
public void init(FilterConfig filterConfig) throws ServletException { 

}
}
web.xml(写在/webapp/WEB-INF目录下)
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
version="4.0">
<!-- 跨域问题解决 -->
<filter>
<filter-name>CoresFilter</filter-name>
<filter-class>com.sysg.config.CoresFilter</filter-class>
<init-param>
<param-name>IsCross</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CoresFilter</filter-name>
<url-pattern>/*</url-pattern> </filter-mapping> </web-app> 

3. 方法三:配置(SpringBoot)

代码语言:javascript
复制
package com.sysg.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
@EnableWebMvc
public class WebMvcConfig implements WebMvcConfigurer { 

@Override
public void addCorsMappings(CorsRegistry registry) { 

registry.addMapping("/**")
.allowedOrigins("*")
.allowedHeaders("*")
.allowedMethods("GET", "POST", "PUT", "OPTIONS", "DELETE", "PATCH")
.maxAge(3600);
}
}

注意:配置类文件一定要写在启动类所在的包下,否则不生效。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/192996.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年9月16日 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一:为什么会出现跨域问题?
  • 二:什么是跨域?
  • 三:后台解决方案
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档