分类
puppeteer

移除 Puppeteer 里的保存密码提示窗

大家知道,当我们使用 Chrome 完成登录的时候,Chrome 会询问我们是否要保存密码,如下图所示:

图一 询问是否保存密码的弹窗

但是在录制视频的时候,这个弹窗就不太必要了,甚至有些干扰,所以我们就想把它移除。如果搜索“puppteer prevent save password modal”,多半会被引导到这个页面,并得到结果:

--enable-automation 添加到启动标记里。

对应 Puppeteer 就是 puppeteer.launch(options) 里的 args,默认已经启用。但是使用这个选项会提示“Chrome is being controlled by automated test software.”,对录视频来说也不够理想。所以只能另辟蹊径,再找别的方法。

图二 标记浏览器被自动测试软件控制

后来我发现在 设置 > 密码(chrome://settings/passwords)里,可以关闭“提示保存密码”的选项,就不会再弹窗了。那么,我们只要修改浏览器的默认设置,即可。

我的第一反应是用 puppeteer 打开这个页面,然后修改配置。尝试之后发现不行,Puppeteer 不能打开非 http/https/file 协议的页面。接下来尝试修改 userDataDir 目录里的内容,我发现,如果使用 headless 即无窗口模式启动 puppeteer,生成的 user data 目录里的内容就很少,尤其没有 Default/Preferences 这个 json 文件,而后者才是保存浏览器设置的位置。

所以正确的解法就是:

  1. 先用 headless: false 模式启动一次 puppeteer,获得全是默认值的 userDataDir
  2. 修改 userDataDir/Default/Preferences 文件,在根对象上添加 "credentials_enable_service": false,不保存密码
  3. 启动新的 puppeteer 录制视频前,先复制 userDataDir 到目标位置
  4. puppeteer.launch({ignoreDefaultArgs: ['--enable-automation'], userDataDir: '/path/to/userDataDir'}) 启动窗口时禁用 --enable-automation 选项,避免出现图二的提示条,并且使用刚才复制的 userDataDir 保存缓存等信息

目前看来,这套解决方案最合适,希望对大家有帮助。

meathill

爱编程,爱旅游,爱吐槽。
今年的目标是完成并运营至少一个 Side Project。
《Electron + Vue 实战开发》龟速创作中……

欢迎吐槽,共同进步

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据