跨域的解决方案

2023-11-10

一:跨域

1.概念

指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是 浏览器对javascript施加的安全限制。

2.同源策略

是指协议,域名,端口都要相同,其中有一个不同都会产生跨域;
在这里插入图片描述

3.跨域流程

在这里插入图片描述

二:解决跨域方案

1.方案一:nginx

使用nginx部署为同一域
在这里插入图片描述
注:这里使用nginx过程过于繁琐,因为要改变域名或者端口号。而当预检请求发送给服务器的时候,我们直接告诉请求,你可以访问。这样访问不仅快,而且配置简单。

2.方案二:配置当次请求允许跨域

1、添加响应头
• Access-Control-Allow-Origin:支持哪些来源的请求跨域
• Access-Control-Allow-Methods:支持哪些方法跨域
• Access-Control-Allow-Credentials:跨域请求默认不包含cookie,设置为true可以包含 cookie
• Access-Control-Expose-Headers:跨域请求暴露的字段
• CORS请求时,XMLHttpRequest对象的getResponseHeader()方法只能拿到6个基本字段: Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma。如 果想拿到其他字段,就必须在Access-Control-Expose-Headers里面指定。
• Access-Control-Max-Age:表明该响应的有效时间为多少秒。在有效时间内,浏览器无 须为同一请求再次发起预检请求。请注意,浏览器自身维护了一个最大有效时间,如果 该首部字段的值超过了最大有效时间,将不会生效。
2.在gulimail-gateway中添加config包,新建CorsConfiguration文件
在这里插入图片描述
3.在CorsConfiguration配置跨域方法
1.跨域的配置信息
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
2.所有跨域的配置信息都写在corsConfiguration中
CorsConfiguration corsConfiguration = new CorsConfiguration();
3.配置注册信息
corsConfiguration.addAllowedHeader(““);
corsConfiguration.addAllowedMethod(”
”);
corsConfiguration.addAllowedOrigin(“*”);
corsConfiguration.setAllowCredentials(true);

  • 1.addAllowedHeader(“*”),允许所有头进行跨域
  • 2.addAllowedMethod(“*”),允许所有方法(get,put,post,delete)等进行跨域
  • 3.addAllowedOrigin(“*”),允许任意请求来源进行跨域
  • 4.setAllowCredentials(true),允许携带cookie请求进行跨域,否则跨域请求会丢失相应的cookie信息

