使用Nginx部署ssl+react+java项目

110 阅读 0 评论 73 点赞

我是靠谱客的博主愤怒苗条，这篇文章主要介绍使用Nginx部署ssl+react+java项目，现在分享给大家，希望可以做个参考。

众所周知，如果身边有一个什么都能做的大神，就会变成一个什么都不会的废人

自从我前任域名到期后，我就想要重新站起来，成为自己的大神！

第一步就从重新部署自己的博客开始学起????

首先在服务器上安装nginx，对于像我这种半路出家的小前端来说，对服务器操作的了解也是一知半解

所以我们直接使用大神的一键安装系列脚本之nginx一键安装

复制代码

1
curl -O https://dshvv.oss-cn-beijing.aliyuncs.com/inginx_ssl.sh && chmod 755 ./inginx_ssl.sh && ./inginx_ssl.sh  && rm -rf ./inginx_ssl.sh

要配置ssl就需要ssl证书。这个要自己申请哈，不管是阿里云还是腾讯云，都有一年免费年年可重新申请的证书使用

特此说明，二级域名也要申请自己的证书

也有那种多金人专属通道，花一些小????????，申请一个一站式覆盖全部域名的证书

我是在腾讯云申请的证书，因为我的域名就在腾讯了，还可以自动解析，很方便

如下是nginx的ssl配置，具体请看后方备注～～～～！！（我删除了原来自带的用不上的注释）

复制代码

#user  nobody;
worker_processes  1;
events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        #SSL协议访问端口号为443。此处如未添加ssl，可能会造成Nginx无法启动。
        listen 443 ssl;   
        #填写绑定证书的一级域名
        server_name han96.com; 
        root html;
        index index.html index.htm;
        #证书文件的存放位置
        ssl_certificate /han96/ssl/a.crt; 
        #私钥文件的存放位置
        ssl_certificate_key /han96/ssl/a.key; 
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
        ssl_prefer_server_ciphers on;   
        location / {
            root html;   #站点目录。
            index index.html index.htm;   
        }
    }
    #二级域名证书
    server {
        listen 443 ssl; 
        #二级域名。
        server_name api.han96.com;  
        root html;
        index index.html index.htm;
        #二级域名证书文件的存放位置
        ssl_certificate /han96/apissl/1.crt; 
        #二级域名私钥文件的存放位置
        ssl_certificate_key /han96/apissl/2.key; 
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
        ssl_prefer_server_ciphers on;   
        
        location / {
             proxy_pass http://95.169.9.121:7777; #代理地址
              proxy_set_header Host $host;
              proxy_set_header X-Real-IP $remote_addr;
              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_set_header X-Forwarded-Port $server_port;
        }
    }
    #前台react项目配置
    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root         html/build;

# Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

#默认打开html目录下的index.html文件
        location ~* html {
            rewrite .* /index.html break;
            root html/build;
        }

error_page 404 /404.html;
            location = /index.html {
        }

error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }

# 重定向-访问http时自动跳转到https
        rewrite ^ https://$http_host$request_uri? permanent;
    }
    #用二级域名来配置后台java请求地址
    server {
        listen 80;
        server_name api.han96.com;
        root html;
        index index.html index.htm;
        
        location / {
              #换成真正部署的后台项目地址
              proxy_pass http://111.111.1.111:7777; 
              proxy_set_header Host $host;
              proxy_set_header X-Real-IP $remote_addr;
              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_set_header X-Forwarded-Port $server_port;
        }
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
#user  nobody;
worker_processes  1;
events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        #SSL协议访问端口号为443。此处如未添加ssl，可能会造成Nginx无法启动。
        listen 443 ssl;   
        #填写绑定证书的一级域名
        server_name han96.com; 
        root html;
        index index.html index.htm;
        #证书文件的存放位置
        ssl_certificate /han96/ssl/a.crt; 
        #私钥文件的存放位置
        ssl_certificate_key /han96/ssl/a.key; 
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
        ssl_prefer_server_ciphers on;   
        location / {
            root html;   #站点目录。
            index index.html index.htm;   
        }
    }
    #二级域名证书
    server {
        listen 443 ssl; 
        #二级域名。
        server_name api.han96.com;  
        root html;
        index index.html index.htm;
        #二级域名证书文件的存放位置
        ssl_certificate /han96/apissl/1.crt; 
        #二级域名私钥文件的存放位置
        ssl_certificate_key /han96/apissl/2.key; 
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
        ssl_prefer_server_ciphers on;   
        
        location / {
             proxy_pass http://95.169.9.121:7777; #代理地址
              proxy_set_header Host $host;
              proxy_set_header X-Real-IP $remote_addr;
              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_set_header X-Forwarded-Port $server_port;
        }
    }
    #前台react项目配置
    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root         html/build;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        #默认打开html目录下的index.html文件
        location ~* html {
            rewrite .* /index.html break;
            root html/build;
        }

        error_page 404 /404.html;
            location = /index.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }

        # 重定向-访问http时自动跳转到https
        rewrite ^ https://$http_host$request_uri? permanent;
    }
    #用二级域名来配置后台java请求地址
    server {
        listen 80;
        server_name api.han96.com;
        root html;
        index index.html index.htm;
        
        location / {
              #换成真正部署的后台项目地址
              proxy_pass http://111.111.1.111:7777; 
              proxy_set_header Host $host;
              proxy_set_header X-Real-IP $remote_addr;
              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_set_header X-Forwarded-Proto $scheme;
              proxy_set_header X-Forwarded-Port $server_port;
        }
    }
}

⚠️注意：

前台react项目编译好之后可以直接放到nginx的html目录下，默认打开的就是html目录下的index.html文件，当然是可以配置的
可以配置http/https各自都可以访问站点，我没有研究所以不会-。-，在这里用的是重定向的方式，如果用户打开了http，直接跳转到https页面进行访问
我的二级域名主要用来做后台的请求地址，在项目里好看一点
最最最最重要的一点，每次更改配置都要重新执行刷新命令才能生效，具体路径看nginx安装到了哪里，如果用的一键安装系列，就放在了use目录下
复制代码/usr/local/nginx/sbin/nginx -s reload
```
1
/usr/local/nginx/sbin/nginx -s reload
```

最后是java后台的部署，用的是jar包的部署方式，在本地打包好之后上传到服务器中

怎么打包我就不说了????，俺也不是学java的

然后请出我们的一键安装系列之一键安装java

复制代码

1
curl -O https://dshvv.oss-cn-beijing.aliyuncs.com/ijava.sh && chmod 755 ./ijava.sh && ./ijava.sh  && rm -rf ./ijava.sh

部署到7777端口上，端口号这种东西看自己的心情啦，有一点说明，不要忘记改成自己的jar包名！！！

复制代码

1
2
3
4
5
6
7
8
9
#使用默认配置的启动命令
# & 后台运行
# port 指定端口号
nohup java -jar my-demo-server-0.0.1-SNAPSHOT.jar --server.port=7777 &


# 完整的启动命令
# dev 使用测试配置环境 application-dev.yml
nohup java -jar imy-demo-server-0.0.1-SNAPSHOT.jar --spring.profiles.active=dev --server.port=7777 &

可以访问我的博客看看效果哈 ???? 花贝の博客｜一个有点社恐的前端开发从业者

更多一键安装系列可以到大神的博客查看???? 一键安装系列 - 华少丁 - 博客园