当前位置: 首页 > news >正文

前端内嵌iframe网页单点登录的三种方式

背景:我们开发中会遇到让内嵌的iframe进行登录,但是有希望是单点登录,不想多次登录

目录

方法一:共享sessionStorage或localStorage

方法二:设置内嵌iframe的url参数

方法三:通过父子页面通信postMessage


方法一:共享sessionStorage或localStorage

         父页面(主站)和iframe(子站点)之间如果是同一域名或满足同源策略,可以直接共享sessionStorage或localStorage中的登录信息

        对于同源的父页面和内嵌的子页面来说,它们会共享同一个sessionStorage和localStorage,而不是各自有独立的sessionStorage和localStorage。这意味着当父页面设置数据到sessionStorage和localStorage时,子页面可以读取和访问这些数据,并且当子页面设置数据到sessionStorage和localStorage时,父页面也可以读取和访问这些数据。因此,它们共享同一个sessionStorage和localStorage空间,可以实现数据共享和交互。

方法二:设置内嵌iframe的url参数

        在设置内嵌iframe的url时候,给他必要的登录信息,这个需要跟内嵌另一个网页项目的约定好,我们传给他什么他们才可以登录。

方法三:通过父子页面通信postMessage

iframe父子页面通信_iframe父子页面国际化通信-CSDN博客

扩展:同源网页

如果网页在同源的情况下,子页面可以直接通过window.parent来拿到父页面window对象,想怎么玩都行,反之父页面也可以用下面来拿到子页面window对象


const iframe = document.getElementById('myIframe');
iframe.contentWindow

相关文章:

前端内嵌iframe网页单点登录的三种方式

背景:我们开发中会遇到让内嵌的iframe进行登录,但是有希望是单点登录,不想多次登录 目录 方法一:共享sessionStorage或localStorage 方法二:设置内嵌iframe的url参数 方法三:通过父子页面通信postMessage…...

Git篇——Git提交指定文件编码

背景:项目中有些老工程的代码编码格式不统一,可以通过以下方式强行指定提交时的文件编码,可以将所有上传到git的文件的编码格式统一。 在Git中,可以通过设置.gitattributes文件来指定文件编码。在项目根目录下创建一个名为.gitat…...

在云服务器上运行StyleGAN3生成伪样本

首先是传入数据,这里我们不做赘述。 对于数据格式的裁剪,可以通过以下代码进行: from glob import glob from PIL import Image import os from tqdm import tqdm from tqdm.std import trangeimg_path glob(r"C:\Users\Administrato…...

学习Nginx(三):命令与信号

命令及选项 1. 显示帮助信息: [rootRockyLinux9 ~]# nginx -h nginx version: nginx/1.26.0 Usage: nginx [-?hvVtTq] [-s signal] [-p prefix][-e filename] [-c filename] [-g directives]选项:-?,-h : 显示帮助信息-v : 显示版本信息-V …...

软信天成:业务流程管理驱动企业数字化转型

近日,在国家发展改革委办公厅、国家数据局综合司联合印发的《数字经济2024年工作要点》中,明确强调了本年度大力推进重点领域数字化转型,营造数字化转型生态的战略举措,标志着国家对于企业数字化转型的高度重视与积极倡导。 企业…...

「Python绘图」绘制同心圆

python 绘制同心圆 一、预期结果 二、核心代码 import turtle print("开始绘制同心圆") # 创建Turtle对象 pen turtle.Turtle() pen.shape("turtle") # 移动画笔到居中位置 pen.pensize(2) #设置外花边的大小 # 设置填充颜色 pen.fillcolor("green&…...

Unity基础

概述 基础知识 3D教学 数学计算公共类Mathf 练习: 三角函数 练习: Unity中的坐标系 Vector3向量 向量模长和单位向量 向量加减乘除 练习: 向量点乘 向量叉乘 向量插值运算 Quaternion四元数 为何要使用四元数 四元数是什么 四元数常用方法 四元数计算 练…...

OpenHarmony 实战开发——ArkUI canvas组件

canvas 是 ArkUI 开发框架里的画布组件,常用于自定义绘制图形。因为其轻量、灵活、高效等优点,被广泛应用于 UI 界面开发中。本期,我们将为大家介绍 ArkUI 开发框架中 canvas 组件的使用。 一、canvas 介绍 1.1 什么是 canvas? …...

js积累一(ipv4正则校验+弹窗方式)

1. ipv4地址,点分十进制的校验 var regexIP /^((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))$/; if(strRegex.test(ip)) //true: 通过 2. 三种弹窗方式: alert();confirm(); prompt() 1&a…...

【Android】重写onClick方法时,显示Method does not override method from its supperclass

问题 重写onClick方法时,显示Method does not override method from its supperclass 解决 在类上加implements View.OnClickListener...

LeetCode 第397场周赛个人题解

目录 100296. 两个字符串的排列差 原题链接 思路分析 AC代码 100274. 从魔法师身上吸取的最大能量 原题链接 思路分析 AC代码 100281. 矩阵中的最大得分 原题链接 思路分析 AC代码 100312. 找出分数最低的排列 原题链接 思路分析 AC代码 100296. 两个字符串的排…...

Mysql数据库二进制日志导致磁盘满了处理过程

数据库的二进制日志是数据库管理系统(DBMS)用来记录所有对数据库进行修改的操作的记录。这种日志对于数据库的备份、恢复、复制和审计等操作至关重要。 以MySQL数据库为例,二进制日志(Binary Log)记录了所有更改数据的…...

前端面试题日常练-day07 【面试题】

题目 希望这些选择题能够帮助您进行前端面试的准备,答案在文末。 1. 在 JavaScript 中,以下哪个方法可以用于从数组的末尾添加一个或多个元素? A) push() B) pop() C) shift() D) unshift()2. 下列哪个 HTML 标签用于定义表格的表头&#…...

