侧边栏壁纸
博主头像
996worker

祇園精舎の鐘の聲, 諸行無常の響き有り。

  • 累计撰写 174 篇文章
  • 累计创建 45 个标签
  • 累计收到 8 条评论

目 录CONTENT

文章目录

跨域请求以及可能的跨域方案

996worker
2021-12-02 / 0 评论 / 0 点赞 / 127 阅读 / 1,291 字
温馨提示:
本文最后更新于 2021-12-02,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。

跨域请求

是什么

Cors, 从一个网站开始,当发起一个非简单请求的目标域名的端口或者端口前的任意东西和源网站不同时,就会是跨域请求

简单请求: GET, POST, HEAD方式,其中无自定义头,Content-type为text/plain, multipart/form-data或者application/x-www-form-urlencoded

非简单请求(预检请求): put,delete方法的ajax请求; 发送json格式的ajax请求; 带自定义头的ajax请求. 请求前会给服务器发送OPTIONS预检请求以获取服务器是否允许跨域请求.

为什么

安全,能防止跨站请求伪造, 跨站脚本攻击


跨域方案

  1. 使用nginx部署为同一域,比较繁琐:
    image.jpeg

  2. 服务端响应当次请求允许跨域
    image.jpeg

实例

Spring Cloud全局跨域可以在gateway网关写个配置文件


// 注意下依赖包
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;

@Configuration
public class DemoCorsConfiguration {

    @Bean
    public CorsWebFilter corsWebFilter() {
        UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
        CorsConfiguration corsConfiguration = new CorsConfiguration();

        // 配置跨域全允许
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.setAllowCredentials(true);

        urlBasedCorsConfigurationSource.registerCorsConfiguration(
                "/**",
                corsConfiguration
        );

        return new CorsWebFilter(urlBasedCorsConfigurationSource);
    }
}

此时预检请求能够收到回应:
image.jpeg

这就说明此次访问被允许跨域了.

0

评论区