4.用来注册的配置信息
source.registerCorsConfiguration(“/**”,corsConfiguration);
return new CorsWebFilter(source);

package com.sysg.gulimail.gateway.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;

/**
 * @Configuration标注其是一个配置类
 * @author 77916
 */
@Configuration
public class GulimailCorsConfiguration {
    /**
     * @Bean 将其添加到容器中
     * @return CorsWebFilter返回跨域的filter
     */
    @Bean
    public CorsWebFilter corsWebFilter(){
        //跨域的配置信息
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        //所有跨域的配置信息都写在corsConfiguration中
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        /**
         * 一:配置跨域
         * 1.addAllowedHeader("*"),允许所有头进行跨域
         * 2.addAllowedMethod("*"),允许所有方法(get,put,post,delete)等进行跨域
         * 3.addAllowedOrigin("*"),允许任意请求来源进行跨域
         * 4.setAllowCredentials(true),允许携带cookie请求进行跨域,否则跨域请求会丢失相应的cookie信息
         */
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.setAllowCredentials(true);
        //用来注册的配置信息
        source.registerCorsConfiguration("/**",corsConfiguration);
        return new CorsWebFilter(source);
    }
}

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

跨域的解决方案 的相关文章

随机推荐

  • LeetCode-169-多数元素-简单(排序/摩尔投票法/哈希表/随机数/位运算)

    一 题目 给定一个大小为 n 的数组 找到其中的多数元素 多数元素是指在数组中出现次数 大于 n 2 的元素 你可以假设数组是非空的 并且给定的数组总是存在多数元素 二 示例及提示 示例 1 输入 3 2 3 输出 3 示例 2 输入 2
  • 根据地理信息获取经纬度

    同步坐标 function synchronizationCoordinate var url http maps google com maps api geocode json address encodeURIComponent va
  • Linux vfs各种operation操作介绍

    1 ext4文件系统定义的各种操作 普通文件操作 const struct file operations ext4 file operations llseek ext4 llseek read iter generic file rea
  • MySQL——修改root密码的几种方法

    方法1 用SET PASSWORD命令 首先登录MySQL 格式 mysql gt set password for 用户名 localhost password 新密码 例子 mysql gt set password for root
  • C++ Primer Plus 第二章编程练习

    整理了我自己编写的课后题答案 如果有问题或者看不懂的欢迎大家留言 小声说 所有内容纯手打 点个赞再走呗 第二章编程练习题 Practice 1 Practice 2 Practice 3 Practice 4 Practice 5 Prac
  • mysql忘记密码及ssh连接

    mysql忘记密码 我们在安装mysql或者其他的时候会遇到忘记密码的时候 这时候就需要对密码进行重置 话不多说 直接上步骤 1 停止当前mysql服务 service mysqld stop 2 然后通过跳过权限验证启动mysql服务 m
  • 2008年7月51CTO.com十大热点文章排行榜

    刚刚过去的7月 热点新闻和精彩的技术文章还是不少的 以下是51CTO com各主要频道的精彩实用文章及简介 经典实用文章推荐 组网频道7月热点 网管人员必备的常用命令 Windows环境下有很多通过命令实现网络管理的非常有效的工具 可惜知道
  • 11-5 读写一行字符

    1 读一行字符 gets 与 gets s 都可以用做读取用户控制台输入的一行字符 gets 仅接收一个参数 char 意为读取到换行符时将读取内容全部保存到 char 中 该函数的问题在于无法判断出读取到换行符之前共有多少字符 故 cha
  • 在Repeater控件中创建可隐藏区(原作)

    在Repeater控件中创建可隐藏区 原作 最新的一篇作品 发表在天极网上 http dev yesky com SoftChannel 72342371945218048 20041227 1893718 shtml
  • Nginx 增加二级目录的反向代理时,最常见的两个问题

    当我们想在某个Nginx网站中增加一个两级目录 当然也可以是很多级 作为反向代理时 如果使用常见的单个Nginx反向代理配置的方法 非常容易遇到配置有问题的情况 主要由如下两个问题造成 1 因为不是独立配置反向代理 所以Nginx Conf
  • 数学建模论文常用LaTeX代码(2021美赛)

    数学建模论文常用LaTeX代码 图片 单图 begin figure htbp centering includegraphics width 9 textwidth XXX pdf 图片相对位置 caption xxx 图片标题 labe
  • Ts学习笔记

    any 任何类型都可以赋值给any any也可以给任何类型赋值 unknown 任何类型可以赋值给 unknown 但是 unknown 类型赋值给其它类型需要对其进行类型缩小 type 类型一般都是大写字母开头 type Fish nam
  • 敏捷开发知识体系笔记

    敏捷开发知识体系整体框架 敏捷开发工程实践 项目管理 迭代开发 风险价值生命周期 多级项目规划 完整团队 每日站立会议 任务板 燃尽图 需求管理 需求订单 业务流程草图 用例驱动开发 用户故事 架构 演进的架构 演进的设计 基于组件的架构设
  • 同步服务器安装系统,时间同步服务器的配置方法

    知道什么是时间同步服务器的配置方法吗 下面是学习啦小编跟大家分享的是时间同步服务器的配置方法 欢迎大家来阅读学习 时间同步服务器的配置方法 方法 步骤 双击任务栏右下角 时间 打开 时间和日期 属性 设置对话框 2选择 Internet时间
  • SimpleDateFormat用法详解

    SimpleDateFormat类是一个以语言环境敏感的方式来格式化和解析日期的工具类 它允许你将日期格式化为字符串 或从字符串解析为日期 格式化日期为字符串 SimpleDateFormat sdf new SimpleDateForma
  • 在linux下编译多线程需要如下设置

    编译时这样输入命令 gcc xxx c o xxx out lpthread
  • LeetCode知识点总结 - 1710

    LeetCode 1710 Maximum Units on a Truck 考点 难度 Sorting Easy 题目 You are assigned to put some amount of boxes onto one truck
  • Xilinx 7系FPGA LVDS使用要注意了,供电不能搞错

    最近新做了一块板子 用到Spartan 7芯片对前级视频源叠加OSD菜单 前级会将HMDI转成LVDS送给FPGA处理 在原理图设计阶段没有仔细阅读fpga手册 导致LVDS BANK供电错误 应该接2 5V 实际接3 3V 且BANK供电
  • 射频与无线技术入门 读书记录

    一 基础概念 无线系统框图 瓦特W 功率测量单位 能量 功率 时间 如100W的灯泡亮了2小时 能量就是100w 2 就是200W H的能量 波段 使用字母表示一定范围的频率 载波 载波只能使用模拟信号 在这个模拟信号上承载模拟或者数字信息
  • 跨域的解决方案

    一 跨域 1 概念 指的是浏览器不能执行其他网站的脚本 它是由浏览器的同源策略造成的 是 浏览器对javascript施加的安全限制 2 同源策略 是指协议 域名 端口都要相同 其中有一个不同都会产生跨域 3 跨域流程 二 解决跨域方案 1