本文最后更新于 348 天前，其中的信息可能已经有所发展或是发生改变,如有失效可到评论区留言。

Contents

Preface

In fact, the professional reverse proxy NPM (nginx Proxy Manager) is more suitable, but the Baota Linux panel can not only do reverse proxy, but also support source code deployment, killing two birds with one stone, so I have always run the Baota Linux panel on LXC. But now I need to set up another reverse proxy on the MacMini, and NPM is the best choice at this time, so this article records the process of installing and configuring NPM.

Deploy npm

Create a directory that the host needs to mount into the container

mkdir -p /docker/npm/data mkdir -p /docker/npm/letsencrypt

Build npm container

The command to build npm in docker run format is as follows:

docker run --name npm -d --restart=always \ -p 9480:80 \ #http proxy port, please modify according to the actual environment. If it is deployed on the public Internet and there is a legal port 80, fill in 80 -p 9481:81 \ #gui management port, please modify according to the actual environment-p 9443:443 \ #https proxy port, please modify according to the actual environment. If it is deployed on the public Internet and there is a legal port 443, fill in 443 -v /docker/npm/data:/data \ # Map the corresponding directory of the host to the data directory in the npm container -v /docker/npm/letsencrypt:/etc/letsencrypt \ #This is where the lets encrypt certificate is stored. If external updates are required, such as regular updates by vendors such as OHTTPS, you need to operate this directory. Of course, the certificates applied for by lets encrypt itself are also in this directoryjc21/nginx-proxy-manager:latest

Initialize npm

usehttp://host ip:9481Log in to npm:

Default Username:[email protected],password:changemeAfter logging in, you will be asked to modify the following information immediately:

After saving, you will be asked to change the password:

Then officially enter the configuration interface:

Configuring a reverse proxy

Apply for an SSL certificate (optional)

Note: Although it is optional, it is now basically a must, otherwise various browsers will prompt that it is unsafe, which is annoying. There is a prerequisite for this step, that is, you have a public IP address, so it must be a cloud server or a home broadband with a public IP, and then you have your own domain name and use a common domain name provider, such as Alibaba Cloud, Tencent Cloud, Cloudflare, etc.

Under the "SSL Certificates" menu, click "Add SSL Certificate" in the red box:

The following interface appears:

After filling in the form, click Save at the bottom to save:

success:

