【electron】 客户端调试小技巧

news2024/12/25 1:08:22

1、谷歌浏览器输入:chrome://inspect打开开发者工具 可以方便拦截electron内的请求,也可以通过f12的开发者工具中的source打断点。
虽然在electron客户端内也能审查元素。
在这里插入图片描述

在这里插入图片描述

PS:但是其有局限性,如果是窗体套窗体(webview),就调试不到了,用浏览器自带的delTools可以方便拦截并且打断点调试

2、通过在source的输入框(通过ctrl+p打开)输入“:321” 可以快速定位到321行

3、通过electron客户端新开窗体承载的webview,其调试方式是需要先在webview窗体内,使用快捷键ctrl+shift+I(windows写法)打开开发者工具,再在f12的Elements内找到webview标签,鼠标左键点击选中webview标签,再在console中输入$0.openDevTools();enter执行后,会自动打开webview的开发者工具。

4、在electron中打开一个新窗体承载的webview容器,无法通过postMessage与其他url通信,有可能是因为没有开通权限(白名单没有添加)

附:项目实施的一些实现google和office 365的auth2中遇到的卡点难题

大背景前提:采用electron+micro-app架构(京东微前端,基座应用)+子应用。

1、micro-app的沙箱问题,在沙箱开启后,无法调用google auth2接口,关闭沙箱后能正常使用

2、针对第三方请求,谨慎处理请求头的添加,避免第三方请求由于严格安全校验导致请求失败

3、桌面、子应用内的iframe缺少执行jsbridge的宿主环境,缺少全局属性及数据

4、子应用中打开窗体,仍旧无法将请求发送完全,react-google-login组件实现的谷歌认证按钮无法静默请求成功谷歌认证接口

5、采用邮箱内封装的request.post请求谷歌接口,请求发送不出去,但axios可以

6、采用electron打开一个窗体内嵌webview的方式打开授权页,在webview内部无法关闭webview授权页面本身(因为是窗体,但主应用本身没有关闭的api提供),并且无法通过协议的方式传递消息(没有开放window.open权限),使用postMessage传递消息在主应用也无法监听到

7、独立的窗体承载webview实现auth2是不需要用到我们应用内的用户认证相关的逻辑的,又因为所有路由都会默认在BasicLayout布局组件里渲染,且在BasicLayout中有一些用户获取及窗体tab等相关操作,注意,这意味着里边的获取用户信息,获取窗体tab等等信息也会同时加载,但我们只是单纯的一个auth2认证页面,不需要这些,因此我们需要把auth2的路由单独提到最顶级,和/路径对应的BasicLayout布局组件并列,并且需要保证auth2的路由在/路由上方,这是为了防止/在上方时,默认把auth2组件的路由第一级给匹配到,这样会导致下面的与/路由同级的auth2路由不再被匹配。
PS:使用preload的方式在预加载时注入全局方法到webview里的window对象上

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

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

相关文章

Android——基本控件(十)

1. 图片视图:ImageView 1.1 知识点 (1)掌握ImageView组件的使用; (2)掌握图片的保存; 1.2 具体内容 之前我们讲过了RadioGroup是提供了一个存放RadioButton的一个容器,ImageVie…

STM32速成笔记—中断

文章目录 一、什么是中断二、中断的相关概念2.1 中断优先级2.2 中断嵌套2.3 中断服务函数2.4 中断标志位 三、外部中断EXIT四、中断程序配置4.1 设置中断分组并使能中断4.2 初始化EXIT4.3 编写中断服务函数 五、注意事项 一、什么是中断 首先介绍一下什么是中断。在实际开发过…

OpenCV 笔记_2

文章目录 笔记_2图像尺寸变换resize 图像缩放 (重置图像大小)flip 图像翻转hconcat 横向连接vconcat 纵向连接 图像方式变换warpAffine 仿射变换函数:矩阵M(2*3)getRotationMatrix2D 获取图像旋转矩阵M:矩阵M&#xff…

电脑出现MSVCP100.dll丢失错误怎么办?

MSVCP100.dll是一个Windows系统文件,它可以确保Windows程序正确平稳运行,如果该文件安装不正确、丢失或损坏,则使用该文件的应用程序将无法正常启动,会出现“无法启动此程序,因为计算机中丢失MSVCP100.dll”的错误提示…

OpenCV 笔记_4

文章目录 笔记_4图像细化thinning 图像细化函数 轮廓检测findContours 轮廓检测函数drawContours 轮廓绘制函数contourArea 计算轮廓面积:返回值 double类型arcLength 计算轮廓长度:返回值 double类型 轮廓外接多边形boundingRect 给定轮廓的外接矩形min…

Hook攻防之InlineHook

