使用 VSCode Chrome 调试器时无法登录 Web 应用程序

Question

当我在 VSCode 上启动调试会话时，它会打开一个新的 Chrome 窗口并加载我的 Web 应用程序。我的网络应用程序要求用户通过 Google 登录才能使用。

当我尝试登录时，收到一条错误消息“此浏览器或应用程序可能不安全”。没有选项可以让我绕过这个并登录。有人知道解决这个问题的方法吗？

Answer 1

向 Chrome 团队提交了一个错误。 https://bugs.chromium.org/p/chromium/issues/detail?id=1173641

还有 VS Code 的 github 上的问题 https://github.com/microsoft/vscode-js-debug/issues/918

截至目前（2022年1月9日），唯一的解决方案是使用其他浏览器或使用不同的调试方式。

Answer 2

登录到正确的 Google 帐户，在 https://myaccount.google.com/security 上启用“不太安全的应用程序访问”应该可以工作

来自谷歌支持：https://support.google.com/accounts/thread/22873505?msgid=24501976

Answer 3

因为 @adarsh-madrecha 看起来 chrome / chromium --remote-debugging-pipe 中有些东西会导致这种情况，另一个选项是使用 --remote-debugging-port，在我的情况下它正在工作。

我在 vscode-js-debug 文档中找到了如何执行此操作。您可以在 Visual Studio 代码的启动配置中指定端口属性。

港口 浏览器监听的端口。默认为“0”，这将导致浏览器通过管道进行调试，这通常更安全，应该选择，除非您需要从其他工具附加到浏览器。

默认值： 0

我刚刚选择了一个随机端口 (9876) 并为我工作，所以我的 launch.json 文件如下所示：

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:5500",
      "webRoot": "${workspaceFolder}",
      "port": 9876
    }
  ]
}

Answer 4

关闭所有chrome实例

在 powershell 中：

stop-process -name chrome

将

"userDataDir": false

添加到您的 launch.json

按 F5。

我的launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceFolder}/src",
            "userDataDir": false
        }
    ]
}

如果您很懒并且没有强制关闭所有 chrome 实例，您会收到错误：“无法附加到浏览器”