前端低代码架构设计前端代码部署在哪里

转载

mob64ca13f53d41 2024-01-17 13:51:22

文章标签 前端低代码架构设计 nginx ubuntu 服务器 文章分类 架构后端开发

一、前言

一般开发采用前后端分离，前端代码在本地调试没有问题后，这时候需要将其部署到服务器上，这样就可以随时随地使用网址（或域名，域名得备案申请）来进入网站了，我们来使用Nginx来部署前端代码。
前提：

已经拿到完整的前端代码包
已经在服务器上安装好nginx代理服务器

二、过程

本地前端代码上传到服务器上，使用命令：
sudo scp 本地目录主机名@host_ip:服务器目录 并提示登录密码，然后输入登录密码
例如：sudo scp ubuntu.sh ubuntu@137.*.*.*:chatbot/

前端低代码架构设计前端代码部署在哪里_前端低代码架构设计

注意：如果报错scp: /ubuntu.zip: Permission denied，则需要更改ubuntu.sh的文件权限：
chmod 777 ubuntu.zip
登录服务器，将上传的前端代码包解码到指定目录，通常放在/var/www/下，我们需要使用unzip ubuntu.zip解压前端代码包得到ubuntu代码包，并使用命令sudo mv ubuntu /var/www/移动到指定目录/var/www/
使用命令cd /etc/nginx进到nginx中，然后新建文件目录sudo mkdir conf.d，如果conf.d已存在，则不需要新建目录
.打开配置文件nginx.conf，在http模块中加上include /etc/nginx/conf.d/*.conf;这样就可以按需求目录conf.d下新建配置文件*.conf来配置单独的文件
去到目录conf.d下新建配置文件sudo vim chat.conf，并编写如下代码：

前端低代码架构设计前端代码部署在哪里_前端低代码架构设计_02

server{
         listen 8081;  #监听端口
         server_name chatbot; #域名，用于代替将要访问的主机ip
         #root /var/www/dist;  #将要访问的网站目录
  
         location / {
				root /var/www/dist;  # 项目代码路径
				index index.html index.htm;  # 入口
         }
  
}

注意：dist是们的前端代码包，里面有一个index.html文件就是打开网站的web文件
6. 保存退出，使用命令sudo nginx -s reload对nginx进行重启
7. 最后打开浏览器，在地址栏输入：http://137.*.*.*:8081按回车就可以跳转到登录网站页面了