带有Chrome的Visual Studio Code调试器拒绝连接到本地主机 [英] Visual Studio Code debugger with Chrome refused to connect to localhost

问题描述

我尝试了其他帖子的一些建议，但无济于事。

I've tried several suggestions on other posts to no avail.

我有一个9个月大的项目，不再通过vs中的F5调试在浏览器中显示码。

I have a 9 month old project that no longer shows in the browser from F5 debugging in vs code.

我用index.html文件设置了一个全新的简单项目，以尝试获取Visual Studio代码以在Chrome浏览器窗口中启动它。

I set up a brand new simple project with an index.html file to try to get Visual Studio code to launch it in a Chrome browser window.

我一直在Chrome中看到一个错误页面，上面写着：

I keep getting an error page in chrome that says:

无法访问该网站
localhost拒绝连接。
您是说 http://localhost8000.com/ 吗？
在Google上搜索本地主机8000
ERR_CONNECTION_REFUSED

This site can’t be reached localhost refused to connect. Did you mean http://localhost8000.com/? Search Google for localhost 8000 ERR_CONNECTION_REFUSED

launch.json：

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:8000",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

index.html：

index.html:

hello world!!!!!

任何帮助将不胜感激！

推荐答案

如果其他人遇到此问题，我可以通过以下方法解决：

If anyone else is having this issue, I solved it by:

1）安装ritwickdey / vscode-live-server在此处可用：
vscode-live-server链接

1)installing the ritwickdey/vscode-live-server available here: vscode-live-server link

2）重新启动vscode

2) restarting vscode

3）单击屏幕底部的Go Live按钮

3) clicking the Go Live button at the bottom of the screen

4）从出现的Chrome窗口中获取服务器地址（例如： http：// localhost：5500 / ）

4) getting the server address from the resulting Chrome window (ex: http://localhost:5500/)

5）更改.vscode / launch.json文件以包含该服务器地址：

5) changing the .vscode/launch.json file to include that server address:

{
    "version": "0.2.0",
    "configurations": [

        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:5500",
            "webRoot": "${workspaceRoot}"
        }
    ]
}

6）使用以下json创建（或编辑）settings.json文件：

6) creating(or editing) a settings.json file with the following json:

{
    "liveServer.settings.port": 5500,
    "liveServer.settings.CustomBrowser" : "chrome",
    "liveServer.settings.AdvanceCustomBrowserCmdLine": "chrome --incognito --remote-debugging-port=9222",
    "liveServer.settings.NoBrowser" : false,
    "liveServer.settings.ignoreFiles" : [
            ".vscode/**",
            "**/*.scss",
            "**/*.sass"
    ]

}

7）切换到左侧的vscode调试窗格，然后按启动Chrome浏览器旁边的绿色箭头针对localhost

7) switching to vscode's debug pane on the left and pushing the green arrow next to "Launch Chrome against localhost"

希望这可以帮助其他人！

Hope this helps someone else out!

这篇关于带有Chrome的Visual Studio Code调试器拒绝连接到本地主机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！