手把手从0到1部署项目 (Linux命令行 & 无命令行)

相信很多小伙伴都遇到过这样的问题：辛辛苦苦写了个项目，想分享给别人看看，却发现因为不在同一个网络，别人根本访问不了！想当年我也是深受其害,到处查资料,求爹爹告奶奶的,非常痛苦!所以,别担心,因为自己淋过雨,我想给你们撑把伞,今天就讲讲怎么部署,让全世界都能访问你的网站！

方法一：内网穿透

• 优点: 操作简单，无需公网IP

方法二：部署公网

• 优点: 访问速度快，稳定性高

两种方法各有优劣，大家可以根据自己的需求选择。

但是我们这次主要讲的是 第二种方式,这种用的也比较多,大家如果对第一种也感兴趣的也可以等等我的后续更新或者查阅相关资料

不用担心自己是小白！ 我准备了两种方式部署公网，总有一种适合你：

• 命令行方式: 适合有一定技术基础，追求高效部署的小伙伴。

• 无命令行方式: 完全零基础也能轻松上手，图形化界面操作更直观！

云服务器的购买

     已经购买过服务器的小伙伴可以直接跳到部署

     国内有很多厂商,像阿里云,腾讯云都有学生优惠力度,这里我选择阿里云,没有阿里云账号的注册一下

可以直接搜索云服务器相关产品,不同的云产品可能会有不同的计费规则,根据自己的实际需求来

也可直接在首页进行购买,

系统 选择centos7,地域选择离你最近的即可，这里我不过多赘叙

买完之后我们进入控制台 服务器重置,修改密码啥的都是这个按钮

然后我们点击远程连接,输入服务器密码之后就会出现这个界面,这个是阿里云自带的远程连接,就是直接远程我们购买的服务器，我们可以自己下载远程连接软件像 XShell等都是可以的，但是这里为了不引入学习成本,我们直接使用自带的就行

一些小白看到黑框框可能就害怕,没有底气了,因为我当年也是这样的,但是不用担心，接下来我讲的操作很简单

面板部署

    什么是面板呢？怎么说，面板就是一个界面,你在界面上进行操作实际上就是在使用linux命令，简单理解，就相当于navicat（数据库图形化工具和）mysql（数据库）操作

这里我讲解两种常用面板 宝塔和1panel

先来宝塔吧

宝塔

我们学任何一个东西的时候，一定要去官网看看，不要一上来就去看别人的视频讲解，一定要培养自己解决问题的能力宝塔官网 

选择安装免费版即可 

选择系统，点击复制命令

一定要选择和你云服务器一样的系统 刚刚安装的是centos,就选择centos

将代码粘贴至阿里云自带的远程连接

url=https://download.bt.cn/install/install_panel.sh;if [ -f /usr/bin/curl ];then curl -sSO $url;else wget -O install_panel.sh $url;fi;bash install_panel.sh ed8484bec

输入y 确认安装 但是得注意你的服务器是不是已经部署了项目，已经部署过项目的可能会受到影响

然后等待安装

出现以上界面就代表安装成功啦,安装成功后的信息要记得保存好 但是我们还得去做一件事情 就是去阿里云放行我们的宝塔端口，这一步很重要

我宝塔的面板端口是36251 我就放行36251 按照自己宝塔的端口来

完成到这一步，恭喜你，不用再受命令行的痛苦啦

在浏览器输入我们面板的外网地址,

输入账号密码

进去之后会显示一下界面

我们现在啥也不安装 叉掉它

我们先部署一个前端应用需要用到nginx,点击软件商店 搜素nginx点击安装

选择极速安装即可，等待安装

静态网站部署

安装完成之后就可以部署我们的前端项目啦 添加HTML项目

有域名的填写域名，没有的填自己的公网ip就行，不知道ip的在阿里云控制台进行查看,之后点击确定即可 我这里就直接填我的域名了 (关于域名的知识以后给大家讲解)

现在已经是能够通过浏览器访问了 我们输入自己的公网ip或者刚刚你填写的域名

这个就代表我们的前端静态网站部署成功了,那我们怎么样才能让这个网站内容是我们自己的内容呢 点击根目录 上传我们的文件

将自己写好的文件上传上去就行，注意得是文件名得是index.html 这是nginx默认的 

这里我也给大家准备一个装逼代码哈 上传完成之后再次打开我们的网址 

这样就成功了 怎么样是不是很简单

vue项目部署

先打包呗  命令 npm run build

然后和以上是一样的，添加静态网站 ，上传文件即可  不过我们也可以先上传我们的文件，创建html网站的时候选择你上传文件的路径即可

上传文件

添加HTML项目

选择文件路径

但是不同于纯html项目来说，如果你的vue项目用到了代理服务器,那你得改一下nginx配置文件,选择你的代理服务器

java项目部署

没有jdk的时候安装一下jdk就行，端口为你项目实际运行的端口 启动命令就是 java -jar xxxxx   但是部署java项目的时候一定要改你的数据库地址，不能再用本地的数据库地址 像mysql redis等，都可以在软件商店安装，就和安装nginx是一样的，但是注意安装完之后要去阿里云开放端口和开放宝塔端口一样的步骤 访问地址就是 ip+端口号  比如  888888(公网ip):3306(数据库端口)

怎么样面板是不是很简单啊

