Linux 下 Tomcat 结合内网穿透 实现 Web 应用公网访问

Linux 下 Tomcat 结合内网穿透 实现 Web 应用公网访问

前言

在日常的 Web 开发与测试中,常常会遇到这样的困扰:本地部署好的 Java Web 项目,只能在局域网内访问,想要让异地的同事协作调试、给客户演示功能,或是外出时远程查看项目运行状态,往往需要繁琐的公网 IP 配置、端口映射,甚至要依赖云服务器部署。

而有一种实用的内网穿透功能,能轻松打破这种网络限制 —— 它可以将本地运行的服务,无需复杂配置就能映射到公网,生成可全球访问的地址,让本地的 Tomcat 服务随时被外部设备访问。

今天我们要分享的,就是如何借助这一功能,搭配经典的 Tomcat 服务器,在 Linux 系统中快速实现 Web 应用的公网访问,整个过程简单易操作,几分钟就能完成配置,解决开发和演示中的网络访问难题。

image-20250826101154874

1.在CentOs7上安装OpenJDK

在已安装套件中查找含有java字符串的文件:

rpm-qa|grepjava

若没有安装则开始安装吧!

查询yum中存在的JDK版本:

yum list |grep java-11 
image-20250826103345132

执行以下命令安装:

yum install-y java-11-openjdk-headless-11.0.13.0.8-1.el7_9.x86_64 java-11-openjdk-11.0.13.0.8-1.el7_9.x86_64 java-11-openjdk-devel-11.0.13.0.8-1.el7_9.x86_64 

验证一下,安装成功:

java--version
image-20250826104223874

配置环境变量:

vim /etc/profile 
image-20250826105622123

在最后一行,添加下列内容:

xport JAVA_HOME=/usr/lib/jvm/java-11-openjdk-11.0.13.0.8-1.el7_9.x86_64 exportJRE_HOME=$JAVA_HOMEexportCLASSPATH=.:$JAVA_HOME/lib:$JRE_HOME/lib:$CLASSPATHexportPATH=$JAVA_HOME/bin:$JRE_HOME/bin:$PATH
image-20250826110824367

使文件生效:

source /etc/profile 

验证是否生效:

whereisjava
image-20250826111158436

这样我们就安装成功啦!

2.安装Tomcat10

首先到Tomcat官网下载安装包,我下载的是最新版的Tomcat10,具体步骤如下:

安装下图操作:

image-20250826145512750
image-20250826145707738
image-20250826145740444
image-20250826145836904
image-20250826145917792

打开虚拟机,切换到root用户下,创建Tomcat用户,命令如下:

useradd tomcat 

设置密码:

passwd tomcat 
image-20250826154329831

切换到Tomcat用户,能切换过去,代表成功创建该用户了。

su - tomcat 
image-20250826154402067

把 apache-tomcat-10.1.9.tar.gz上传到/home/tomcat/目录下。

image-20250826154451234
image-20250826154515289

上传成功。

image-20250826154532464

解压。

tar-zxvf apache-tomcat-10.1.9.tar.gz 
image-20250826154644951

给解压后的Tomcat,重命名一下:

mv apache-tomcat-10.1.9 tomcat 
image-20250826154916980

启动:

cd tomcat/ bin/startup.sh 
image-20250826160452317

启动成功!

image-20250826160928137

关闭tomcat命令

bin/shutdown.sh 

这样我们就在CentOS7上安装完Tomcat啦!

3.简单玩一下Tomcat

在这里,我们可以看到,都是千篇一律的页面,那么我们可不可以把tomcat页面变成自己的页面呢?

答案是:当然可以!

我们只需要找到它的前端代码,简单修改就可以啦!

cd /home/tomcat/tomcat/webapps/ROOT 
image-20250826162535805

想要改文字、格式就修改index.jsp。

image-20250826162834562

想要改样式就选择tomcat.css。

image-20250826162914763

我这里示例一下改主页文字。

vi index.jsp 

在Home前加上”小单的“几个字:

image-20250826163936195

回到bin目录,重启一下:

image-20250826164053514

重启后,更改成功啦!

image-20250826164504219

那么我有一个问题,倘若你同事下班想使用一下你的Tomcat,该怎么办呢?

别急,cpolar来帮助你,解决这一烦恼。

4.安装cpolar实现随时随地开发

cpolar 可以将你本地电脑中的服务(如 SSH、Web、数据库)映射到公网。即使你在家里或外出时,也可以通过公网地址连接回本地运行的开发环境。

❤️以下是安装cpolar步骤:

使用一键脚本安装命令:

sudocurl https://get.cpolar.sh |sh
image-20250826172453496

安装完成后,执行下方命令查看cpolar服务状态:(如图所示即为正常启动)

sudo systemctl status cpolar 
image-20250826172604013

