反向代理 angular cli 到另一个端口

Question

我想将特定 url 代理到另一台服务器。我按照此处的说明进行操作 https://github.com/angular/angular-cli#proxy-to-backend

所以为了测试，我开始 angular 2 个应用程序，一个在端口 4200 上，一个在 4201 上。

我的proxy.config.json：

{
  "/auth": {
    "target": "http://localhost:4201",
    "secure": false
  }
}

结果：

如果我在 4201 上停止服务器运行，我会得到一个错误。

Error occured while trying to proxy to: localhost:4200/auth

如果服务器是运行我仍然从 localhost:4200

我的期望：

返回 4201 的页面。

Answer 1

更新： 尽管我改变了我的方法，但我仍然对这个答案投赞成票。要反向代理，我只需在使用 angular-cli

制作的 angular 项目的根目录添加一个 proxy.config.json

{
    "/api/*": {
        "target": "http://stoemelings.showsourcing.com/",
        "secure": "true",
        "logLevel": "debug"
    }
}

more info

旧答案

我最终使用 nginx 作为反向代理。其实很简单。

下载nginx。
解压缩。
将 nginx.conf 设为：

nginx.conf

worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;


server {
        listen       8081;
        server_name  localhost;
        location / {
            proxy_pass http://127.0.0.1:4200/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
        location /auth {
            proxy_pass http://127.0.0.1:8080/auth;

        }
}
}

注意 {}，可能计数不正确。

在 nginx 位置的命令提示符中启动 nginx。

反向代理 angular cli 到另一个端口

Reverse Proxy angular cli to another port

proxy

webpack

webpack-dev-server

angular-cli

angular