跨域 Cookie 共享

跨域请求经常遇到需要携带 cookie 的场景,为了确保跨域请求能够携带用户的认证信息或其他状态,浏览器提供了 withCredentials 这个属性。

如何在 Axios 中使用 withCredentials
为了在跨域请求中携带 cookie,需要在 Axios 配置中设置 withCredentials 为 true。

全局设置:

import axios from 'axios';// 配置 axios 默认选项
axios.defaults.withCredentials = true; // 启用跨域请求时携带 cookie// 或者在单独的请求中设置
axios.get('https://api.example.com/data', {withCredentials: true,  // 也可以在请求中单独设置
})
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});

局部设置:

import axios from 'axios';axios.get('https://api.example.com/data', {withCredentials: true,  // 确保跨域请求时携带 cookie
})
.then(response => {console.log('响应数据:', response.data);
})
.catch(error => {console.error('请求错误:', error);
});

后端:如何配置 CORS 以支持跨域请求携带 cookie:
前端配置好 withCredentials 后,后端需要确保响应头正确配置,以允许跨域请求携带 cookie。

  1. 设置 Access-Control-Allow-Origin
    Access-Control-Allow-Origin 头告诉浏览器哪些域是被允许跨域访问的。如果要支持跨域携带 cookie,这个头不能设置为 *,而必须指定一个明确的域。
Access-Control-Allow-Origin: https://www.example.com
  1. 设置 Access-Control-Allow-Credentials
    Access-Control-Allow-Credentials 头需要设置为 true,以允许浏览器在跨域请求中携带 cookie。
Access-Control-Allow-Credentials: true
  1. 设置 SameSite 和 Secure 属性
    为了确保 cookie 在跨域请求中能正常发送,服务器设置的 cookie 必须带上合适的 SameSite 和 Secure 属性:

SameSite=None:确保 cookie 在跨站请求时也会被发送。
Secure:要求 cookie 只能通过 HTTPS 协议发送。

Set-Cookie: user=JohnDoe; SameSite=None; Secure; domain=.example.com; path=/;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/63727.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

一些前端组件介绍

wangEditor : 一款开源 Web 富文本编辑器,可用于 jQuery Vue React等 https://www.wangeditor.com/ Handsontable:一款前端可编辑电子表格https://blog.csdn.net/carcarrot/article/details/108492356mitt:Mitt 是一个在 Vue.js 应…

车载以太网-UDPNM

文章目录 UDPNM定义在车载以太网中的作用网络节点状态监测唤醒和睡眠管理网络拓扑发现工作流程消息发送消息接收与处理与其他车载网络协议的比较和协作UDPNM的工作原理是什么?1.消息构建与发送原理消息格式构建发送机制2.消息接收与响应原理接收过程响应机制3.状态管理与定时器…

JavaScript操作数组

push 向数组的 末尾 添加一个或多个元素,并返回新数组的长度。 语法:array.push(element1, element2, ..., elementN) const arr [1, 2, 3]; const newLength arr.push(4, 5); // 添加 4 和 5 console.log(arr); // [1, 2, 3, 4, 5] console.…

Ubuntu防火墙管理(六)——ARP防火墙过滤防御自定义系统服务

起因 在ubuntu24.04中检查arp表,输出异常 arp -a? (10.162.242.142) 位于 74:3a:20:b9:e8:02 [ether] 在 wlp2s0 ? (10.162.0.1) 位于 在 wlp2s0 ubuntu环境中,这是否表示ARP攻击,本地网关为10.162.0.1,可用arptables防御吗&a…

uniapp扭蛋机组件

做了一个uniapp的扭蛋机组件,可以前往下载地址下载 仅测试了vue2、3、h5页面微信小程序,理论支持全平台 使用方法简单,具有待机动效、抽奖中动效、掉落奖品动效,可以替换奖品图片,足以满足大部分抽奖页面需求。 示例图…

C#实现一个HttpClient集成通义千问-开发前准备

集成一个在线大模型(如通义千问),来开发一个chat对话类型的ai应用,我需要先了解OpenAI的API文档,请求和返回的参数都是以相关接口文档的标准进行的 相关文档 OpenAI API文档 https://platform.openai.com/docs/api-…

用JavaScript实现一个贪吃蛇游戏

原理如下,贪吃蛇的蛇身就是一个数组,数组中的每个元素都是一个坐标,蛇身每次移动时都会在数组前插入一个新坐标,并在数组尾部删掉一条记录,吃到食物后数组的尾部记录就不删。如果移到屏幕边缘会从屏幕的另一边出现。好…