1panel

再来说一下1panel面板

它是基于docker操作的大家不知道docker的也没有关系,我们对着官方文档来就行

和宝塔一样的操作 复制代码进入阿里云远程控制软件

curl -sSL https://resource.fit2cloud.com/1panel/package/quick_start.sh -o quick_start.sh && sh quick_start.sh

然后粘贴并执行命令

选择语言

选择1panel安装目录 直接点击Enter就行 

这三个我们也是直接无脑Enter键默认就行安装完成之后 记得保存好信息,就和宝塔一样

并且记得去阿里云控制台开放安全端口，也是和安装宝塔一样的开放端口流程

现在就可以输入外网地址访问我们的1panel面板啦

输入用户名和密码 

进入1panel

个人感觉1panel的ui界面更加的美观哈

和宝塔一样的，选择应用商店,安装应用 不同于宝塔安装nginx 1panel前端我们安装的是OpenResty,其OpenResty就是基于nginx的 不过我们不用管那么多哈

​选择安装端口 默认就行  容器名称是docker容器名称，我们也不用管，直接点击确认就行​

静态网站部署

点击创建网站

​

选择静态网站

​

和宝塔一样填域名或者你的ip地址都可以 点击确认即可

测试是否部署成功 浏览器输入域名或者公网即可

​

点击网站目录 将我们自己的代码传上去

​

​

再次在浏览器输入网址即可查看你部署的项目

vue项目部署

命令 npm run build 打包vue项目  然后和部署静态网站是一样的

代理服务器 （如果没有用到代理服务器的就不用下面这一步了）

​
创建代理规则,也可以直接在点击配置文件,在配置文件中修改

​

java项目部署

先上传jar包文件

​

然后再创建java运行环境

名称随便填一个 根据你自己的需要来 

选择合适的jdk

运行目录选择你刚啊上传jar包的目录

外部端口就是你项目运行所需的端口

应用端口和外部端口填一样的

容器名称也随便填一个

​

这样一个java项目就部署好了但是一定要记得去开放端口 比如你的java后端是8101  那么你就要去阿里云控制台开放 8101端口  以上就是两个不同的面板之间的部署 我个人更喜欢1panel面版哈 、

Linux命令行部署

小伙伴们面板的使用是否学费了呢 现在我们来讲解使用Linux命令行进行部署

这里采用docker进行部署

安装docker

如果你们之前已经装了1panel面板 是不需要再安装docker,因为装docker的时候,已经装了docker

1.卸载旧版

  首先如果系统中已经存在旧的Docker，则先卸载

yum remove docker \
    docker-client \
    docker-client-latest \
    docker-common \
    docker-latest \
    docker-latest-logrotate \
    docker-logrotate \
    docker-engine \
    docker-selinux 

2.配置Docker的yum库

sudo yum install -y yum-utils device-mapper-persistent-data lvm2

  安装成功后，执行命令，配置Docker的yum源（已更新为阿里云源）：

sudo yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo

sudo sed -i 's+download.docker.com+mirrors.aliyun.com/docker-ce+' /etc/yum.repos.d/docker-ce.repo

3.执行命令，安装Docker

yum install -y docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin

4.启动和校验

# 启动Docker
systemctl start docker

# 停止Docker
systemctl stop docker

# 重启
systemctl restart docker

# 设置开机自启
systemctl enable docker

# 执行docker ps命令，如果不报错，说明安装启动成功
docker ps

5.配置镜像加速

因为docker服务器在国外大家还要配个镜像加速，这个大家自己去搜索一下哈 不能没有一点思考哦

docker部署项目

这里我讲解docker最常见的docker部署方式

1.编写dockerfile文件

2.构建docker镜像

3.运行docker容器

部署前端项目

 1.上传文件

  需要上传两个东西  一个是dist文件夹也就是你vue项目打包好后的文件（不是vue项目将html而文件上传dist也是一样的）  一个是nginx.conf 也就是nginx配置文件,如果你的前端项目不需要用到nginx.conf也可以不上传 这里不讲nginx.conf的写法,大家自己上网查阅

为了更加方便 我这里使用Xshell连接云服务器,不再使用阿里云远程连接

2.编写dockerfile

   直接复制我下面的代码即可

 vim Dockerfile

 dockerfile内容

# 使用 Nginx 作为生产服务器
FROM nginx:alpine

# 复制自定义的 Nginx 配置文件
COPY nginx.conf /etc/nginx/nginx.conf

# 复制前端构建后的静态文件到 Nginx 的默认静态文件目录
COPY dist /usr/share/nginx/html

# 暴露 80 端口
EXPOSE 80

# 启动 Nginx
CMD ["nginx", "-g", "daemon off;"]

目录结构要和我保持一样 

3.构建dockerfile镜像

docker build -t "镜像名称" .

 镜像名称根据你自己的需要填写

4.运行docker容器

docker run -d --name "容器名称" -p "容器内端口":"容器外端口" "镜像名称"

例： docker run -d --name mycontainer -p 8080:80 myimage

访问就是你的服务器ip地址:端口号

部署后端项目

        和前端是一样的,上传文件 编写dockerfile 构建镜像 启动容器

        不知道编写dockerfile的 可以问问AI哈

 以上就是linux部署项目的个人心得 欢迎大家交流哈