vue+nodejs+mysql上线部署(服务器CentOS8)

article/2025/9/29 10:03:31

一.Liunx配置安装node(环境配置)

  1. 建software文件夹 mkdir /opt/software
    2.进入software文件夹 cd /opt/software
    3.查看服务器系统,下载相应的node版本 uname -a
    去nodejs 官网,找nodejs linux的下载链接

在这里插入图片描述

(推荐下载node-v16.5.0版本,node-v16.16.0会导致用不了–global)
4.下载node wget https://npm.taobao.org/mirrors/node/v16.5.0/node-v16.5.0-linux-x64.tar.xz
5.解压node tar -xvf ./node-v16.5.0-linux-x64.tar.xz
6.查看是否以下载 ls
在这里插入图片描述

7.重命名 mv node-v16.5.0-linux-x64 nodejs
8.检查node是否可用
cd /opt/software/nodejs/bin
./node -v
9.添加软连接(可以全局使用)
ln -s /opt/software/nodejs/bin/node /usr/local/bin/node
ln -s /opt/software/nodejs/bin/npm /usr/local/bin/npm


9.配置环境变量(可以全局使用)
vim /etc/profile
在最后一行添加 export PATH=$PATH:/opt/software/nodejs/bin
(i 进入编辑模式,Esc退出编辑模式,:q!不保存编辑,:wq保存编辑)
在这里插入图片描述

10.刷新权限(配置环境变量的必须要这一步)
source /etc/profile

11.查看全局配置是否成功
node -v
npm -v

二. vue部分配置

nginx配置安装(启动.html文件用)

1.进入安装软件文件夹
cd /opt/software
2.下载nginx压缩包
wget -c https://nginx.org/download/nginx-1.19.0.tar.gz
(推荐nginx-1.19.0版本。nginx-1.10.1过低会在make失败,与openssl不兼容)
3.解压缩
tar -zxvf nginx-1.19.0.tar.gz
4.安装依赖
注意:先查看服务器是否存在要安装的依赖

//需要安装的依赖 gcc-c++ pcre pcre-devel zlib zlib-devel openssl openssl-devel
1.查看 rpm -qa | grep 依赖的名字
如:rpm -qa | grep openssl
(注意:CentOS8有自带openssl ,没有openssl-devel)

在这里插入图片描述

2.安装依赖
yum -y install gcc-c++ pcre pcre-devel zlib zlib-devel openssl openssl-devel
//如有openssl  则:yum -y install gcc-c++ pcre pcre-devel zlib zlib-devel openssl-devel

5.进入解压后目录
cd nginx-1.19.0/
6.编译 带 http_ssl_module 参数
./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-http_v2_module --with-http_sub_module --with-http_gzip_static_module --with-pcre
7.安装
make && make install
(会在/usr/local/nginx生成一个nginx)
8.查看nginx是否安装成功
cd /usr/local/nginx/sbin
./nginx -t
在这里插入图片描述
9.修改nginx配置文件(用于配置启动的文件及https协议)
(1)进入配置文件 (服务器https,后端接口为http)
cd /usr/local/nginx/conf
vim nginx.conf

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;#http配置server {listen       80;server_name  www.xxxxx.com;                     #绑定域名#charset koi8-r;#access_log  logs/host.access.log  main;location / {root   /home/dist;                         #vue打包好的文件index.htmlindex  index.html index.htm;try_files $uri $uri/ /index.html;}rewrite ^(.*)$ https://$server_name$1 permanent;      #强制将http的域名请求转成https#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;}
}# HTTPS配置server {listen       443 ssl;server_name  www.xxxxx.com;         #绑定域名#ssl证书是在购买域名的地方,免费申请,以nginx格式下载的文件ssl_certificate      /home/ssl/xxxxxxx.pem;           #pen证书路径ssl_certificate_key  /home/ssl/xxxxxxx.key;          #key证书路径ssl_session_cache    shared:SSL:1m;ssl_session_timeout  5m;ssl_ciphers  HIGH:!aNULL:!MD5;ssl_prefer_server_ciphers  on;proxy_connect_timeout 300s;proxy_send_timeout 900;proxy_read_timeout 900;proxy_buffer_size 32k;proxy_buffers 4 64k;proxy_busy_buffers_size 128k;#spa应用配置location / {root   /home/dist;                        #vue打包好的文件index.htmlindex  index.html index.htm;try_files $uri $uri/ /index.html;  }#配置后端api#注意此处后端接口是http,而前端baseURL: "https://test.******.com/api", location /api/ {proxy_pass http://182.11.0.201:3006/;  #注意这里的斜杠,有斜杠和少了斜杠的结果是不一样的。proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;proxy_set_header Host              $host;proxy_set_header X-Forwarded-Port $server_port;}}
}