Cpolar安装和成功启动服务后,在浏览器上输入虚拟机主机IP加9200端口即:【http://192.168.42.101:9200】访问Cpolar管理界面,使用Cpolar官网注册的账号登录,登录后即可看到cpolar web 配置界面,接下来在web 界面配置即可:

打开浏览器访问本地9200端口,使用cpolar账户密码登录即可,登录后即可对隧道进行管理。

image-20250826172625263

5.配置公网地址

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

  • 隧道名称:可自定义,本例使用了:tomcat,注意不要与已有的隧道名称重复
  • 协议:http
  • 本地地址:8080
  • 域名类型:随机域名
  • 地区:选择China Top点击创建:
image-20250826175205560

创建成功后,打开左侧在线隧道列表,可以看到刚刚通过创建隧道生成了公网地址,接下来就可以在其他电脑或者移动端设备(异地)上,使用地址访问。

image-20250826175248080

访问成功。

image-20250826175317499

6.保留固定公网地址

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

image-20250827103024446

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

image-20250827103127242

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

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

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

点击更新

image-20250827103351334

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

image-20250827103433119

最后,我们使用固定的公网地址在任意设备的浏览器中访问,可以看到成功访问本地部署的tomcat页面,这样一个永久不会变化的二级子域名公网网址即设置好了。

image-20250827103556724

恭喜!你成功了! 现在,无论你身在何处,用手机、平板还是另一台电脑,都能看到并操作你本地运行的tomcat了!

总结

其实本地 Web 应用的公网访问需求,本质上是为了打破网络边界,让开发、测试与演示的流程更顺畅。Tomcat 作为成熟的 Java 应用服务器,搭配内网穿透工具的灵活映射能力,恰好满足了这种轻量、高效的使用场景。

无需专业的网络知识,也不用额外的硬件投入,就能让本地项目拥有公网访问能力,无论是个人开发调试,还是小团队的协作分享,都能大幅提升效率。这种低成本、易上手的解决方案,也正是日常开发中最贴合实际需求的选择,让技术落地更简单。

Read more

前端防范 XSS(跨站脚本攻击)

目录 一、防范措施 1.layui util  核心转义的特殊字符 示例 2.js-xss.js库 安装 1. Node.js 环境(npm/yarn) 2. 浏览器环境 核心 API 基础使用 1. 基础过滤(默认规则) 2. 自定义过滤规则 (1)允许特定标签 (2)允许特定属性 (3)自定义标签处理 (4)自定义属性处理 (5)转义特定字符 常见场景示例 1. 过滤用户输入的评论内容 2. 允许特定富文本标签(如富文本编辑器内容) 注意事项 更多配置 XSS(跨站脚本攻击)是一种常见的网络攻击手段,它允许攻击者将恶意脚本注入到其他用户的浏览器中。

详细教程:如何从前端查看调用接口、传参及返回结果(附带图片案例)

详细教程:如何从前端查看调用接口、传参及返回结果(附带图片案例)

目录 1. 打开浏览器开发者工具 2. 使用 Network 面板 3. 查看具体的API请求 a. Headers b. Payload c. Response d. Preview e. Timing 4. 实际操作步骤 5. 常见问题及解决方法 a. 无法看到API请求 b. 请求失败 c. 跨域问题(CORS) 作为一名后端工程师,理解前端如何调用接口、传递参数以及接收返回值是非常重要的。下面将详细介绍如何通过浏览器开发者工具(F12)查看和分析这些信息,并附带图片案例帮助你更好地理解。 1. 打开浏览器开发者工具 按下 F12 或右键点击页面选择“检查”可以打开浏览器的开发者工具。常用的浏览器如Chrome、Firefox等都内置了开发者工具。下面是我选择我的一篇文章,打开开发者工具进行演示。 2. 使用

Cursor+Codex隐藏技巧:用截图秒修前端Bug的保姆级教程(React/Chakra UI案例)

Cursor+Codex隐藏技巧:用截图秒修前端Bug的保姆级教程(React/Chakra UI案例) 前端开发中最令人头疼的莫过于那些难以定位的UI问题——元素错位、样式冲突、响应式失效...传统调试方式往往需要反复修改代码、刷新页面、检查元素。现在,通过Cursor编辑器集成的Codex功能,你可以直接用截图交互快速定位和修复这些问题。本文将带你从零开始,掌握这套革命性的调试工作流。 1. 环境准备与基础配置 在开始之前,确保你已经具备以下环境: * Cursor编辑器最新版(v2.5+) * Node.js 18.x及以上版本 * React 18项目(本文以Chakra UI 2.x为例) 首先在Cursor中安装Codex插件: 1. 点击左侧扩展图标 2. 搜索"Codex"并安装 3. 登录你的OpenAI账户(需要ChatGPT Plus订阅) 关键配置项: // 在项目根目录创建.