前端nodejsvueexpress部署到阿里云

42次阅读

共计 1562 个字符,预计需要花费 4 分钟才能阅读完成。

vue+express 部署到阿里云

使用的阿里云服务器 CentOS 7.3

一,登录对应的服务器

二,在服务器进行对应的初始化

yum install -y nginx
yum install -y nodejs
yum install -y mariadb
npm install pm2 -g
npm install express -g

1. 初始化数据库

mysql_secure_installation         #直接执行初始化命令,会弹出交互配置信息
Enter current password for root (enter for none):# 初次进入密码为空,直接回车
New password:                #输入要为 root 用户设置的数据库密码。Re-enter new password:            #重复再输入一次密码。Remove anonymous users? [Y/n] y      #删除匿名帐号
Disallow root login remotely? [Y/n] n     #是否禁止 root 用户从远程登录
Remove test database and access to it? [Y/n] y  #是否删除 test 数据库,想留着也随意
Reload privilege tables now? [Y/n] y        #刷新授权表,让初始化后的设定立即生效

2. 登录数据库
mysql -u root -p

创建对应的数据库,执行对应的 sql 文件

navicat 连接阿里云数据库

阿里云开放 mysql 的 3306 端口

1. 登入 mysql
2.GRANT ALL PRIVILEGES ON . TO ‘root’@’%’ IDENTIFIED BY ‘ 您的数据库密码 ’ WITH GRANT OPTION;
3.flush privileges;

navicat 配置如下


三,将前端项目进行打包

npm run bulid

打包完成后将对应的 dist 文件上传到服务器

将服务端上传

四,配置 nginx

使用 find 命令查找对应的 nginx 目录

find / -name nginx
cd /etc/nginx
vim nginx.conf

进入 nginx 的配置文件,配置 server。

server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  47.102.100.226;   #有域名的话替换成域名
        root         /usr/share/nginx/html;

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

        location / {
         root /usr/code/dist/;   #你的打包项目上传的目录
         index index.html;
        }
        location /api/{proxy_pass http://127.0.0.1:3000;  #配置的路径代理}

        error_page 404 /404.html;
            location = /40x.html { }

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

保存对应的文件,重读 nginx 配置

nginx -s reload 

如果失败,尝试以下

nginx -c /etc/nginx/nginx.conf

然后再次重启

还是不行的话

service nginx stop
service nginx start

五,阿里云开放对应的端口

这里需要开放 mysql 的 3306 端口 // 外网 navicat 连接数据库
需要开放 http 的 80 端口
需要开放 express 默认的 3000 端口

六,进入服务器的目录

执行

npm install
npm start

可以进入网页进行测试,如果配置正常,即可正常访问网页,

如果请求发生 404,在服务器项目中的路由进行如下配置

修改路由,即在 app.js,增加一个 api

七,服务器永久运行

pm2 start bin/www

正文完
 0