包头索易网站建设,php网站本地调试,深圳网址排名,淘宝网站开发的多少钱#x1f680;#x1f680;扎哇太枣糕的博客首页#x1f680;#x1f680;** 文章目录#x1f34a;什么是跨域#x1f34a;跨域问题的解决策略#x1f34a;三种解决方法#x1f34a;什么是跨域 想要知道什么是跨域的话#xff0c;我们可以通过一个小案例简单了解一下跨… 扎哇太枣糕的博客首页** 文章目录什么是跨域跨域问题的解决策略三种解决方法什么是跨域 想要知道什么是跨域的话我们可以通过一个小案例简单了解一下跨域的概念在项目代码编写的时候我们将前端项目代码和后端的项目代码相分离开一个运行在本地的8080端口一个运行在本地的8888端口这也就是我们常说的前后端分离项目。现在使用前端的请求去调用后端的接口就会产生以下的错误
Access to XMLHttpRequest at http://localhost:8888/请求名
from origin ‘http://localhost:8080’ has been blocked by
CORS policy: No ‘Access-Control-Allow-Origin’
header is present on the request resource.错误原因基于浏览器的保护机制当请求中缺少了一些http头信息时读取响应的操作就会被阻止。出现这个问题并不是说后端没有接收到前端发送过来的请求相反后端接收请求并且将响应信息返回给了前端但是返回的响应信息被前端浏览器所拦截了。 这个保护机制就是浏览器的一种重要的安全策略——同源策略该策略可以限制不同源之间的交互行为从而有效避免一些浏览器层面的攻击。所谓的同源就是指url中的协议、域名、端口三个都相同。反观案例的url前端http://localhost:8080请求http://localhost:8888/请求名协议和域名都相等但是端口却不一样导致两个是不同源不同源的话就会产生跨域问题。
跨域问题的解决策略 CROS(Cross Origin Resource Sharing)策略全称为跨域资源共享策略是后端用来解决跨域问题的一个方案(当然前端也有解决跨域问题的对应方案)抛开底层具体的解决原理不说今天就学习一下如何借助该策略实现跨域问题的解决。
三种解决方法 第一种也是最简单但不常用的一种只需要在后端接口方法上添加 CrossOrigin 注解即可解决对这个接口方法的请求跨域问题但是在实际开发中一般都会有很多的方法在每一个方法上都添加这个注解的话明显就会很影响使用感受。当然还可以将注解添加到类上表示类中的所有方法都解决了跨域问题但是类也不止一个还是麻烦。
CrossOrigin
GetMapping(/请求名)
public String sayHello() {return hello world !;
}第二种就是使用过滤器统一处理
// 对比着看包千万别导错了
import org.springframework.context.annotation.Bean;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;Configuration
public class CorsConfig {Beanpublic CorsFilter corsFilter() {CorsConfiguration corsConfiguration new CorsConfiguration();// 使用通配符* 允许所有的域请求corsConfiguration.addAllowedOrigin(*);// 使用通配符* 允许所有请求头字段corsConfiguration.addAllowedHeader(*);// 使用通配符* 允许所有请求头方法类型corsConfiguration.addAllowedMethod(*);UrlBasedCorsConfigurationSource source new UrlBasedCorsConfigurationSource();// 处理请求映射source.registerCorsConfiguration(/**, corsConfiguration);return new CorsFilter(source);}
}第三种就是使用WebMvc的配置类
// 对比着看包千万别导错了
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;Configuration
public class WebMvcConfig implements WebMvcConfigurer {Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping(/**) // 设置映射.allowedOriginPatterns(*) // 设置域.allowedMethods(*) // 设置请求的方式GET、POST等.allowCredentials(true) // 设置是否携带cookie.maxAge(3600) // 设置设置的有效期 秒单位.allowedHeaders(*); // 设置头}
}
