0

I try to tune debug Angular frontend with my Backend API, but failed. My backend with VS2022 working on port http://localhost:55278 I start Angular with proxy in console

ng serve --open --proxy-config proxy.conf.json

My proxy.conf.json is

{
  "/api": {
   "target": "http://localhost:55278",
   "secure": false,
   "logLevel": "debug",
   "changeOrigin": true
  }
}

Without VS debugger I can see my site if I start site http://localhost:4200/

Than I prepare launch.json for VS Code

{
    // 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": [
        {
            "name": "Launch index.html",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "file": "${workspaceFolder}/index.html"
        },
        {
            "name": "Launch localhost",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}",
            "timeout": 90000,
            "tmpDir": "/some/folder/of/yours/with/write/perms",
            "firefoxExecutable": "C:\\Program Files\\Mozilla Firefox\\firefox.exe"
        },
        {
            "name": "Attach",
            "type": "firefox",
            "request": "attach",
            "pathMappings": [
                {
                    "url": "webpack:///src/app/pages/admin/home",
                    "path": "${workspaceFolder}/src/app/pages/client/home"
                },
                {
                    "url": "webpack:///src/main.ts",
                    "path": "${workspaceFolder}/src/main.ts"
                }
            ]
        },
        {
            "name": "Launch WebExtension",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "addonPath": "${workspaceFolder}"
        }
    ]
}

And if I press Attach or Lanch in VS Code I have receiving error message

[HPM] POST /api/auth/user/ -> http://localhost:55278
[HPM] Error occurred while trying to proxy request /api/auth/user/ from localhost:4200 to http://localhost:55278 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)   

I'm novice in Angular development and don't understand what is going wrong?

1 Answer 1

1

It seems a configuration error of your launch.json

Try to add url property as you just do in "Launch localhost".

for example:

    {
    // 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": [
        {
            "name": "Launch index.html",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "url": "http://localhost:4200",
            "file": "${workspaceFolder}/index.html"
        },
        {
            "name": "Launch localhost",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}",
            "timeout": 90000,
            "tmpDir": "/some/folder/of/yours/with/write/perms",
            "firefoxExecutable": "C:\\Program Files\\Mozilla Firefox\\firefox.exe"
        },
        {
            "name": "Attach",
            "type": "firefox",
            "request": "attach",
            "url": "http://localhost:4200",
            "pathMappings": [
                {
                    "url": "webpack:///src/app/pages/admin/home",
                    "path": "${workspaceFolder}/src/app/pages/client/home"
                },
                {
                    "url": "webpack:///src/main.ts",
                    "path": "${workspaceFolder}/src/main.ts"
                }
            ]
        },
        {
            "name": "Launch WebExtension",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "url": "http://localhost:4200",
            "addonPath": "${workspaceFolder}"
        }
    ]
}
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.