Nginx 配置用户名密码访问

安装工具包

ubuntu 安装 apt-get install apache2-utils
centos 安装 yum -y install httpd-tools

生成密码

选择一个保存的文件夹 /usr/local/nginx/passwd , 在该目录下执行 [[ sudo htpasswd -c ./deepin deepin]]

./deepin 未保存的文件名, 后一个 deepin 为输入的用户名

ubuntu@VM-0-2-ubuntu:/usr/local/nginx/passwd$ sudo htpasswd -c /usr/local/nginx/passwd/deepin deepin
New password: 
Re-type new password: 
Adding password for user deepin

加载密码到 nginx

vim /etc/nginx/nginx.conf

server {
        listen 443 ssl;
        server_name deepin.jansora.com;
        root html;
        index index.html index.htm;

        auth_basic "请输入用户名和密码"; 
        auth_basic_user_file /usr/local/nginx/passwd/deepin;       
} 

重新加载 nginx

sudo systemctl reload nginx

Nginx 配置重定向

// 方法1： nginx 官方说明：This is a wrong, cumbersome, and ineffective way (这是一种错误，麻烦，无效的方式！)
server {
    listen       80;
    server_name  www.example.org  example.org;
    if ($http_host = example.org) {
        rewrite  (.*)  http://www.example.org$1;
    }
    ...
}

// 方法2：
// nginx 官方推荐
server {
    listen       80;
    server_name  example.org;
    return       301 http://www.example.org$request_uri;
}

nginx 部署多个 React 应用

其他 SPA 应用应该也可以

适用于 BrowerRouter 下的 React 应用

upstream app {
    server 127.0.0.1:8083;
}
server {
    listen 51002;

    location /api {
      proxy_pass http://app;
    }
    location /app1 {
      alias /app/app1/dist;
      try_files $uri /app1/index.html;
    }
    location /app2 {
      alias /app/app2/dist;
      try_files $uri /app2/index.html;
    }
    location / {
      root /app/app/dist;
      try_files $uri /index.html;
    }

}