Angular 2.0 服务调用不通过 http-proxy-middleware答案

【问题标题】：Angular 2.0 service call not going through http-proxy-middlewareAngular 2.0 服务调用不通过 http-proxy-middleware
【发布时间】：2017-02-10 02:52:27
【问题描述】：

我有一个 Angular 2.0 应用程序，最近我添加了带有以下 bs-config.js 的 http-proxy-middleware：

var proxyMiddleware = require('http-proxy-middleware');

module.exports = {
    server: {
        port: 3000,
        middleware: {
            1: proxyMiddleware('/WorkLocation', {
                target: 'http://localhost/Perform/Company/WorkLocation',
                changeOrigin: false,
                logLevel: 'debug'
            }),
            2: require('connect-history-api-fallback')({index: '/index.html', verbose: true})
        }
    }
};

那我有这样的服务：

export class WorkLocationsService extends BaseRestfulService<WorkLocationItemModel[]> {    

    private workLocationsServiceUrl: string = '/WorkLocation/EditList/111014/73442';

    constructor(protected _http: Http) { super(_http) }

    public getWorkLocations(): Observable<WorkLocationItemModel[]> {        
        return this.callApiEndPoint(null, this.workLocationsServiceUrl, HttpVerb.Get);
    };

当我通过 npm start 启动我的应用程序时，它会启动 bs-config.js 代理设置，我会看到以下输出：

[1] [HPM] GET /WorkLocation/EditList/111014/73442 -> http://localhost/Perform/Company/WorkLocation
[1] 17.02.09 20:44:09 404 GET /WorkLocation/EditList/111014/73442

看起来 HPM 代理正在执行正确的翻译，但在下面的行中，我在来自 WorkLocationService 调用的 GET 上收到 404 错误。如果我的服务看起来配置正确，为什么它不能通过代理？我错过了什么吗？

【问题讨论】：

标签： angularjs proxy http-proxy-middleware

【解决方案1】：

原来我的目标错了。

我有：

target: 'http://localhost/Perform/Company/Worklocation

它必须是：

target: 'http://localhost/Perform/Company'

因为 Worklocation 已经是我所传递的上下文的一部分。

这是现在为我工作的代码：

var proxyMiddleware = require('http-proxy-middleware');

module.exports = {
    server: {
        port: 3000,
        middleware: {
            1: proxyMiddleware('/WorkLocation', {
                target: 'http://localhost/Perform/Company',
                changeOrigin: true,
                logLevel: 'debug'
            }),
            2: require('connect-history-api-fallback')({index: '/index.html', verbose: true})
        }
    }
};

【讨论】：