一、购买服务器

首先，得有一台 24 小时无间断运行的服务器，可以选择 Windows 服务器或者 Linux 服务器，Windows 服务器通过 IIS 部署，这个不算复杂，网上可以搜到一大堆教程，本文主要讲述 Ubuntu 服务器下部署 Vue 项目。

二、重置实例密码、设置密钥对

可以选择两种方式去访问服务器，一是通过实例密码，二是通过密钥对。

三、域名购买、备案、解析

买到服务器之后，就拥有属于自己的一片空间了，但是一长串的 IP 不容易记住怎么办，两个办法：①少熬点儿夜，提高记忆力。②挑选一个自己喜欢的域名来代替 IP。大陆的域名都是需要备案的，浙江省的备案大概需要一周左右时间审核，如果身份证上地址不是浙江省，则需要另外提供暂住证明。备案通过之后，就可以解析域名了，一个一级域名可以解析出很多二级域名，一个二级域名可以解析出很多三级域名，依次类推，每一个域名都可以绑定一个服务器公网 IP。

四、SSL 证书

使用 IP 或者普通域名访问时，浏览器一般都会出现网站不安全的提示，那怎么解决呢，可以使用安装 SSL 证书实现 https 加密访问。可以使用腾讯云的一键安装功能，也可以自己手动安装，详情见另外一篇博客：Nginx 服务器 SSL 证书安装部署_acheding的博客-CSDN博客

五、登陆服务器

可以下载 SSH 客户端软件远程登陆服务器实例，如 Putty 等，Port 选 22。
通过第二步重置的实例账号密码登陆，密码输入是不可见的。

六、服务器下载 nginx

sudo su rootsudo -sapt-get install nginxnginx -vservice nginx start

七、打包 Vue 项目

yarn buildnpm run build

八、上传项目

上传打包后的 dist 文件至服务器，这里可以下载 FileZilla 等可视化文件传输工具。

九、修改 nginx 配置

vim /etc/nginx/sites-enabled/defaultviaiesc:wq

十、报错处理

find / -name error.logvim /etc/nginx/nginx.conf

十一、后端

这个时候前端基本上就完成了，不妨再继续鼓捣一下后端接口。
1.本地下载安装 JDK、JRE、IDEA，配置环境变量。
2.新建 demo 项目，依赖勾选 Spring Web，在 com.example.demo 下创建 controller 文件夹，添加 Java Class，在类外边写上 @RestController 注解，表明它是一个返回字符串的控制器，接着用 @RequestMapping 注解写一个 /hello 请求，运行并打开 localhost:8080/hello 验证一下。

mvn clean package

FROM java:8
MAINTAINER test
ADD demo-0.0.1-SNAPSHOT.jar demo.jar
EXPOSE 8080
ENTRYPOINT ["java","-jar","demo.jar"]

docker build -t my/demo .docker run -d --name demo -p 8080:8080 my/demodocker psdocker images

十二、请求接口、配置跨域

可以在后端配置，Vue 项目中配置或者 nginx 中配置，这里为 Vue3 下的代码。

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  server: {
    port: 3333, // 打开的端口号
    open: true, // 运行时打开浏览器
    proxy: {
      "^/hello": {
        target: "http://xx.xxx.xxx.xx:8080/", //接口的前缀
      },
    },
  },
});