Unity RectTransUtility工具类

这个工具主要是用于动态生成UI的情况。项目中我们通过配置UI的锚点、位置以及大小(位置、大小都是通过蓝湖看到的),然后通过代码动态生成UI。 大部分情况下只要合理设置锚点,那么生成出来的UI就已经满足了适配的要求。 using UnityEngine;public static…

红日靶场vulnstack 4靶机的测试报告[细节](一)

目录 一、测试环境 1、系统环境 2、注意事项 3、使用工具/软件 二、测试目的 三、操作过程 1、信息搜集 2、漏洞利用Getshell ①Struts 2 s2-045漏洞 手工利用s2-45漏洞 Msf综合利用 ②Tomcat框架(CVE-2017-12615) ③phpMyAdmin(CVE-2018-12613) 构造语句写入冰蝎木…

Springboot使用纪要

一、配置文件的加载顺序 1、不同配置文件类型的加载顺序 springboot支持三种类型的配置文件 .yml .yaml .properties当这三种配置文件处于同一目录下时,springboot会优先加载properties文件,如果.properties文件和.yml文件都有某一配置,而…

Unity协程机制详解

Unity的协程(Coroutine)是一种异步编程的机制,允许在多个帧之间分割代码的执行,而不阻塞主线程。与传统的多线程不同,Unity的协程在主线程中运行,并不会开启新的线程。 什么是协程? 协程是一种…

electron 打包 webview 嵌入需要调用电脑摄像头拍摄失败问题

electron 打包 webview 嵌入需要调用电脑摄像头拍摄失败问题 这篇文章是接我cocos专栏的上一篇文章继续写的,我上一篇文章写的是 cocos 开发触摸屏项目,需要嵌入一个网页用来展示,最后通过 electron 打包成 exe 程序,而且网页里面…

Android 开发者选项-模拟辅助显示设备

目录 概述使用开关的代码实现方式系统部分的处理:参考 概述 在Android开发中,模拟辅助显示设备通常指的是通过Android开发者选项来设置的一种虚拟显示设备,它允许开发者在一个设备上模拟另一个设备的显示特性。这种功能对于测试应用程序在不同屏幕尺寸、…

android 常用三方框架

说实话, 我是比较讨厌三方框架的, 比如一个eventbus 底层逻辑就是个观察者模式,当然他的场景涵盖的比较丰富, 单从 单一原则来说, 还是一个简单的观察者模式就能解决问题, 何必要添加那么多文件到我们的项目…

[COLM 2024] V-STaR: Training Verifiers for Self-Taught Reasoners

本文是对 STaR 的改进方法,COLM 是 Conference On Language Models,大模型领域新出的会议,在国际上很知名,不过目前还没有被列入 ccf list(新会议一般不会列入);作者来自高校、微软研究院和 Goo…

从C#中的结构体和类的区别中看引用和值的问题

在 C#中,结构体(struct)和类(class)都是用于创建自定义数据类型的方式,但它们在很多方面存在着显著的区别。掌握他们的区别至少不会产生一些我们不了解情况下发生的错误。 文章目录 一、作为参数传递时的差…

Spann3R:基于DUSt3R的密集捕获数据增量式重建方法

来自作者Hengyi Wang在b站3D视觉工坊中对于该论文透彻的讲解,这里是相关重要部分的截屏。这篇博客的用途主要是自己做记录,其次分享给感兴趣的同学,最后谢谢作者大佬的认真讲解。 作者是按照这样的次序来介绍的: 首先从传统的三…

Python4-分支与循环

记录python学习,直到学会基本的爬虫,使用python搭建接口自动化测试就算学会了,在进阶webui自动化,app自动化 python基础3-分支与循环语句 python中 有哪些基本值是被当作true或者false的呢?if语句示例被视为 False 的情况被视为…

SAP-ABAP开发学习-面向对象OOALV(1)

本文目录 一、概述 面向对象开发特点 二、类与对象 程序中类的创建 Class构成要素 对象 方法 一、概述 随着SAP R/3 4.0版本的开发,ABAP语言开始引入了面向对象的开发概念。这在ABAP语言的发展过程中,面向对象(Object-oriented&#…

【实用技能】如何在 .NET C# 中的邮件合并过程中操作表格单元格

TX Text Control 中的邮件合并 类是一个强大的库,旨在通过将数据合并到模板中来自动创建文档。它充当结构化数据(例如来自数据库、JSON 或 XML)和动态文档生成之间的桥梁,对于需要自动化文档工作流程的应用程序来说非常有用。 TX…