Angular 6中的代理配置出现“未找到”错误

时间:2018-09-13 13:42:17

标签: angular proxy angular6 asp.net-core-webapi

我使用.net Core Web API + Angular 6。

角端口:4200和Web API端口:62​​633

我想使用Angular 6中的代理配置,但总是遇到相同的错误。我已经阅读了与此问题相关的答案,但是找不到解决方案。 来源:https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md

proxy.conf.js

const PROXY_CONFIG = {
    "/api": {
        "target": "http://localhost:62633",
        "secure": false,
        "pathRewrite": {
            "^/api": "http://localhost:62633"
        },
    }
}
module.exports = PROXY_CONFIG;

angular.json

"architect": {
...
"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "projectname:build",
            "proxyConfig": "proxy.conf.js",
            "port": 4200
          },
          "configurations": {
            "production": {
              "browserTarget": "projectname:build:production"
            }
          }
        }...
}

account.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

import { LoginDto } from '../../../dtos/account/accountDtos';
import { Observable } from 'rxjs';

@Injectable()
export class AccountService {
  constructor(private hC: HttpClient) { }

  login(loginModel: LoginDto): Observable<LoginDto> {
    return this.hC.post<LoginDto>('/api/login', loginModel);
  }
}

控制台中的结果

zone.js:2969 POST http://localhost:4200/api/login 404 (Not Found)

HttpErrorResponse {headers: HttpHeaders, status: 404, statusText: "Not Found", url: "http://localhost:4200/api/login", ok: false, …}

我不这么认为,但是,错误的根源可能与软件包有关吗? 谢谢。

1 个答案:

答案 0 :(得分:0)

使用

return this.hC.post<LoginDto>('/api/login', loginModel);

在我看来,您是在向自己的角度服务器(而不是后端)发送请求,确定要吗?, 也许您需要类似

的东西
return this.hC.post<LoginDto>(this.yourBackendUrl + '/api/login', loginModel);

设置构造函数

this.yourBackendUrl = this.PROXY_CONFIG["/api"]["target"]