如何在阿里云服务器Centos下面部署前后端程序(多个前端和多个后端服务)

75 阅读4分钟

需求要求

  • 开发一套金融平台系统,企业可以通过金融服务网站或者手机app进行业务申请,金融机构有一个后台业务管理系统能审批和日常管理这些贷款申请业务。
  • 前端:有三个vue程序,分别是vue做的一个业务网站(面向全市贷款企业)vue-web、一个H5手机app(面向全市贷款企业,通过企业公众号链接作为入口)vue-h5、 一个业务后台管理系统(金融机构后台审批项目用)vue-admin。
  • 后端:有两个Spring boot做的应用服务,分别为三个前端提供api调用服务。一个admin-api.jar用于网站和手机h5的api调用,另一个web-h5-api.jar。 部署方式:租用阿里云服务器ECS(4核8G,500G数据盘,5M固定带宽,Centos7)、阿里云数据库RDS一套、负载均衡服务一套、域名一个。
  • 域名指定负载均衡的公网ip进行DNS解析,DNS分别创建三个子域名,分别是www.XXX.com,admin.xxxx.com,h5.XXXX.com, 均指向同一个负载均衡的公网ip。
  • 负载均衡中可以配置多台部署有多台前端vue程序的ECS服务器(同一前端套程序),后端多台服务器的api负载均衡通过Nginx进行配置(同一套后端程序)。

为了开发调试方便本地Mac上的部署方式和Centos差不多。

  1. 在Mac的hosts文件中,增加以下内容:
##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1	localhost
255.255.255.255	broadcasthost
::1             localhost
127.0.0.1 test.wts.com
127.0.0.1 testadmin.wts.com
127.0.0.1 testh5.wts.com

总结以下是一些可能的解决方法:  
(1) 检查调试访问本地那个域名前面是不是https,如果是https要改成http才能访问到vscode启动的服务  
(2) 清除 DNS 缓存:打开终端应用程序,输入以下命令并按回车键:

**

sudo dscacheutil -flushcache sudo killall -HUP mDNSResponder


(3) 检查 hosts 文件路径:确保您正在编辑正确的 hosts 文件。hosts 文件位于 /etc/hosts。您可以使用以下命令打开 hosts 文件:

**

sudo nano /etc/hosts


(4) 确保正确编辑 hosts 文件:检查您在 hosts 文件中是否正确地添加了要屏蔽或重定向的域名和 IP 地址。确保每个条目都在单独的一行上,并在 IP 地址和域名之间使用空格或制表符。  
(5) 检查文件权限:确认您对 hosts 文件具有适当的权限。使用以下命令检查文件权限:

**

ls -l /etc/hosts


如果您没有写入权限,请使用以下命令将其更改为可写入:

**

sudo chmod +w /etc/hosts


(6) 重启网络服务:有时,重启网络服务可以使 hosts 文件的更改生效。使用以下命令重启网络服务:

**

sudo dscacheutil -flushcache sudo killall -HUP mDNSResponder sudo killall -9 mDNSResponderHelper sudo dscacheutil -configuration


(7) 使用上述命令执行后,重新访问一般都能够解决

  
  1. 安装Nginx,采用Homebrew进行安装;
  2. nginx.conf进行配置,同时创建子目录vhosts,在下面创建3个conf文件,分别是vue-web.conf,vue-h5.conf,vue-admin.conf,然后统一在nginx的根目录下的nginx.conf统一配置引入。
  3. nginx的根目录nginx的内容:

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


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

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        #location = /50x.html {
            #root   html;
        #}

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        # location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        # }

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}
    server
  	{
  	    listen 80 default;
  	    server_name _;
  	    return 403;
  	}

  	include vhosts/*.conf;
}


  1. 子nginx.conf,例如vue-5.vue的内容为:
server
{
        listen       8888;
        server_name  testh5.wts.com;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /Users/zhaokunzhong/Desktop/data/www/webh5/dist;
            index  index.html index.htm;
        }


        location /api {

                proxy_pass http://127.0.0.1:8089;
                proxy_redirect off;
                proxy_set_header HOST $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        }
}