美文网首页
常见跨域解决方案

常见跨域解决方案

作者: 赵日天逢考必过 | 来源:发表于2019-06-27 10:26 被阅读0次

目前常见的跨域解决方案

  • Jsonp
    最早的解决方案,利用script标签可以跨域的原理实现
    限制:
  1. 需要服务的支持
  2. 只能发起GET请求
  • nginx反向代理
    思路是:利用nginx反向代理吧跨域为不跨域,支持各种请求方式
    缺点:需要在nginx进行额外配置,语义不清晰
  • CORS
    规范化的跨域请求解决方案,安全可靠
    优势:
  1. 在服务端进行控制是否进行跨域,可自定义规则
  2. 支持各种请求方式
    缺点
  3. 会产生额外的请求
    现在大部分使用cors方式解决跨域
    CORS是一个W3C标准,全程是“跨资源共享”。他允许浏览器向跨源服务器同事支持,发起XmlHttpRequest请求,从而客服AJAX只能同源使用的限制。CORS需要浏览器和服务起同时支持。目前,所有的浏览器都支持该功能,IE浏览器不能低于IE10。

浏览器端:所有浏览器都支持该功能(IE10以下不可以)。整个cors通信过程,都是浏览器自动完成不需要用户参与。

服务端:CORS通信和AJAX没有任何差别,因此不需要改变以前的业务逻辑,只不过,浏览器会在请求中携带一些头信息,我们需要以此判断是否运行其跨域,然后在响应头加入一些信息即可,这一般通过过滤器完成就可以了。
例如:

package com.leyou.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

/**
 * @author li
 * @time:2018/8/7
 * 处理跨域请求的过滤器
 */
@Configuration
public class GlobalCorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();

        //1) 允许的域,不要写*,否则cookie就无法使用了
        config.addAllowedOrigin("http://manage.leyou.com");
        config.addAllowedOrigin("http://www.leyou.com");
        //2) 是否发送Cookie信息
        config.setAllowCredentials(true);
        //3) 允许的请求方式
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");
        config.addAllowedMethod("PATCH");
        // 4)允许的头信息
        config.addAllowedHeader("*");

        //2.添加映射路径,我们拦截一切请求
        UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);

        //3.返回新的CorsFilter.
        return new CorsFilter(configSource);
    }
}

相关文章

  • 跨域

    博客 说说跨域那些事儿 不要再问我跨域的问题了 前端常见跨域解决方案(全) 同源策略 JSONP(填充式JSON)...

  • 常见跨域解决方案

    目前常见的跨域解决方案 Jsonp最早的解决方案,利用script标签可以跨域的原理实现限制: 需要服务的支持 只...

  • 前端常见跨域解决方案(全)

    前端常见跨域解决方案(全) 什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的...

  • js常见跨域解决方案

    参考:前端常见跨域解决方案(全) 跨域,什么是“域”? 这里就要先说说同源策略了。所谓同源是指"协议+域名+端口"...

  • 前端不同的跨域方案总结

    做个收录,方便以后复盘。本文转自:前端常见跨域解决方案(全)。 什么是跨域? 跨域是指一个域下的文档或脚本试图去请...

  • JWT简介

    前言 JSON Web Token(JWT)是目前最流行的跨域身份验证解决方案。微服务常见的认证方案 一、跨域认证...

  • 常见跨域解决方案以及Ocelot 跨域配置

    常见跨域解决方案以及Ocelot 跨域配置 Intro 我们在使用前后端分离的模式进行开发的时候,如果前端项目和a...

  • JS知识点

    1、前端常见跨域解决方案 2、cookie,localStorage,SessionStorage三者的区别 3、...

  • 跨域的几种解决方案

    跨域是web开发中经常会遇到的情况,只出现在浏览器端。本文列举了一些常见的跨域情况,和解决方案。 什么是跨域,为什...

  • 跨域解决方案

    收集整理了常见跨域解决方案,欢迎补充指正。 通过jsonp跨域 通常为了减轻web服务器的负载,我们把js、css...

网友评论

      本文标题:常见跨域解决方案

      本文链接:https://www.haomeiwen.com/subject/bkhlcctx.html