首页 > 其他分享 >通过 tomcat 让手机访问到电脑写的 html 网页

通过 tomcat 让手机访问到电脑写的 html 网页

时间:2024-07-12 18:29:19浏览次数:13  
标签:8080 tomcat 访问 html 网页 运行

之前实现的 html 小项目只能在自己的电脑上展示,如果要在其他电脑或者在手机上就看不到网页了

想要在手机上访问自己写的网页,我们可以借助 tomcat

首先我们可以从官网下载 tomcat

官网链接:apache官网

我们拉到最底部,找到 apache 公司下的 tomcat 下载 zip 版本即可(只有十几MB,解压后直接用文件夹)

cdf6e21ddc224fbdbc182e0dc222c055.png

要运行 tomcat ,我们必须要确保我们的环境变量中有 jdk

jdk17 和 tomcat10 是适配的,我用的这两个

我们需要在在环境变量中配置 JAVA_HOME 和 CATALINA_HOME 两个变量,分别装入 jdk 和 tomcat 的路径

3a091615d40f41c8ba3d3ed1d9556da9.png

然后在 path 中引用这两个路径(如图中 line_1 和 line_4)

a7833769a2b64f47a6d944b4ae899543.png

然后我们可以打开命令行,运行 tomcat 了

只需命令行输入 startup 即可运行 tomcat

4f0c19583ba043ea851d7de7ce171141.png

若在输入 startup 后弹出 tomcat 弹窗即表示运行成功

我们可以通过浏览器输入 localhost:8080 访问本机运行的 tomcat

612758847ba541d8a492a8c394c733be.png

连接成功后,我们就可以添加网页代码到 tomcat 中了

我们将之前写好的项目导入到 tomcat 的 webapps 目录下

55e908c8b0b1461ead217f0f5f459e3d.png

20d174ab1c5046779ae8ada62f0fcb2b.png

f939e2d99d244e72a8cc5d5f6f065de8.png

导入完之后就可以通过 tomcat 运行 main.html 程序了

在浏览器输入 localhost:8080/ikun/main.html 可以通过本机访问该网页是否能正常运行

确认能正常运行后,我们便可以尝试在其他设备访问了

通过 tomcat运行的文件,只要处于同一个局域网下,就可以被访问,不过我们需要将防火墙对 8080 这个端口设置允许外部访问,或直接把防火墙先暂时关闭

我们可以通过连好wifi后在命令行输入 ipconfig 指令查找到本计算机在该局域网下的IP地址

然后我们在另外一台连接相同局域网的手机中输入

 自己的地址:8080/ikun/main.html 

便可通过局域网访问到你写的网站啦!

c60f2f4fc7cd47aab81f45a02a138a4d.jpeg

 

标签:8080,tomcat,访问,html,网页,运行
From: https://blog.csdn.net/m0_75138009/article/details/140309820

相关文章

  • 解决Tomcat 8.5在浏览器输入localhost:8080出现404报错的全面指南
    当你在浏览器中输入http://localhost:8080时,期望看到部署在ApacheTomcat8.5上的应用,但却遭遇404错误,这无疑是一件令人沮丧的事情。404错误通常表示服务器无法找到你请求的资源。本文将详细探讨导致此问题的各种原因以及相应的解决策略,帮助你排除故障,让应用正常运行。1.确认......
  • 在网页中实现截屏粘贴的功能
    <!DOCTYPEHTML><htmllang="en-US"><head><metacharset="UTF-8"><title>利用clipboardData在网页中实现截屏粘贴的功能</title><styletype="text/css">#box{width:200px;height:200px;border:1pxsol......
  • 网站源码软件下载pbootcms模板网页设计主题
    软件下载的网站设计分享我很高兴向大家介绍我刚刚制作的软件下载的网站设计。友好的站点界面,是打动访客的第一步。软件下载网站主题网站设计主要关注于提供用户一个便捷、安全、丰富的软件资源下载平台。以下是关于软件下载网站主题网站设计的详细介绍:1.首页设计布局清晰:......
  • 网站源码新能源pbootcms模板网页设计主题
    新能源的网站设计分享我很高兴向大家介绍我刚刚制作的新能源的网站设计。友好的站点界面,是打动访客的第一步。新能源网站主题设计是一个融合了创新、环保和科技元素的独特过程。以下是对新能源网站主题设计的详细介绍:一、设计理念新能源网站主题设计旨在传达公司或组织在新......
  • 网站源码装修设计pbootcms模板网页设计主题
    装修设计的网站设计分享我很高兴向大家介绍我刚刚制作的装修设计的网站设计。友好的站点界面,是打动访客的第一步。装修设计网站的主题网站设计需要注重用户体验、创意展示以及专业度,以便吸引潜在客户并展示公司的设计实力和服务质量。以下是对装修设计网站主题设计的详细介绍......
  • html+js实现选中左边的数据到右边
    效果后台要开发个功能,给游戏内的用户赠送道具,先把道具列表展示,然后选择要增送的道具,可以加上道具图片之类的,美化index.html页面没有美化,只是实现了效果。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device......
  • 370. 高端个人相册网站 大学生期末大作业 Web前端网页制作 html5+css+js
    目录一、网页概述二、网页文件 三、网页效果四、代码展示1.html2.CSS3.JS五、总结1.简洁实用2.使用方便3.整体性好4.形象突出5.交互式强六、更多推荐欢迎光临仙女的网页世界!这里有Web前端网页制作的各行各业的案例,样式齐全新颖,并持续更新!感谢CSDN,提供了这......
  • 对于多个表多个字段进行查询、F12查看网页的返回数据帮助开发、数据库的各种查询方式(
    对于多个表多个字段进行查询、F12查看网页的返回数据帮助开发、数据库的各种查询方式(多对多、多表查询、子查询等)。一、前端界面需要展现多个表的其中几个数据的多表查询。1.三个表查询其中字段返回:(用一下sql语句,带条件的)2.进行封装实体类,返回前端3.如果前端需要在一......
  • HTML5+CSS3小实例:响应式漫画网格布局
    实例:响应式漫画网格布局技术栈:HTML+CSS效果:源码:【HTML】<!DOCTYPEhtml><htmllang="zh-CN"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0">......
  • 【python生成用例报告】unittest、HTMLTestReport、参数化demo
    使用第三方的报告模版,生成报告HTMLTestReport,本质是TestRunner-安装pipinstallHTMLTestReport-使用1.导包unittest、HTMLTestReport2.组装用例(套件,loader)3.使用HTMLTestReport中的runner执行套件4.查看报告目录结构:app.py:importosBase......