什么是InlineHook Inline Hook,又称为超级Hook,是一种强大而又灵活的Hook技术。 Inline Hook的主要思想就是直接修改目标函数的代码,通常是在目标函数的开头插入一个跳转指令(jmp)。这个跳转指令会将程序的执行流跳转…

PPT写作要义:信息效率

PPT写作的要义:信息效率 抖音里一个有货的讲师的总结 花里胡哨的PPT一定偏离了初衷 这点上要像互联网公司学习 其实有些PPT制作的初衷,就是搞神秘感 故意让人听不懂 趣讲大白话:大道至简 【趣讲信息科技198期】 ****************************…

基于Java绿色农产品推广应用网站设计实现(源码+lw+部署文档+讲解等)

博主介绍: ✌全网粉丝30W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战 ✌ 🍅 文末获取源码联系 🍅 👇🏻 精…

CRC原理

文章目录 简介 CRC思想错误检测基本思想多项式运算没有进位的二进制计算 CRC计算方式发送方计算接收方校验多项式选择 CRC实现原理CRC8整体处理数据单个处理数据与整体数据处理比较使用查找表加速计算 扩展到CRC16整体处理数据单个处理数据与整体数据处理比较使用查找表加速计算…

项目管理中,如何实现有效的项目预算管理?

在《PMBOK指南》第七版中,变化较大的一点是从以成果为导向演变为以价值为导向,其十二项指导原则之一——“聚焦于价值”也阐述了价值是项目的最终成功指标和驱动因素。在这一指导原则下,项目经理就不能只关注在范围、进度、成本三重要素约束下…

UmiJs - 拆包优化

UmiJs - 拆包优化 前言一. 如何拆包,怎么拆1.1 分析自己项目的编译产物结构1.2 开始拆包 二. 有哪些注意点2.1 样式丢失2.2 存在需单独打包的页面 前言 我们在写前端代码的时候,难以避免的是,我们可能引入的依赖越来越多。那么随之而来的&am…

Redis入门 - Lua脚本

原文首更地址,阅读效果更佳! Redis入门 - Lua脚本 | CoderMast编程桅杆https://www.codermast.com/database/redis/redis-scription.html Redis 脚本使用 Lua 解释器来执行脚本。 Redis 2.6 版本通过内嵌支持 Lua 环境。执行脚本的常用命令为 EVAL。 …

【Golang系列】Golang环境配置和第一个Go程序

⭐️前面的话⭐️ 本篇文章将介绍Golang语言的环境配置,以及如何在VS code中运行第一个golang程序。 📒博客主页:未见花闻的博客主页 🎉欢迎关注🔎点赞👍收藏⭐️留言📝 📌本文由未…

Pytest教程__定制allure报告(12)

定制报告需要先导入allure模块,再使用以下装饰器方法: feature: 标注主要功能模块。story: 标注feature功能模块下的分支功能。description:在报告中显示用例描述。step: 标注测试用例步骤。issue && testcase:标注用例关…

单链表刷题(1-3)

目录 反转链表 移除元素 合并有序链表 反转链表 力扣 我们用取头节点依次进行头插的方式解决这道题。需要注意的是头插前要保存下一个节点。 struct ListNode* reverseList(struct ListNode* head){typedef struct ListNode SL;SL* cur head;SL* rhead NULL;//初始指向空…

TienChin 代码格式化-项目结构大改造

代码格式化 博主下载项目之后发现,整体的代码格式化风格,与 C 那种语言很相似,说明这个作者之前就是从事这块的导致风格有点类似,我们来格式化一下,当然这不是必要的,我是没习惯这种写法所以这里我写一下我…

2023年测试岗,你真的懂测试吗?凭什么他能月薪25k+

目录:导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜) 前言 测试人员应该居安…

Redis入门 - 事务

原文首更地址,阅读效果更佳! Redis入门 - 事务 | CoderMast编程桅杆https://www.codermast.com/database/redis/redis-transaction.html Redis 事务可以一次执行多个命令, 并且带有以下三个重要的保证: 批量操作在发送 EXEC 命…

STM32串口通信详解(嵌入式学习)

STM32串口通信 1.通信基础知识1.1 时钟信号区分同步通信异步通信波特率总线协议(电气协议) 1.2 通信方式划分串行通信并行通信 1.3 通信方向划分单工通信半双工通信全双工通信常见通信总结 2. USARTUSART 介绍 3. 串口通信协议4. 相关寄存器串口控制寄存器波特率寄存器中断和状…

segment anything环境配置与使用测试

硬件:RTX3070 i9-11900H 内存16G 目录 一、环境配置 二、使用测试--predictor_example.ipynb 1.jupyter notebook准备操作 2.Object masks from prompts with SAM与Environment Set-up 3.Set-up 4.Example image 5.Selecting objects with SAM 6.Specifyin…