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

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

news 2026/2/10 17:18:20

背景：我们开发中会遇到让内嵌的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…...

编程日记 2024/5/15 19:06:18

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

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

编程日记 2024/5/15 19:04:15

在云服务器上运行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…...

编程日记 2024/5/15 19:02:13

学习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/5/15 19:01:12

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

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

编程日记 2024/5/15 18:59:09

「Python绘图」绘制同心圆

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

编程日记 2024/5/15 18:58:08

Unity基础

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

编程日记 2024/5/15 18:57:07

OpenHarmony 实战开发——ArkUI canvas组件

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

编程日记 2024/5/15 18:56:06

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…...

编程日记 2024/5/15 18:55:05

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

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

编程日记 2024/5/15 18:52:02

LeetCode 第397场周赛个人题解

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

编程日记 2024/5/15 18:49:59

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

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

编程日记 2024/5/15 18:48:58

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

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

编程日记 2024/5/15 18:47:57

Uniapp H5开发常见问题解析

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

编程日记 2024/5/15 18:46:55

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

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

编程日记 2024/5/15 18:45:53

MemoryModule - 应用编程细节

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

编程日记 2024/5/15 18:43:51

Java程序CPU持续高，如何排查？

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

编程日记 2024/5/15 18:41:48

（Java）心得：LeetCode——15.三数之和

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

编程日记 2024/5/15 18:38:44

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

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

编程日记 2024/5/15 18:37:42

UDP多对多组播通信

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

编程日记 2024/5/15 18:34:36

多云管理“拦路虎”：深入解析网络互联、身份同步与成本可视化的技术复杂度​

一、引言：多云环境的技术复杂性本质​​ 企业采用多云策略已从技术选型升维至生存刚需。当业务系统分散部署在多个云平台时，​​基础设施的技术债呈现指数级积累​​。网络连接、身份认证、成本管理这三大核心挑战相互嵌套：跨云网络构建数据…...

编程新知 2026/2/8 16:53:48

TDengine 快速体验（Docker 镜像方式）

简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能，本节首先介绍如何通过 Docker 快速体验 TDengine，然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker，请使用 安装包的方式快…...

编程新知 2026/2/8 20:41:53

剑指offer20_链表中环的入口节点

链表中环的入口节点 给定一个链表，若其中包含环，则输出环的入口节点。 若其中不包含环，则输出null。 数据范围 节点 val 值取值范围 [ 1 , 1000 ] [1,1000] [1,1000]。 节点 val 值各不相同。 链表长度 [ 0 , 500 ] [0,500] [0,500]。 …...

编程新知 2026/1/31 6:09:22

LLM基础1_语言模型如何处理文本

基于GitHub项目：https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken：OpenAI开发的专业"分词器" torch：Facebook开发的强力计算引擎，相当于超级计算器 理解词嵌入：给词语画"…...

编程新知 2025/9/25 5:16:24

leetcodeSQL解题：3564. 季节性销售分析

leetcodeSQL解题：3564. 季节性销售分析 题目： 表：sales ---------------------- | Column Name | Type | ---------------------- | sale_id | int | | product_id | int | | sale_date | date | | quantity | int | | price | decimal | -…...

编程新知 2026/2/10 3:44:54

MySQL用户和授权

开放MySQL白名单 可以通过iptables-save命令确认对应客户端ip是否可以访问MySQL服务： test: # iptables-save | grep 3306 -A mp_srv_whitelist -s 172.16.14.102/32 -p tcp -m tcp --dport 3306 -j ACCEPT -A mp_srv_whitelist -s 172.16.4.16/32 -p tcp -m tcp -…...

编程新知 2025/8/25 19:12:45

dify打造数据可视化图表

一、概述 在日常工作和学习中，我们经常需要和数据打交道。无论是分析报告、项目展示，还是简单的数据洞察，一个清晰直观的图表，往往能胜过千言万语。 一款能让数据可视化变得超级简单的 MCP Server，由蚂蚁集团 AntV 团队…...

编程新知 2026/1/20 20:10:03

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定，这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中，积分电荷法最为常用，其原理是通过测量在电容器上积累的热释电电荷，从而确定热释电系数…...

编程新知 2026/1/23 11:53:19

论文笔记——相干体技术在裂缝预测中的应用研究

目录 相关地震知识补充地震数据的认识地震几何属性 相干体算法定义基本原理第一代相干体技术：基于互相关的相干体技术（Correlation）第二代相干体技术：基于相似的相干体技术（Semblance）基于多道相似的相干体…...

编程新知 2026/2/7 1:51:12

iOS性能调优实战：借助克魔(KeyMob)与常用工具深度洞察App瓶颈

在日常iOS开发过程中，性能问题往往是最令人头疼的一类Bug。尤其是在App上线前的压测阶段或是处理用户反馈的高发期，开发者往往需要面对卡顿、崩溃、能耗异常、日志混乱等一系列问题。这些问题表面上看似偶发，但背后往往隐藏着系统资源调度不当…...

编程新知 2025/9/24 12:50:07