【electron】 客户端调试小技巧

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对象上