Some https proxy urls failed

[doggy8088]

OS?

Windows 10

Versions.

angular-cli: 1.0.0-beta.26
node: 7.5.0
os: win32 x64

Repro steps.

1. git clone https://github.com/doggy8088/angular-cli-https-proxy-error.git
2. cd angular-cli-https-proxy-error
3. npm install
4. npm start
5. Open 'http://localhost:4200/_/help' ( this should proxy request to https://jsonbin.org/_/help )

• The page output will be Erroroccured while trying to proxy to: localhost:4200/_/help.
• The console output will be [HPM] Error occurred while trying to proxy request /_/help from localhost:4200 to https://jsonbin.org (EPROTO) (https://nodejs.org/api/errors.html#errors_common_system_errors).

The log given by the failure.

[HPM] Error occurred while trying to proxy request /_/help from localhost:4200 to https://jsonbin.org (EPROTO) (https://nodejs.org/api/errors.html#errors_common_system_errors)

Some useful details

I tested some https webiste without any proxy request problem. Don't know why I just can't proxy my https request to https://jsonbin.org website. I need to proxy my API request to that domain.

I want to log more detail about the error. I was trying to edit the node_modules\http-proxy-middleware\lib\index.js file for Line 145 shown as below to show the err message.

logger.error('[HPM] Error occurred while trying to proxy request %s from %s to %s (%s) (%s)', req.url, hostname, target, err.code, err);

Here is the error output:

[HPM] Error occurred while trying to proxy request /_/help from localhost:4200 to https://jsonbin.org (EPROTO) (Error: write EPROTO 101057795:error:14077438:SSL routines:SSL23_GET_SERVER_HELLO:tlsv1 alert internal error:openssl\ssl\s23_clnt.c:769:
)

I do can browse all these urls by browser or can send request directly from Postman. It just can't send requests to some https urls from angular-cli proxy feature.

[remy]

I'm pretty certain that this is because the target, jsonbin.org is under https and the proxy isn't being trusted. Without really knowing what I'm talking about, the SSL cert from jsonbin.org isn't trusted in the response/proxy in Angular?

I've certainly ruled this out by running a local version of jsonbin over http, and the proxy worked fine.

I'm not sure how you'd work around it without having to manually intervene and proxy the request with something like the request module.

I don't think this is a bug though, on either angular or jsonbin's side.

[doggy8088]

@remy I tried to use http-proxy-middleware standalone. There is no problem to build proxy tunnel to jsonbin.org. See below:

var express = require('express');
var proxy = require('http-proxy-middleware');
 
var app = express();
 
app.use('/api', proxy({target: 'https://jsonbin.org', changeOrigin: true}));
app.listen(3000);

It maybe some problem from webpack or something. I'm not sure.

[Meligy]

This might be a stupid check, but do you have a "secure": true property in your proxy definition as per the README sample?

[doggy8088]

@Meligy here is my proxy.config.json content. I configured to false. Even I change to true, the result still the same.
https://github.com/doggy8088/angular-cli-https-proxy-error/blob/master/proxy.config.json

[doggy8088]

@remy I finally figured out how this issue happen.

Your web server configured SNI SSL which means you can install multiple SSL certified on one IP address. So your website can't accept any domain that are registered on your web server. The webpack dev server need to configure Proxying local virtual hosts in order to keep the hostname on the proxy request to the target server. That's the key point on this issue I met yesterday.

So here is the right proxy.config.json settings in order to setup Angular-CLI proxy to your jsonbin.org site.

{
  "/**": {
    "target": {
        "host": "jsonbin.org",
        "protocol": "https:",
        "port": 443
      },
    "secure": false,
    "changeOrigin": true,
    "logLevel": "info"
  }
}

😺

[grigorig]

This doesn't work for me. Using Angular CLI 6.0.8 and NodeJS 8.11.3, I can't get the proxy to send the servername, no matter what I set in the proxy configuration. Any ideas?

[smilemuffie]

This proxy.config.json worked for me. Thanks!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}