“连接被拒绝”Angular 4 localhost 开发

Posted 2023-03-07

技术标签:

【中文标题】“连接被拒绝”Angular 4 localhost 开发【英文标题】："Connection refused" Angular 4 localhost development 【发布时间】：2019-01-03 01:00:56 【问题描述】：

我在本地运行 Angular 4 应用程序时收到“连接被拒绝”页面。

网址是http://localhost:4200/

使用ng serve --open 命令运行应用程序。

更新 1：angular.json

通过一些来源，我发现 angular cli 文件现在更改为 angular.json.

以下是来自agnular.json的详细信息

"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": 
  "angular-forms": 
    "root": "",
    "sourceRoot": "src",
    "projectType": "application",
    "architect": 
      "build": 
        "builder": "@angular-devkit/build-angular:browser",
        "options": 
          "outputPath": "dist",
          "index": "src/index.html",
          "main": "src/main.ts",
          "tsConfig": "src/tsconfig.app.json",
          "polyfills": "src/polyfills.ts",
          "assets": [
            "src/assets",
            "src/favicon.ico"
          ],
          "styles": [
            "src/styles.css"
          ],
          "scripts": []
        ,
        "configurations": 
          "production": 
            "optimization": true,
            "outputHashing": "all",
            "sourceMap": false,
            "extractCss": true,
            "namedChunks": false,
            "aot": true,
            "extractLicenses": true,
            "vendorChunk": false,
            "buildOptimizer": true,
            "fileReplacements": [
              
                "replace": "src/environments/environment.ts",
                "with": "src/environments/environment.prod.ts"
              
          ]
        
      
    ,
    "serve": 
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": 
        "browserTarget": "angular-forms:build"
      ,
      "configurations": 
        "production": 
          "browserTarget": "angular-forms:build:production"
        
      
    ,
    "extract-i18n": 
      "builder": "@angular-devkit/build-angular:extract-i18n",
      "options": 
        "browserTarget": "angular-forms:build"
      
    ,
    "test": 
      "builder": "@angular-devkit/build-angular:karma",
      "options": 
        "main": "src/test.ts",
        "karmaConfig": "./karma.conf.js",
        "polyfills": "src/polyfills.ts",
        "tsConfig": "src/tsconfig.spec.json",
        "scripts": [],
        "styles": [
          "src/styles.css"
        ],
        "assets": [
          "src/assets",
          "src/favicon.ico"
        ]
      
    ,
    "lint": 
      "builder": "@angular-devkit/build-angular:tslint",
      "options": 
        "tsConfig": [
          "src/tsconfig.app.json",
          "src/tsconfig.spec.json"
        ],
        "exclude": [
          "**/node_modules/**"
        ]
      
    
  
,
"angular-forms-e2e": 
  "root": "",
  "sourceRoot": "",
  "projectType": "application",
  "architect": 
    "e2e": 
      "builder": "@angular-devkit/build-angular:protractor",
      "options": 
        "protractorConfig": "./protractor.conf.js",
        "devServerTarget": "angular-forms:serve"
      
    ,
    "lint": 
      "builder": "@angular-devkit/build-angular:tslint",
      "options": 
        "tsConfig": [
          "e2e/tsconfig.e2e.json"
        ],
        "exclude": [
          "**/node_modules/**"
        ]
      
    
  

,
"defaultProject": "angular-forms",
"schematics": 
"@schematics/angular:component": 
  "prefix": "app",
  "styleext": "css"
,
"@schematics/angular:directive": 
  "prefix": "app"

如果需要更多详细信息，请告诉我

更多详情请附上截图。

【问题讨论】：

你能出示你的.angular-cli.json文件吗？您是否使用了可能会阻止自定义端口的公司代理？是的，我在代理后面工作，但我不确定自定义端口是否被阻止 【参考方案1】：

只需在 Chrome 隐身/私密模式下打开相同的 URL 即可。这只是一种解决方法。

【讨论】：

【参考方案2】：

转到命令行并运行ng serve --port 4200。

希望这会有所帮助。

【讨论】：

【参考方案3】：

我已经找到了解决方案，而且非常简单。当@Devid 向 mi 询问有关公司代理的问题时，我已经开始朝这个方向搜索解决方案。最后我发现我的局域网代理设置有小错误。