一、登录服务器

  1. 登录跳板机

  2. 执行 list ,列出所有机器

  3. 执行 dssh 机器序号 ,如 dssh  ,选择机器


二、 创建nginx配置文件

  1. 进入nginx配置目录: cd usr/local/nginx/conf/vhosts

  2. 提升权限: sudo su

  3. 创建配置文件: touch www.my-app.com.conf ,配置文件以.conf结尾,( 若有其他默认配置文件,可以修改该文件后缀,让默认配置文件失效 )

  4. 编辑配置文件内容: vim www.my-app.com.conf ,内容如下:

    server {
    listen ;
    server_name www.my-app.com;
    #root /usr/share/nginx/html;

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

    access_log /data/log/nginx/www.my-app.com.log my-app;

    location ~ / {

    root /data/www/my-app/dist;

    index index.html;


    if ($request_filename ~ .*\.(htm|html)$)
    {
    add_header Cache-Control no-store;
    }

    try_files $uri $uri/ /index.html;
    }

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

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

    注:

    listen:端口号

    server_name:域名

    access_log:日志文件在服务器的存储位置(目录需手动创建,日志文件自动生成)

    location.root:代码在服务器的存储位置(项目打包后的dist文件夹位置)

  5. 退出编辑并保存: :wq


三、部署代码

  1. 本地项目代码打包: npm run build

  2. 进入配置文件中保存代码的目录: cd /data/www/

  3. 三种方式上传代码:

    • a. 从远程仓库clone,若用http方式,需输入git仓库的用户名密码;若用ssh方式,需配置ssh key

      配置ssh key:

      1. 在服务器执行 ssh-keygen -t ed25519 -C "email@example.com" ,一直enter,生成ssh key

      2. 复制生成的公用ssh key, cd /root/.ssh,vim id_ed25519.pub

      3. 在git仓库,设置 -> ssh 秘钥 -> 粘贴 -> 添加秘钥

    • b. scp上传

      1. 压缩打包后的dist文件夹, tar -zcvf ./dist.tar.gz ./dist

      2. 在本地执行  scp /my-app/dist.tar.gz root@xx.xx.xx.xx:/data/www/my-app ,将本地压缩包上传到服务器对应的文件夹中/data/www/my-app

      3. 解压上传的文件, tar -zxvf dist.tar.gz

      4. 删除压缩包, rm -rf dist.tar.gz ,( 也可暂时保存,当做备份 )

    • c. rz -be 上传

      1. 压缩打包后的dist文件夹, tar -zcvf ./dist.tar.gz ./dist ,

      2. 在服务器执行 rz -be ,手动上传压缩包

      3. 解压上传的文件, tar -zxvf dist.tar.gz

      4. 删除压缩包, rm -rf dist.tar.gz ,( 也可暂时保存,当做备份 )


四、重启nginx

  1. 进入nginx执行文件目录, cd /usr/local/nginx/sbin

  2. 若nginx未启动,启动nginx, ./nginx

  3. 若nginx已启动,重新启动nginx, ./nginx -s reload

nginx前端服务部署的更多相关文章

  1. nginx——前端服务环境

    背景:之前一直使用tomcat服务器来作为测试环境:(vue项目打包后想测试下生产环境下有没有问题!使用tomcat有各种问题,还怀疑是我们源码有问题?尴尬)今天公司同事才告诉我tomcat是专门为j ...

  2. Dockerfile + Nginx.conf文件记录(用于前端项目部署)

    Dockerfile + Nginx.conf文件记录(用于前端项目部署) 本教程依据个人理解并经过实际验证为正确,特此记录下来,权当笔记. 注:基于linux操作系统(敏感信息都进行了处理),默认服 ...

  3. nginx服务部署 说明

    第1章 常用的软件 1.1 常用来提供静态服务的软件   Apache :这是中小型Web服务的主流,Web服务器中的老大哥,   Nginx :大型网站Web服务的主流,曾经Web服务器中的初生牛犊 ...

  4. Nginx服务部署

    1 企业常用网站服务 处理静态资源:nginx.apache.Lighttpd处理动态资源:tomcat(java语言编写).php(php语言编写).python(python语言编写)nginx网 ...

  5. 使用idea开发工具,nginx服务部署Extjs6,SpringBoot项目到服务器

    编译ExtJs文件 1.输入命令 2.开始编译 3.找到编译后的文件 E:\idea_project\BaiSheng_Model\fin-ui\build\production\Admin 4.将文 ...

  6. Linux服务部署Yapi项目(安装Node Mongdb Git Nginx等)

    Linux服务部署Yapi 一,介绍与需求 1,我的安装环境:CentOS7+Node10.13.0+MongoDB4.0.10. 2,首先安装wget,用于下载node等其他工具 yum insta ...

  7. 服务发现之consul理论整理_结合Docker+nginx+Tomcat简单部署案例

    目录 一.理论概述 服务发现的概念简述 consul简述 二.部署docker+consul+Nginx案例 环境 部署 三.测试 四.总结 一.理论概述 服务发现的概念简述 在以前使用的是,N台机器 ...

  8. 部署Nginx网站服务实现访问状态统计以及访问控制功能

    原文:https://blog.51cto.com/11134648/2130987 Nginx专为性能优化而开发,最知名的优点是它的稳定性和低系统资源消耗,以及对HTTP并发连接的高处理能力,单个物 ...

  9. 【转】Linux服务部署--Java(三) Nginx

    原文地址:Nginx Linux详细安装部署教程 一.Nginx简介 Nginx是一个web服务器也可以用来做负载均衡及反向代理使用,目前使用最多的就是负载均衡,具体简介我就不介绍了百度一下有很多,下 ...

随机推荐

  1. [Codefoeces398B]Painting The Wall(概率DP)

    题目大意:一个$n\times n$的棋盘,其中有$m$个格子已经被染色,执行一次染色操作(无论选择的格子是否已被染色)消耗一个单位时间,染色时选中每个格子的概率均等,求使每一行.每一列都存在被染色的 ...

  2. 吴裕雄--天生自然PYTHON学习笔记:解决ElementNotInteractableException: Message: element not interactable

    submit=self.wait.until(EC.element_to_be_clickable((By.ID,'loginAction'))) 2.永久覆盖element来保证自己的element ...

  3. 深入探讨Java中的异常与错误处理

    Java中的异常处理机制已经比较成熟,我们的Java程序到处充满了异常的可能,如果对这些异常不做预先的处理,那么将来程序崩溃就无从调试,很难找到异常所在的位置.本文将探讨一下Java中异常与错误的处理 ...

  4. Leaflet,OpenLayers3加载ArcGIS切片(png格式,Exploded松散型)

    需求 做了一个简单的WebGIS应用,不想因为加载切片就安装一台GIS服务器.于是想直接访问图片的方式来加载地图. 需解决的问题 leafletjs目前是不能够直接加载ArcGIS服务切片的,但可以借 ...

  5. 吴裕雄--天生自然 神经网络人工智能项目:基于深度学习TENSORFLOW框架的图像分类与目标跟踪报告(续四)

    2. 神经网络的搭建以及迁移学习的测试 7.项目总结 通过本次水果图片卷积池化全连接试验分类项目的实践,我对卷积.池化.全连接等相关的理论的理解更加全面和清晰了.试验主要采用python高级编程语言的 ...

  6. MyBatis学习笔记二:MyBatis生产中使用环境搭建

    这里是在上一个环境的基础上修改的,这里就不在给出所有的配置,只给出哪里修改的配置 1.修改POJO对象为注解方式 2.创建Dao层接口 package com.orange.dao; import c ...

  7. 如何为MyEclipse添加XML文档所使用的DTD

    1.打开MyEclipse,找到菜单栏"Window"---->"Preferences(首选项)": 2.在左侧导航菜单栏找到"MyEclip ...

  8. P6跨级晋升P8再到P10,我的11年成长之路

    来自:语雀,作者:玉伯 链接:https://www.yuque.com/yubo/morning/grow-up-at-alibaba 注:这是在阿里内部前端大学的一个分享,整理了一份对外的版本,希 ...

  9. DOS命令编译JAVA程序

    上篇文章给大家写了怎么安装JDK配置,现在这篇文章我们就来学习下怎么在DOS命令下编译JAVA程序,以后没编译器都可以直接编译啦(嘻嘻!) 我这里就用永远的 “Hello wrold!”来演示下吧. ...

  10. CSAPC08台湾邀请赛_T1_skyline

    题目链接:CSAPC08台湾邀请赛_T1_skyline 题目描述 一座山的山稜线由许多片段的45度斜坡构成,每一个片段不是上坡就是下坡. / /​ * / ​/ * /  // ​/ // / 在我 ...