springboot+Vue在腾讯云部署全过程

最新推荐文章于 2024-03-23 11:48:37 发布

weixin_54475760

最新推荐文章于 2024-03-23 11:48:37 发布

阅读量537

点赞数

文章标签：腾讯云云计算 vue spring boot

本文链接：https://blog.csdn.net/weixin_54475760/article/details/128178809

版权

云端

开始部署

打开面板

购买腾讯云服务器，系统直接安装宝塔面板，按指引重置密码，获取密钥等。

这里注意需要在防火墙中添加规则，开启宝塔的默认端口号8888，设置备注避免混淆。登录宝塔并且进入宝塔面板，后续可在终端输入 bt 修改用户名及密码。

安装宝塔应用

Nginx:反向代理

phpMyAdmin:数据库管理

mysql:关系型数据库

Java项目一键部署:无脑部署tomcat、spring boot

redis:非关系型数据库

ftp:文件传输

注意事项

在以后使用新的软件或修改新配置时，随时想到在防火墙中开启端口号，否则访问不成功，在宝塔面板中可在安全选项中添加端口号规则。

所安装的软件都可以显示在首页，方便查看和配置

数据库

mySql数据库部署

打开phpMyAdmin管理

先登录www.ip138.com 查看本机的ip地址

注意！！！如果是已部署到服务器的后端访问数据库，那本机的ip是服务器的IP！！

这里执行即可

进入navcat

连接测试，看看是否成功连接。

补充

这里在配置文件中我会让mysql识别表名小写，避免以后运行报错。

lower_case_table_names=1

前端

Vue部署

打开自己的vue项目，在终端输入：

npm run build

命令执行结束后，会在项目菜单中生成一个dist目录

直接把它复制出来！

在宝塔面板文件中找一个目录把它复制进去，记住其路径

这里我把dist文件放到9090文件夹里了。

在宝塔面板中打开Nginx管理，打开配置修改。

原配置代码是这样的：

user  www www;
worker_processes auto;
error_log  /www/wwwlogs/nginx_error.log  crit;
pid        /www/server/nginx/logs/nginx.pid;
worker_rlimit_nofile 51200;

events
    {
        use epoll;
        worker_connections 51200;
        multi_accept on;
    }

http
    {
        include       mime.types;
		#include luawaf.conf;

		include proxy.conf;

        default_type  application/octet-stream;

        server_names_hash_bucket_size 512;
        client_header_buffer_size 32k;
        large_client_header_buffers 4 32k;
        client_max_body_size 50m;

        sendfile   on;
        tcp_nopush on;

        keepalive_timeout 60;

        tcp_nodelay on;

        fastcgi_connect_timeout 300;
        fastcgi_send_timeout 300;
        fastcgi_read_timeout 300;
        fastcgi_buffer_size 64k;
        fastcgi_buffers 4 64k;
        fastcgi_busy_buffers_size 128k;
        fastcgi_temp_file_write_size 256k;
		fastcgi_intercept_errors on;

        gzip on;
        gzip_min_length  1k;
        gzip_buffers     4 16k;
        gzip_http_version 1.1;
        gzip_comp_level 2;
        gzip_types     text/plain application/javascript application/x-javascript text/javascript text/css application/xml;
        gzip_vary on;
        gzip_proxied   expired no-cache no-store private auth;
        gzip_disable   "MSIE [1-6]\.";

        limit_conn_zone $binary_remote_addr zone=perip:10m;
		limit_conn_zone $server_name zone=perserver:10m;

        server_tokens off;
        access_log off;

server
    {
        listen 888;
        server_name phpmyadmin;
        index index.html index.htm index.php;
        root  /www/server/phpmyadmin;
            location ~ /tmp/ {
                return 403;
            }

        #error_page   404   /404.html;
        include enable-php.conf;

        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
        {
            expires      30d;
        }

        location ~ .*\.(js|css)?$
        {
            expires      12h;
        }

        location ~ /\.
        {
            deny all;
        }

        access_log  /www/wwwlogs/access.log;
    }
include /www/server/panel/vhost/nginx/*.conf;
}

接下来我们做修改：把server和下面大括号里的内容复制一遍，和原来并列，我们要监听自己的前端。