10.软连接
ln -s /usr/local/nginx/sbin/nginx /usr/local/bin/(注 /usr/local/bin/就是环境变量目录)

11.启动nginx
nginx
12.查看nginx进程
ps aux|grep nginx
在这里插入图片描述

三.nodejs配置

pm2配置安装(可多线程,用启动.js文件用)

1.安装
npm install -g pm2
2.检查是否成功安装
pm2 list
显示:
在这里插入图片描述
解决:
(1)查找pm2
find / -name pm2
(/usr为系统位置,opt为软件安装位置,将…/bin/pm2相互连接)
在这里插入图片描述
(2)建立软件链接
ln -s /opt/software/nodejs/bin/pm2 /usr/local/bin/pm2
如报错:
在这里插入图片描述
执行:ln -sf /opt/software/nodejs/bin/pm2 /usr/local/bin/pm2

3.进入.js文件夹目录下(我的在/home/mynode下)
cd /home/mynode
4.启动pm2
//app.js是启动入口文件,mynode是父文件夹,22是端口)
pm2 start app.js --name mynode:22
在这里插入图片描述

5.查看是否启动js项目
pm2 list

补充:
pm2 stop dist:22   停止
pm2 delete dist:22 删
pm2 log 查看项目启动详情

mysql配置

一.mysql安装配置 (mysql 的环境配置–关联本地电脑mysql)

1.进入安装软件路径
cd /opt/software
2.下载mysql
wget https://dev.mysql.com/get/mysql80-community-release-el8-3.noarch.rpm

3.安装
yum install mysql80-community-release-el8-3.noarch.rpm
如有报错:(这是centos8的问题)
在这里插入图片描述
解决步骤:
(1)清理yum缓存
yum clean all
(2)重建缓存
yum makecache
(3).进入配置文件
cd /etc/yum.repos.d
(4).修改(注释baseusl,添加baseusl)
vim CentOS-Linux-BaseOS.repo

name=CentOS Linux $releasever - BaseOS
#mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=BaseOS&infra=$infra
#baseurl=http://mirror.centos.org/$contentdir/$releasever/BaseOS/$basearch/os/
baseurl=https://vault.centos.org/centos/$releasever/BaseOS/$basearch/os/
gpgcheck=1
enabled=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-centosofficial

(5)vim CentOS-Linux-AppStream.repo

name=CentOS Linux $releasever - AppStream
#mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=AppStream&infra=$infra
#baseurl=http://mirror.centos.org/$contentdir/$releasever/AppStream/$basearch/os/
baseurl=https://vault.centos.org/centos/$releasever/AppStream/$basearch/os/ 
gpgcheck=0
enabled=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-centosofficial

(6)再执行yum install mysql-community-release-el7-5.noarch.rpm
y继续运行

(7)重建缓存
yum makecache

(8)重新安装
yum install mysql80-community-release-el8-3.noarch.rpm
y继续运行