Note 1: When creating an API in Cloudflare, you must select a specific domain name to create the API. You cannot use the Global API Key directly, otherwise an error will be reported (I can't remember which version this problem occurred in, it seems that it is because the Global API Key has too much authority and is not safe). Create a DNS specific zone API token in Cloudflare as shown below:

注2：let’s encrypt使用DNSpod进行dns鉴权以后申请的证书和腾讯云上直接申请的1年期免费证书，都是亚洲诚信范围的证书，有同一个主域名下最多20个主机名的限制，这个对应用少的朋友没啥影响，但是对应用多的就有影响了（比如我）。所以如果是同一个主域名，又有腾讯云申请的免费证书，同时你自己用let’s encrypt申请到的证书都是共享这20个额度的，一定要注意。

Create a reverse proxy for your application

Assume that I have pointed the A record of abc.tangwudi.xyz to the public IP of the cloud host on cloudflare, and the application that needs to be reversed on the cloud host is the application on port 8080, and the https service is enabled, then follow the steps below to configure the reverse proxy.
Under the "Hosts" menu item in the red box, click "Add Proxy Host" in the red box below:

In the "Details" interface of "New Proxy Host", configure as follows:

Regarding how to fill in "Forward Hostname IP" and "Forward Port", you must first figure out the location relationship between npm and the application that needs to be reversed in your actual environment. Why? Because "Forward Hostname IP" tells npm what address to use to access your deployed application, and your deployed application may be on a different host than npm, or on the same bridge on the same host, or on different bridges on the same host. This leads to multiple accessibility issues between npm and the application. Let's discuss these two scenarios below.
1. npm and application are located on different hosts
This method is the simplest, because in this deployment method, the application must be published to the outside world through port mapping (if it is deployed in Docker mode, the -p parameter is used, and the port mapping is the port in front), so "Forward Hostname IP" can be directly filled in with the IP address of another host, and "Forward Port" can be directly filled in with the published port.
2. npm and the application are located on the same host
This method is complicated. I guess some friends are often confused by this method. At this time, there are generally three situations:
2.1. Both npm and the application are connected to the same non-default bridge
For example, when using the docker run command to deploy npm and applications, -net=public-net is used. In this case, the application container name can be used instead of the IP in "Forward Hostname IP" and the real port of the application container can be directly filled in in "Forward Port".
2.2. npm and applications are in the default bridge (non-docker desktop environment)
By default, containers without the -net parameter are assigned to the default bridge. The IP address of the network card (docker0) connecting the default bridge to the host is generally 172.17.0.1 (you can use the ip addr show docker0 command on Debian to confirm this). Therefore, you can directly fill in 172.17.0.1 in the "Forward Hostname IP" and the external mapping port of the application (i.e. the -p parameter: the previous port) in the "Forward Port".

In fact, this method can be used as long as the application is on the default bridge. Even if npm is on other non-default bridges, it can use 172.17.0.1 and the application's external mapping port to communicate with the application. This method can actually be expanded. If there are other bridges, their gateway IPs 172.18.0.1, 172.19.0.1, etc. can be used in a similar way.
2.3. Both npm and applications are connected to the default bridge (docker desktop environment)
"Forward Hostname IP" can be directly filled in with the host IP, and "Forward Port" can be directly filled in with the real port mapped on the host (that is, -p parameter: the previous port).

Why do we need to distinguish between "Docker desktop environment" and "non-Docker desktop environment"? Because the virtual network card in "Docker desktop environment" is different from that in "non-Docker desktop environment". For example, my Mac Mini is a Docker environment deployed through Docker desktop, which does not have the Docker0 network card:

So the address "ping 172.17.0.1" is also unavailable:

Another Docker environment deployed directly on Debian has the Docker0 network card:

We can also ping 172.17.0.1:

As for the commonly used 127.0.0.1, this is usually used by reverse proxies at the operating system level, such as using the Baota Linux panel as a reverse proxy, or directly deploying nginx as a source code as a reverse proxy, etc. It is generally not suitable for the usual npm container deployment method.

Then configure https, make the settings as shown in the figure below under the SSL menu, and then click "save" to save:

success:

Note: In the "Advanced" menu of the "New Proxy Host" interface, you can fill in advanced parameters, such as the domain name and port sent to the backend application. In some special cases, when the reverse proxy needs to pass a domain name or port different from the host field in the access request, you need to use this advanced parameter. For example, I want to accesshttps://abc.tangwudi.xyzAfter the request reaches the reverse proxy, the host passed by the reverse proxy to the backend application is actually def.tangwudi.xyz, so the configuration is as follows:

The code is as follows:

location  /
{
    proxy_pass http://172.17.0.1:8080;
    proxy_set_header Host def.tangwudi.xyz;
    proxy_set_header X-Real-IP  $remote_addr; proxy_set_header X-Forwarded-For$ proxy_add_x_forwarded_for;
    proxy_set_header REMOTE-HOST  $remote_addr; proxy_http_version 1.1; proxy_set_header Upgrade$ http_upgrade;
}

Note: The configuration in Advanced will override the settings in the "Details" menu.

Anti-Generation GUI Access

We usedhttp://host ip:9481This method is fine for intranet, but it is definitely not possible to access it from the public network, which is too unsafe. Then, you can use npm itself to reverse the access to the gui page, as follows:

After that you can usehttps://npmgui.tangwudi.xyz:9443To access the gui (assuming that port 9443 is also mapped to port 9443 of 192.168.10.133 on the router).