基于Netlify + Localtunnel 实现本地项目“无服务器”部署上线

基于Netlify + Localtunnel 实现本地项目"无服务器"部署上线

  • [1. 先看效果图](#1. 先看效果图)
  • [2. 实现步骤](#2. 实现步骤)
    • [2.1 分两步走](#2.1 分两步走)
    • [2.2 netlify 部署前端资源](#2.2 netlify 部署前端资源)
    • [2.3 Localtunnel 映射 localhost 服务](#2.3 Localtunnel 映射 localhost 服务)
  • [3. 其它工具内网穿透工具对比](#3. 其它工具内网穿透工具对比)
  • [4. 总结](#4. 总结)
  • [5. 参考资料](#5. 参考资料)

1. 先看效果图

2. 实现步骤

2.1 分两步走

  • 前端资源部署:使用 netlify 实现
  • 本地服务器映射到互联网:使用 Localtunnel 实现

2.2 netlify 部署前端资源

  • Netlify官网注册账号

  • 创建站点

    • 登录成功后sites页面点击 Add new site,选择 Import an existing project
    • 可从 githubgitlabBitbucket 等选择项目源码
  • Netlify默认会为你的站点启用HTTPS,无需进行任何配置

  • 自定义域名

  • 部署完成

  • 更新部署

2.3 Localtunnel 映射 localhost 服务

  • Localtunnel 为 npm 模块,使用 npm 命令全局安装依赖 npm install -g localtunnel
  • 映射本地服务指定端口(8000)到 https地址 lt -p 8000
  • 映射成功截图如下,即可通过 https://rude-swans-refuse.loca.lt 地址访问 localhost:8000 服务

3. 其它工具内网穿透工具对比

工具 优点 缺点 适用场景
Ngrok 文档丰富、易用性强 免费版域名随机、稳定性一般 临时测试、快速部署
localhost.run 无需安装客户端 仅限Linux/Mac、功能单一 极简临时需求
FRP 完全免费、高度自定义 公网服务器、配置复杂 长期稳定项目
Cpolar 界面友好、配置直观 免费额度有限 个人开发者轻量级需求
Chisel 开源、高性能 依赖命令行操作;需公网服务器 技术向用户、数据传输
  • 推荐场景‌:
    • 临时调试‌:优先选 Ngrok 或 localhost.run‌
    • 长期项目‌:推荐 FRP 自建服务或 Cpolar‌
    • 技术探索‌:尝试 Chisel 或开源方案‌

4. 总结

  • 使用 netlify 部署前端静态资源(html/js/css/images等)
  • 使用 Localtunnel将localhost服务映射到https

5. 参考资料

相关推荐
未完成的歌~37 分钟前
云安全之k8s未授权漏洞总结
云原生·容器·kubernetes
阿里云云原生1 小时前
API 安全之认证鉴权
云原生
酷爱码3 小时前
zookeeper详细介绍以及使用
分布式·zookeeper·云原生
xcbeyond4 小时前
Kubernetes 中 Java 应用性能调优指南:从容器化特性到 JVM 底层原理的系统化优化
java·jvm·云原生·kubernetes
阿里云云原生6 小时前
高效定位 Go 应用问题:Go 可观测性功能深度解析
云原生
孔令飞6 小时前
Neovim Go IDE 安装和配置
人工智能·云原生·go
孔令飞6 小时前
如何使用声明式API编程来开发业务代码?
人工智能·云原生·go
阿里云云原生8 小时前
大模型应用联网搜索:重塑智能时代的交互与决策
云原生
Bypass--15 小时前
《云原生安全攻防》-- K8s容器安全:权限最小化与SecurityContext
安全·云原生·容器·kubernetes
开心码农1号19 小时前
K8S基础知识:DaemonSet、Deployment、StatefulSet的用法区别
云原生·容器·kubernetes