4.查看该yum源支持哪些版本
yum repolist all | grep mysql
在这里插入图片描述
5.可通编辑配置,以禁用或启用某个版本
vim /etc/yum.repos.d/mysql-community.repo
修改enable即可,0代表禁用,1代表启用
在这里插入图片描述
6.查看禁用情况
yum repolist enabled | grep mysql

7.安装
yum install mysql-community-server
如报错:
在这里插入图片描述
解决方案:
先执行:yum module disable mysql
再执行:yum install mysql-community-server
在这里插入图片描述

8.启动mysql
systemctl start mysqld

9.查看mysql运行状态
systemctl status mysqld
在这里插入图片描述
10.开机自启
systemctl enable mysqld

11.重新加载系统配置
systemctl daemon-reload

12.查看mysql初始密码
cd /var/log/mysql
vim mysql.log
如进不去mysql,则使用 grep 'temporary password' /var/log/mysqld.log

在这里插入图片描述
复制密码(root@localhost后面的值):yuWdtayg8MW

13.进入mysql
mysql -uroot -p
在这里插入图片描述
14.改密码
注: mysql新的安全机制要求,mysql的密码必须包含英文大小写、数字以及特殊字符
ALTER USER 'root'@'localhost' IDENTIFIED BY '新密码' ;

ps:
修改mysql安全机制要求
#查看初始密码策略
SHOW VARIABLES LIKE 'validate_password%';

15.刷新
flush privileges;

16.远程连接
(1)换库
use mysql;
(2)查看数据库用户
select user,host from user;
在这里插入图片描述
可以看到,root用户的host未localhost,这意味着root用户只能在本机连接数据库。

所以我们需要将他改为所有机器都能连:(或者指定为ip)
(3)update user set host='%' where user='root';
在这里插入图片描述
(4)修改密码,并且不对密码加密
ALTER USER 'root'@'%' IDENTIFIED WITH mysql_native_password BY '新密码';
(5)修改完成,退出
exit
17.远程连接测试
服务器防火墙记得开放3306
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二.docker 安装配置(一直挂载mysql用)

1.下载并安装docker
curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun
2.启动docker
sudo systemctl start docker
3.查看版本号
docker -v
4.查看docker状态
systemctl status docker
在这里插入图片描述
5.配置docker镜像
vim /etc/docker/daemon.json
编辑镜像内容(以 ”华为云服务器“ 为例)
{"registry-mirrors":["https://xxxxxxcom"]} (具体地址查看自己服务器的镜像)

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
6.使配置文件生效
sudo systemctl daemon-reload
7.重新启动docker
sudo systemctl restart docker
8.启动nodejs项目
docker run -d --name mynode -p 3306:27012 mysql
-d 后台运行
mynode 项目名
3306:27012 3306为服务器开启的端口号,27012为3306映射的端口号
报错(1):(端口被占用)
在这里插入图片描述
解决:
(1)查看被占用的端口
netstat -tunlp | grep 端口号

(2)关闭端口
kill 端口

报错(2):没有运行
(1)docker ps 查看端口运行情况(为空)
在这里插入图片描述
(2)查看本地镜像
docker ps -a
在这里插入图片描述
(3)查看本地镜像详情
docker logs 镜像ID(c9caafbf64cf)
在这里插入图片描述
发现启动命令中缺少密码,由于使用的是Linux的root用户,因此将启动命令修改为如下所示
docker run --name mysql -d -it -p 3306:3306 -e MYSQL_ROOT_PASSWORD=root mysql

ps
1.停止docker : systemctl stop docker
2.查看有多少个本地镜像 : docker images
3.查看端口运行  : docker ps

http://chatgpt.dhexx.cn/article/GU9KJyvp.shtml

相关文章

[记录六]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——服务端图片上传与下载

大家好,我是小佑小佐:https://blog.csdn.net/Smell_rookie,是一名页面仔工程师,我会不定时在CSDN更新我的博客,有兴趣的可以点个关注来逛逛我的主页。 前言:本项目需要涉及前端上传图片与显示图片&#xff…

