1.为什么会造成跨域?
原因:浏览器对JavaScript施加的安全限制,它遵循同源策略(是指协议,域名,端口都相同,其中一个不相同就会产生跨域问题)
2.跨越怎么解决?
思路(白话):
方法一:既然浏览器有安全限制,我们遵循同源策略,让协议,域名,端口都相同!(前端或运维解决思路)
解决:让nginx代理前端路径和后端路径,以一个参数区分,根据这个参数区分前后台访问路径,这样就能做到前后台 协议,域名,端口都相同,从而解决跨域问题
说明:VUE框架也自带了解决跨域的方法!
方法二: 从根源上解决,浏览器发送服务器请求的时候,浏览器会先发送一个预检请求,如果这个时候服务器告诉浏览器能发送请求,那么跨域问题同样不存在即解决跨域问题。(后端解决问题思路)
3.因为本人是Java开发,这里只说明后台是如何解决跨域问题的(下面只是一种代码方法,还有其他方法代码)
package com.richfit.sod.appserver.config; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.cors.CorsConfiguration; import org.springframework.web.cors.reactive.CorsWebFilter; import org.springframework.web.cors.reactive.UrlBasedCorsConfigurationSource; /** * @author 李庆伟 * @date 2020/12/29 10:41 */ @Configuration public class CorsConfig { @Bean public CorsWebFilter corsWebFilter(){ UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); CorsConfiguration corsConfiguration = new CorsConfiguration(); //配置跨域 corsConfiguration.addAllowedHeader("*");//允许所有带请求头的请求访问 corsConfiguration.addAllowedMethod("*");//允许所有的请求方式访问 corsConfiguration.addAllowedOrigin("*");//允许所有的请求位置访问 corsConfiguration.setAllowCredentials(true);//允许侵权带coke source.registerCorsConfiguration("/**",corsConfiguration); return new CorsWebFilter(source); } }
4.记录一下。。。。。。。。。。