一次全栈项目部署 centos+pm2+nginx+mysql

工具:

xshell 连接云服务器

xftp 上传dist和server后端代码

centos

安装nginx

复制代码
sudo yum install nginx -y

安装nvm

  1. 咱们这里就按照 会频繁切换来做 ,直接安装 nvm
shell 复制代码
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
  1. 出现以下打印表示 nvm 安装成功

  2. 但是此时,nvm 是无法直接使用的,因为我们还没有把它添加到 环境变量 中。此时执行 nvm -v 会得到如下打印:

  3. 想要正常使用,可以通过如下命令 添加 nvm 到环境变量

shell 复制代码
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.bashrc
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc
source ~/.bashrc
  1. 此时再次执行 nvm -v ,打印成功:

  2. 有了 nvm 之后,就可以直接安装指定的 node 版本了。比如:我这了安装 16 的版本:

shell 复制代码
nvm install 16

项目上传时不上传node_module,node_module在服务器安装

node安装完成,就进入项目目录,安装依赖

css 复制代码
npm i

7.安装pm2

css 复制代码
npm i pm2 -g

进入项目目录,pm2 start index.js

查看运行状态

xml 复制代码
 pm2 logs <应用程序名称或 ID>,就是上面表格的name

ctrl+c退出

安装mysql,用dbeaver连接查看

juejin.cn/post/722440...

报错, 可以尝试暂时禁用 GPG 密钥检查(不过这会有一定安全风险,不建议长期使用)。编辑 /etc/yum.repos.d/mysql-community.repo 文件,将 gpgcheck 选项的值改为 0

ini 复制代码
[mysql80-community]
name=MySQL 8.0 Community Server
baseurl=http://repo.mysql.com/yum/mysql-8.0-community/el/7/$basearch/
enabled=1
gpgcheck=0  # 禁用 GPG 密钥检查
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-mysql-2022

然后再次尝试安装:

vbscript 复制代码
sudo yum install mysql-community-server

通过以上步骤,你应该能够解决 GPG 密钥验证问题并成功安装 mysql-community-server

配置nginx

每次修改nginx.conf,都要重启nginx服务!

复制代码
sudo nginx -s reload

静态资源dist路径

bash 复制代码
location / {
            root   /var/my/dist;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

跨域

bash 复制代码
location /api {
     add_header 'Access-Control-Allow-Origin' '*';
      add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
      add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

      proxy_set_header   Host              $host;
      proxy_set_header   X-Real-IP         $remote_addr;
      proxy_set_header   X-Forwarded-For   $proxy_add_x_forwarded_for;
      if ($request_method = "OPTIONS") {
      add_header 'Access-Control-Allow-Origin' "$http_origin";
      add_header 'Access-Control-Allow-Credentials' "true";
      add_header 'Access-Control-Max-Age' 86400;
      add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE';
      add_header 'Access-Control-Allow-Headers' 'reqid, nid, host, x-real-ip, x-forwarded-ip, event-type, event-id, accept, content-type';
      add_header 'Content-Length' 0;
      add_header 'Content-Type' 'text/plain, charset=utf-8';
      return 204;
    }
  }

就是这个预检请求OPTINOS,没配置post请求会404

因为post发两次请求

预检请求(Preflight Request)是在跨域 HTTP 请求中,浏览器为了了解服务器支持的请求方法和头信息而发送的一种 OPTIONS 请求。

简单理解为浏览器在发送跨域请求前发一个这个预检请求OPTINOS来保证浏览器安全性

我们直接在配置文件中对这个预检请求OPTINOS进行修改,允许这个请求跨域。

最后登录服务器的公网ip

相关推荐
一城烟雨_33 分钟前
vue3 实现将html内容导出为图片、pdf和word
前端·javascript·vue.js·pdf
树懒的梦想1 小时前
调整vscode的插件安装位置
前端·cursor
低代码布道师2 小时前
第二部分:网页的妆容 —— CSS(下)
前端·css
一纸忘忧2 小时前
成立一周年!开源的本土化中文文档知识库
前端·javascript·github
涵信3 小时前
第九节:性能优化高频题-首屏加载优化策略
前端·vue.js·性能优化
前端小巷子3 小时前
CSS单位完全指南
前端·css
SunTecTec4 小时前
Flink Docker Application Mode 命令解析 - 修改命令以启用 Web UI
大数据·前端·docker·flink
拉不动的猪5 小时前
前端常见数组分析
前端·javascript·面试
小吕学编程5 小时前
ES练习册
java·前端·elasticsearch
Asthenia04125 小时前
Netty编解码器详解与实战
前端