Vue.js 最新官方下载地址与项目导入

目录 VUE2下载网址 VUE2使用示例&#xff1a; VUE3下载与使用 VUE3示例&#xff1a; 在官网上下载vue.js或者是vue.min.js。并用<script>标签引入。 应小伙伴要求区分一下版本&#xff1a; VUE2下载网址 Installation — Vue.jsVue.js - The Progressive JavaScrip…

vue.js下载及安装的三种方法

vue.js下载及安装的三种方法 要下载安装vue首先得下载安装node.js和npm。下载安装好这两样以后就可以安装vue了&#xff0c;下面给大家介绍三种安装vue的方法。 1.直接在官网上下载 在官网上下载vue.js。并用<script>标签引入。 注意&#xff1a;下载时网址是 https://vu…

vue下载

第一步&#xff1a; 安装 node.js &#xff08;如果已安装就不用装了&#xff0c;当然如果你想安装最新版本的node.js最好是从新安装一遍&#xff09; node.js安装官网地址 https://nodejs.org/zh-cn/ 安装完成之后 winr 键 打开运行 输入cmd 打开命令行窗口 输入 node -v …

vue+node.js+express+axios实现连接mysql数据库(前后端分离,详细版)

这两个星期都在学vue技术&#xff0c;感觉真的是博大精深啊&#xff01; 今天&#xff0c;我给大家总结了用axios连接数据库的步骤&#xff0c;让大家少走弯路&#xff08;不像我&#xff0c;我用axios连了两天才连接成功。。。&#xff09; 1、首先&#xff0c;确保你已经有了…

VUE下载及安装

下载node.js node.js下载 &#xff0c;选择长期维护版安装NODE&#xff0c;直接全部默认&#xff0c;不要安装在C盘设置NODE 在nodejs安装路径下&#xff0c;新建node_global和node_cache两个文件夹&#xff0c;这是npm安装的全局模块所在的路径&#xff0c;以及缓存cache的路径…

全网最新的vue.js下载和安装的3种方法(2023年)

文章目录 1. 文章引言2. 环境搭建3. 安装vue.js3.1 方法一&#xff1a;官网下载vue.js源代码3.2 方法二&#xff1a;使用npm install创建3.3 方法三&#xff1a;使用bower下载 4. 总结 1. 文章引言 我主要从事java后端开发&#xff0c;但对前端也非常感兴趣&#xff0c;立志成…

Vue连接MySql数据库

一、vue-cli2 全局安装 npm install vue-cli -g 局部安装项目 vue init webpack 项目名称 例如&#xff1a;vue init webpack demo1 二、express-generator 1.全局安装 npm install express-generator -g 2.express --viewejs 项目名称 例如&#xff1a;express --view…

vue+mysql实现前端对接数据库

下载引入相关依赖 1、cnpm install --save mysql 2、cnpm install --save axios 3、cnpm install --save body-parser 4、cnpm install --save express 5、cnpm install --save crypto 在main中引入axios import Axios from axios Vue.prototype.$axios axios 配置连接…

vue下载与安装详细教程

1、安装node&#xff08;网址&#xff1a;https://www.bilibili.com/video/BV1LA411u7dE?t10&#xff09; ①、进入node官网https://nodejs.org/zh-cn/ 点击下载&#xff0c;选择适配的 ②、 双击安装&#xff0c;安装路径随意&#xff0c;勾选第四项&#xff0c;把node添加进…

Vue下载与安装

首先安装node.js环境&#xff1a; node.js安装推荐文章&#xff1a;https://www.cnblogs.com/zhouyu2017/p/6485265.html 基于node.js安装淘宝镜像npm install -g cnpm --registryhttps://registry.npm.taobao.org 安装全局vue-cli脚手架,用于帮助搭建所需的模板框架 在cmd…

