2026/6/10 20:05:59
网站建设
项目流程
深圳做购物网站,服务 好的网站制作,网站流量分析怎么做,如何在税局网站上做税种认定文章目录前言1、关于 SoybeanAdmin2、本地部署SoybeanAdmin步骤3、简单使用SoybeanAdmin4、安装cpolar内网穿透5、配置公网地址6、配置固定二级子域名公网地址总结#xff1a;**结语**前言
SoybeanAdmin 是一款基于前沿技术栈构建的后台管理系统#xff0c;集成了丰富的主题…文章目录前言1、关于 SoybeanAdmin2、本地部署SoybeanAdmin步骤3、简单使用SoybeanAdmin4、安装cpolar内网穿透5、配置公网地址6、配置固定二级子域名公网地址总结**结语**前言SoybeanAdmin 是一款基于前沿技术栈构建的后台管理系统集成了丰富的主题配置和组件能快速搭建仪表盘、数据看板等功能页面适合程序员、开发团队用于各类后台系统开发。它的优点在于架构清晰、代码规范还支持多主题切换和移动端适配大大降低了开发和维护成本。使用 SoybeanAdmin 时其模块化设计让拖拽组件就能完成基础页面搭建动态样式调整功能能轻松满足不同客户的审美需求。不过要注意初次部署需要准备好 git、node.js 等环境按照步骤操作才能顺利启动。但在实际使用中SoybeanAdmin 默认只能在局域网内访问这给开发带来不少麻烦。比如客户想实时查看进度时只能通过截图或反复上传压缩包无法直观展示动态效果团队成员异地协作时也难以同步查看最新的开发成果。而将 SoybeanAdmin 与 cpolar 结合后这些问题迎刃而解。通过 cpolar 的内网穿透功能能把本地部署的服务暴露到公网生成可在手机、平板等设备上访问的公网地址。客户可以直接通过链接实时查看后台效果团队成员异地也能轻松协作极大提升了沟通和开发效率。1、关于 SoybeanAdminSoybeanAdmin是一款集优雅、高效与一身的后台管理系统。它基于 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 | 远程访问 | 搭建网站