如何将前后端分离的课设作业部署到测试环境供老师答辩检查

这学期软工课设，我选了一个Blog系统的开发题目，但今年老师检查时做了一个变态的规定，所有人开发的项目，必须部署到服务器上才能参加答辩和检查，不接受在自己的笔记本电脑上演示；于是所有人急的一批！

好了，先说一下我的课设，我用Go+go-zero+vue 做了一个前后端分离的Blog系统；自己的笔记本上就是开发环境；服务器端，我采用Go+go-zero框架提供后端 接口，前端为vue

1 程序在开发环境下的运行

先说一下开发环境下的程序运行；

go run distributedblog.go //运行后端 npm run serve //运行前端

浏览器访问localhost:8080发现可以访问

2 如何将程序部署到服务器上

2.1 云服务器申请

我直接申请了一台阿里云免费的服务器；服务器操作系统，我选择了安装Window操作系统；学生可以免费使用三个月！这不是香多了嘛

链接：阿里云 - 弹性计算 (aliyun.com)

2.2 编译打包部署

首先go build生成可执行文件

再使用远程桌面登录到Windows服务器

在服务器上打开命令行窗口，进入存放可执行文件的目录，然后运行Go项目。

cd C:\path\to\your\project .\distributedblog.exe

部署服务器接口项目，经测试接口通了；

注意配置防火墙规则，确保服务器的防火墙允许Go应用所使用的端口。

具体步骤见：如何配置Windows实例远程连接的防火墙-阿里云帮助中心 (aliyun.com)

但是，接口不能这样直接给前端调用，我们需要在接口之前，加一个专门的web服务器，作用是web服务器能帮我们解决静态资源访问的问题，以及做一个Web需要的访问管理和控制；

2.3 Web服务器选择安装

专业的web服务器首先当然是Nginx，但是Nginx服务器如果部署https应用的话，还得自己去申请证书，这个过程很浪费时间，我网上搜索了一下，发现一款自带ssl自签名的服务器，还是国人开发的，部署起来比Nginx更简单方便；

Fast-Https是一款基于Go语言开发的的多任务，高并发Web服务器产品，支持http1.1/http2.0、HTTPS、RPC等主流的协议和标准；能够实现反向代理的功能。特别的，Web服务器内置实现了自签名SSL证书的生成功能，能极大方便在测试环境下解决服务器基于https协议访问的问题； 目前，我们提供了Windows平台和Linux平台下的安装包，其它平台下的产品陆续推出中；

gitee仓库为：(Fast Https: 一款开源的多任务，高并发Web服务器产品，支持http1.1，http2；内置支持HTTPS，RPC等协议；非常简单的配置即可开箱即用！ (gitee.com))

然后我就尝试了一下，发现整个过程比nginx简单多了。

因为我申请的阿里云服务器是Windows

所以下载对应windows版本Fast-Https

2.4 如何通过域名访问系统

为一个课设作业花钱申请一个正规的域名当然不划算，不过，我们可以随便用一个自己喜欢的假域名来部署自己的系统；访问时，只需要 配置主机Hosts文件即可；

利用远程桌面，进入C:\Windows\System32\drivers\etc目录，打开hosts文件，配置你的域名解析，将域名指向服务器 IP 地址。例如：

127.0.0.1 blog.com

2.5 打包前端页面

使用以下命令打包前端vue项目

npm run build

将在目录中生成的dist文件重命名为blog，再通过远程桌面放入服务器中/httpdoc目录下

2.6 配置Fast-Https.json

使用Fast-Https配置服务器，将请求转发给博客系统。

server { "listen": 80, "server_name": "blog.com", "location": [ { "url": "/blog", "type": "proxy", "proxy_pass": "http://127.0.0.1:8088" //后端 }， { "url": "/", "type": "local", "root": "./httpdoc/blog", "index":["index.html", "index.htm"] //前端 } ] }

前后端放在同一端口上解决跨域问题

2.7 修改代码

把内部代码后端接口修改为blog.com:80/blog

再重新编译打包部署至windows服务器

2.8 服务器启动后端

go run distributedblog.go

2.9 测试：

edge浏览器访问blog.com，界面正常显示，功能正常使用，证明本项目已成功部署至Fast-Https服务器

如在部署过程中遇见问题，请详见《Fast-Https产品说明》：Fast-Https产品说明 (yuque.com)