Uniapp H5开发常见问题解析

引言 在移动应用开发领域,Uniapp已经成为一个备受瞩目的技术框架,其跨平台能力和高效开发特性使得开发者能够更加便捷地构建出功能丰富、性能优越的应用程序。特别是在H5开发中,Uniapp的应用场景日益广泛,然而,随之而…...

QT状态机4-使用并行状态来避免组合爆炸

#include "MainWindow.h" #include "ui_MainWindow.h"MainWindow::MainWindow(QWidget *parent):...

MemoryModule - 应用编程细节

文章目录 MemoryModule - 应用编程细节概述笔记实验环境升级MemoryModule,在上下文中加入DLL在内存载入前的信息MemoryModule.hMemoryModule.cpp实现接口MemoryGetPayload() 整理 - 在内存载入的DLL中,取得资源表中的信息,取得载入前的DLL内容…...

Java程序CPU持续高,如何排查?

首先找到进程ID jps然后找到该进程用占用cpu高的线程 top -Hp 进程ID将线程ID转化为十六进制 printf “0x%x” 线程ID使用jstack 工具跟踪堆栈定位问题 jstack 进程ID | grep 十六进制线程ID -A 5说明,最后-A 5是打印出来后5行。...

(Java)心得:LeetCode——15.三数之和

一、原题 给你一个整数数组 nums ,判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k ,同时还满足 nums[i] nums[j] nums[k] 0 。请你返回所有和为 0 且不重复的三元组。 注意:答案中不可以包含重复的三元组。…...

Rust中忽略JSON反序列化时的不必要字段

在Rust中处理JSON数据时,经常会遇到JSON数据中包含一些在目标数据结构中不存在的字段的情况。如果你使用的是serde和serde_json这两个流行的库来处理JSON,那么有一些简单的方法可以忽略这些不必要的字段。 默认行为:忽略未知字段 在Rust中&…...

UDP多对多组播通信

广播和多播仅应用于UDP。TCP是一个面向连接的协议,TCP一定是点对点的,一点是两个主机来建立连接的,TCP肯定是单播。只有UDP才会使用广播和组播。 如下示例实现一个UDP多对多的组播通信,进程中有收、发两个线程,分别表…...

聊聊 Pulsar:Producer 源码解析

一、前言 Apache Pulsar 是一个企业级的开源分布式消息传递平台,以其高性能、可扩展性和存储计算分离架构在消息队列和流处理领域独树一帜。在 Pulsar 的核心架构中,Producer(生产者) 是连接客户端应用与消息队列的第一步。生产者…...

【大模型RAG】Docker 一键部署 Milvus 完整攻略

本文概要 Milvus 2.5 Stand-alone 版可通过 Docker 在几分钟内完成安装;只需暴露 19530(gRPC)与 9091(HTTP/WebUI)两个端口,即可让本地电脑通过 PyMilvus 或浏览器访问远程 Linux 服务器上的 Milvus。下面…...

Leetcode 3577. Count the Number of Computer Unlocking Permutations

Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接:3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯,要想要能够将所有的电脑解锁&#x…...

多模态商品数据接口:融合图像、语音与文字的下一代商品详情体验

一、多模态商品数据接口的技术架构 (一)多模态数据融合引擎 跨模态语义对齐 通过Transformer架构实现图像、语音、文字的语义关联。例如,当用户上传一张“蓝色连衣裙”的图片时,接口可自动提取图像中的颜色(RGB值&…...

基于数字孪生的水厂可视化平台建设:架构与实践

分享大纲: 1、数字孪生水厂可视化平台建设背景 2、数字孪生水厂可视化平台建设架构 3、数字孪生水厂可视化平台建设成效 近几年,数字孪生水厂的建设开展的如火如荼。作为提升水厂管理效率、优化资源的调度手段,基于数字孪生的水厂可视化平台的…...

MODBUS TCP转CANopen 技术赋能高效协同作业

在现代工业自动化领域,MODBUS TCP和CANopen两种通讯协议因其稳定性和高效性被广泛应用于各种设备和系统中。而随着科技的不断进步,这两种通讯协议也正在被逐步融合,形成了一种新型的通讯方式——开疆智能MODBUS TCP转CANopen网关KJ-TCPC-CANP…...

MySQL中【正则表达式】用法

MySQL 中正则表达式通过 REGEXP 或 RLIKE 操作符实现(两者等价),用于在 WHERE 子句中进行复杂的字符串模式匹配。以下是核心用法和示例: 一、基础语法 SELECT column_name FROM table_name WHERE column_name REGEXP pattern; …...

是否存在路径(FIFOBB算法)

题目描述 一个具有 n 个顶点e条边的无向图,该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序,确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数,分别表示n 和 e 的值(1…...

【Nginx】使用 Nginx+Lua 实现基于 IP 的访问频率限制

使用 NginxLua 实现基于 IP 的访问频率限制 在高并发场景下,限制某个 IP 的访问频率是非常重要的,可以有效防止恶意攻击或错误配置导致的服务宕机。以下是一个详细的实现方案,使用 Nginx 和 Lua 脚本结合 Redis 来实现基于 IP 的访问频率限制…...

基于PHP的连锁酒店管理系统

有需要请加文章底部Q哦 可远程调试 基于PHP的连锁酒店管理系统 一 介绍 连锁酒店管理系统基于原生PHP开发,数据库mysql,前端bootstrap。系统角色分为用户和管理员。 技术栈 phpmysqlbootstrapphpstudyvscode 二 功能 用户 1 注册/登录/注销 2 个人中…...