从局域网束缚到使用cpoalr全场景协作！SoybeanAdmin 的效率升级秘籍

前言

SoybeanAdmin 是一款功能强大的后台管理系统，支持通过拖拽组件快速构建基础功能页面，具备主题色修改、布局缩放等动态样式调整能力，还内置了丰富的组件和权限管理功能，能满足不同后台系统的开发需求。

作为一名使用者，我深深体会到 SoybeanAdmin 的高效。它严格的代码规范减少了后期维护的麻烦，自动化路由系统省去了手动配置的时间，多主题和国际化支持让系统能轻松适配不同场景。用它开发后台，省去了很多重复工作，让我能专注于核心功能实现。

在没有使用 cpolar 之前，SoybeanAdmin 只能在局域网内使用，限制很多。而有了 cpolar 后，情况完全不同。现在我可以把本地开发的后台服务通过公网地址分享给客户，他们随时能查看并提出修改意见，不用再等我上传文件；出差时，我在酒店也能通过手机登录系统继续开发；团队成员在家办公时，也能实时同步开发进度，协作效率提高了不少。这种不受局域网限制的使用体验，让工作变得灵活又便捷。

1、关于 SoybeanAdmin

SoybeanAdmin是一款集优雅、高效与一身的后台管理系统。它基于 Vue3, Vite5, TypeScript, Pinia 和 UnoCSS 构建，不仅拥有前沿的技术栈，还内置了丰富的主题配置和组件，让你轻松应对各种需求变化。

独特之处：

• 技术前沿：采用最新的前端技术栈。
• 架构清晰：使用 pnpm monorepo 架构，结构优雅易懂。
• 代码规范：集成 eslint, prettier 和 simple-git-hooks，保证代码质量。
• 类型检查：支持严格的 TypeScript 类型检查。
• 多主题配置：内置多种主题风格，与 UnoCSS 完美结合。
• 国际化方案：轻松实现多语言支持。
• 自动化路由系统：自动生成路由导入、声明和类型。
• 权限管理：灵活的前端静态路由和后端动态路由。
• 丰富组件：内置 403、404、500 页面，以及布局组件、标签组件等。
• 命令行工具：高效的 git 提交、删除文件、发布等操作。
• 移动端适配：完美支持移动端自适应布局。

2、本地部署 SoybeanAdmin 步骤

需要准备好 git、node.js、pnpm

打开命令行先克隆项目

gitclone https://github.com/soybeanjs/soybean-admin.git

接着输入这行命令更换样例版分支

gitcheckout example

进入到项目目录中，继续安装依赖

pnpmi

最后启动项目，启动后会自动打开浏览器

pnpmdev

就能看到 SoybeanAdmin 的登录界面了，

3、简单使用 SoybeanAdmin

登录进去后能看到界面很美观，右侧可以配置主题，

左侧还有各种各样的设置，比如标签页、异常页、各种插件等等

现在你就可以在本地去开发你的后台管理系统了，但在开发之前，先要把后台样式效果发给客户确认一下。

我会使用 cpolar 把本地部署的服务发布到公网，把公网地址发给用户！你肯定会问，为什么不直接发截图呢？发截图肯定没有实时动态操作的后台模版更有冲击力呀！

4、安装 cpolar 内网穿透

访问 cpolar 官网： https://www.cpolar.com 点击免费使用注册一个账号，并下载最新版本的 Cpolar。

登录成功后，点击下载 Cpolar 到本地并安装（一路默认安装即可）本教程选择下载 Windows 版本。

Cpolar 安装成功后，在浏览器上访问 http://localhost:9200，使用 cpolar 账号登录,登录后即可看到 Cpolar web 配置界面,结下来在 web 管理界面配置即可。

5、配置公网地址

登录 cpolar web UI 管理界面后,点击左侧仪表盘的隧道管理——创建隧道：

• 隧道名称：可自定义，本例使用了:soybean，注意不要与已有的隧道名称重复
• 协议：http
• 本地地址：9527
• 域名类型：随机域名
• 地区：选择 China Top
• 点击高级：选择 host 头域，填写 IP 地址＋端口号：localhost:9527

点击创建：

创建成功后，打开左侧在线隧道列表,可以看到刚刚通过创建隧道生成了两个公网地址，接下来就可以在其他电脑或者移动端设备（异地）上，使用任意一个地址在浏览器中访问即可。

我们随意复制一个打开，能看到我们成功打开了 soybeanadmin 的页面

小结

为了方便演示，我们在上边的操作过程中使用 cpolar 生成的 HTTP 公网地址隧道，其公网地址是随机生成的。这种随机地址的优势在于建立速度快，可以立即使用。然而，它的缺点是网址是随机生成，这个地址在 24 小时内会发生随机变化，更适合于临时使用。

如果有长期使用 SoybeanAdmin，或者异地访问与使用其他本地部署的服务的需求，但又不想每天重新配置公网地址，还想让公网地址好看又好记并体验更多功能与更快的带宽，那我推荐大家选择使用固定的二级子域名方式来配置公网地址。

6、配置固定二级子域名公网地址

使用 cpolar 为其配置二级子域名，该地址为固定地址，不会随机变化。

注意需要将 cpolar 套餐升级至基础套餐或以上，且每个套餐对应的带宽不一样。【cpolar.cn 已备案】

点击左侧的预留，选择保留二级子域名，地区选择 china top，然后设置一个二级子域名名称，我这里演示使用的是 soybean，大家可以自定义。填写备注信息，点击保留。

保留成功后复制保留的二级子域名地址：

登录 cpolar web UI 管理界面，点击左侧仪表盘的隧道管理——隧道列表，找到所要配置的隧道 soybeanadmin，点击右侧的编辑。

修改隧道信息，将保留成功的二级子域名配置到隧道中

• 域名类型：选择二级子域名
• Sub Domain：填写保留成功的二级子域名
• 地区: China Top

点击更新

更新完成后，打开在线隧道列表，此时可以看到随机的公网地址已经发生变化，地址名称也变成了保留和固定的二级子域名名称。

总结：

是不是超级简单？只需要几条命令，你就拥有了一个功能强大、高颜值的后台管理系统。

而且，它的代码规范非常严格，集成了多种开发工具和插件，让你的开发工作更加高效

以上就是如何在本地 windows 系统快速部署 soybeanadmin，并安装 cpolar 内网穿透工具配置固定不变的二级子域名公网地址，实现随时随地远程访问的全过程，感谢您的观看，有任何问题欢迎留言交流。

结语

打破局域网限制后，SoybeanAdmin 的价值得到了更大发挥。它与 cpolar 的结合，为开发工作带来了实实在在的便利，是提升效率的好帮手。

cpolar 官网-安全的内网穿透工具 | 无需公网 ip | 远程访问 | 搭建网站