【Vue前端】Vue+MySQL(整体用到vue-vli、ElementUI)

提示&#xff1a;小白自学Vue前端&#xff0c;记录一些知识点 VueMySQL(整体用到vue-cli、ElementUI&#xff09; 目录一、相关准备1. 连接数据库2. 添加相关依赖 二、 使用步骤1. userApi.js2. db.js3. index.js4. server目录下新建sqlMap.js5. register.vue6. main.js7. 启动…

vue项目之js对Mysql数据库操作

vue项目之js对Mysql数据库操作 文章目录 vue项目之js对Mysql数据库操作前言一、相关插件安装二、搭建本地服务器三、启动服务器四、前端Vue访问接口进行数据交互结尾 前言 js对数据库的基本操作 一、相关插件安装 下载express&#xff0c;Express 的作用和 Node.js 内置的 htt…

Vue.js + express +mysql实现数据库增删改查

Vue.js express mysql实现数据库增删改查 1、 下载安装Node.js 在Node.js官网可下载 2、下载vue-cli脚手架 npm install vue-cli -g 3、 创建项目 后面是项目名称&#xff0c;在安装项目过程中需要选择安装vue-router vue init webpack mysqlconnect 4、安装vue-resource依赖…

vue、jdk、nodejs、maven、tomcat、git、MinGW、mysql、navicat下载与安装

常用Java工具配置操作 文章目录 常用Java工具配置操作一、Vue1.vue2.0安装与项目搭建1)基本环境安装2)项目搭建 2.vue3.0安装与项目搭建1)基本环境安装2)项目搭建 3.升级Vue3.0项目4.小操作 二、JDK三、NodeJs四、Maven五、Tomcat六、Git七、MinGW八、MySql1.下载mysql2.使用命…

生信技能树 linux下安装bowtie2和使用bowtie2进行初步比对

linux下安装软件 echo $PATH ##查看路径echo $PATH|tr ":" "\n"|xargs ls -lh ls -lh /usr/bin 下载安装Bowtie2 首先在root下新建一个Biosoft的文件夹&#xff0c;切换目录到该文件夹 cd Biosoft 再在该文件夹下&#xff0c;新建一个Bwotie2的文件夹 mk…

LCWGS(6)在Linux服务器上安装Bowtie2

Bowtie2是一种用于将序列读段与长参考序列进行比对的超快且内存高效的工具。它特别擅长对齐大约50到100或1000个字符的读段&#xff0c;并且特别擅长对齐相对较长的&#xff08;如哺乳动物&#xff09;基因组。Bowtie2用FM索引对基因组进行索引&#xff0c;以保持其占用的内存空…

Bowtie2去除污染的使用方法

简介 Bowtie 2是一种用于长参考序列对齐测序读取的工具。它尤其擅长将大约50-100多个字符的比对到相对较长的&#xff08;例如哺乳动物&#xff09;基因组。Bowtie 2支持gapped, local,and paired-end alignment模式。可以同时使用多个处理器以实现更高的对齐速度。 使用方法 b…

html怎么删除链接css,css如何去掉链接的下划线?

我们在HTML网页制作过程中&#xff0c;相信大家对超链接这个概念并不陌生。我们都知道想要给某段文本或者指定元素添加一个锚点也就是超链接需要用到HTML中的a标签。 在使用a标签时文本超链接会自动出现下划线&#xff01;这就让一些小白们感到苦恼了&#xff0c;因为从视觉美观…

CSS学习笔记

目录 1. 学习CSS的基础 1.1 基本语法规范 1.2 引入方式 2. 选择器 2.1 选择器的功能和种类 2.2 基础选择器 2.3 复合选择器 2.3.1 后代选择器 2.3.2 子选择器 2.3.3 并集选择器 2.3.4 伪类选择器 3. 常用元素属性 3.1 字体属性 3.2 文本属性 3.3 背景属性 3.4 圆角…