如何在OpenWRT安装内网穿透工具实现远程访问本地搭建的web网站界面

文章目录

  • 前言
    • 1. 检查uhttpd安装
    • 2. 部署web站点
    • 3. 安装cpolar内网穿透
    • 4. 配置远程访问地址
    • 5. 配置固定远程地址

前言

uhttpd 是 OpenWrt/LuCI 开发者从零开始编写的 Web 服务器,目的是成为优秀稳定的、适合嵌入式设备的轻量级任务的 HTTP 服务器,并且和 OpenWrt 配置框架非常好地集成在一起。它是管理 OpenWrt 的默认的 Web 服务器,还提供了现代 Web 服务器所有的 功能 。

下面我们将在openwrt上部署uhttpd搭建web服务器,同时使用cpolar将其安全暴露到公网上,让公网用户也可以正常访问到openwrt下的web服务器。

1. 检查uhttpd安装

正常版本下,如果可以在浏览器访问openWRT web控制台界面,表示已经安装了uhttpd,同样,我们可以在根目录下面看到一个名称为www的目录,这样表示已经安装了uhttpd.

image-20230523130756649

2. 部署web站点

既然uhttpd已经安装好了,我们就可以直接使用,我们只需要把我们的站点拷贝进去www文件夹下面即可。接下来主要介绍html网站部署,使用一个免费站点进行演示

进入www文件夹

cd /www

使用wget下载站点,ftp上传文件也可以

wget https://www.cpolar.com/static/downloads/meditation-app-master.tar.gz

下载好后解压

tar xzf meditation-app-master.tar.gz

解压后我们可以看到一个名称为meditation-app-master的文件夹,这里还可以看到一个名称为cgi-bin的文件夹,这个就是openWRT web 控制台界面位置.

image-20230523131916555

此时我们在外部浏览器使用openWRT局域网ip地址加资源路径/meditation-app-master/index.html即可看到我们下载部署的站点。如果不加资源路径,默认会跳转过去openWRT web 界面,此时我们一个静态站点就已经配置好了。

下面我们安装cpolar内网穿透来实现在公网环境下也可以远程访问这个web站点。

image-20230523132258910

3. 安装cpolar内网穿透

通过ssh连接操作openwrt, 下载公钥:

wget -O cpolar-public.key http://openwrt.cpolar.com/releases/public.key

下载完成后添加公钥

opkg-key add cpolar-public.key

添加cpolar的opkg仓库源

echo "src/gz cpolar_packages http://openwrt.cpolar.com/releases/packages/$(. /etc/openwrt_release ; echo $DISTRIB_ARCH)"  >>  /etc/opkg/customfeeds.conf

更新仓库

opkg update

然后开始安装cpolar,分别执行下面三个安装命令安装三个包:

opkg install cpolar
opkg install luci-app-cpolar
opkg install luci-i18n-cpolar-zh-cn

安装完成后,打开openwrt Web管理界⾯,我们可以看到有个service,点击后,即可看到我们cpolar内网穿透

image-20230426172304148

点击进去后即可看到cpolar界面,接下来配置cpolar Authtoken

登录cpolar官网,如果没有注册账号,可以先注册账号,然后点击左侧的验证,查看自己的认证token,

cpolar官网:https://www.cpolar.com

20230111103532

之后将官网查看的token复制到openwrt cpolar服务界面的Auth Token里,设置后点击save保存

image-20230426174954224

保存成功后点击界面里的 打开Web-UI界面 ,即可看到cpolar web ui 界面

使用我们官网注册的账号登陆,登陆后即可对隧道进行管理,安装就完成啦

4. 配置远程访问地址

在cpolar web ui管理界面中,我们点击左侧仪表盘的隧道管理——创建隧道,uhttpd由于部署在了openWRT Web管理界面,设置了SSL,所以端口使用443,因此我们要来创建一条http隧道,指向443端口

  • 隧道名称:可自定义,注意不要重复
  • 协议:http
  • 本地地址:443
  • 域名类型:选择随机域名
  • 地区:选择China VIP

点击创建

image-20230523140759808

创建成功后打开在线隧道列表,可以看到公网访问的地址,有两种公网地址访问方式,一种是http,一种是https

image-20230523140850963

然后我们使用其中一种http方式公网地址,并且加上资源路径:/meditation-app-master/index.html在浏览器访问,即可看到我们的站点界面,这样这个远程访问就配置好了.

image-20230523141202524

5. 配置固定远程地址

前面我们创建隧道时使用的是免费随机临时地址,它所生成的公网地址会在24小时内变化,为了方便长久稳定连接,我们可以固定访问地址,在cpolar中叫固定二级子域名,或者您也可以配置使用您自己的域名来访问。这里我们以cpolar子域名为例

需升级至基础套餐或以上才支持配置二级子域名

登录cpolar官网后台,点击左侧仪表盘的预留,找到保留二级子域名,为http隧道保留一个二级子域名。

  • 地区:选择服务器地区
  • 名称:填写您想要保留的二级子域名(可自定义)
  • 描述:即备注,可自定义填写

image-20230523142316564

本例保留一个名称为websitewrt的二级子域名。子域名保留成功后,我们将子域名复制下来,接下来需要将其配置到隧道中去。

image-20230523142403980

打开cpolar web ui管理界面。点击左侧仪表盘的隧道管理——隧道列表,找到需要配置二级子域名的隧道,点击右侧的编辑

修改隧道信息,将二级子域名配置到隧道中:

  • 域名类型:改为选择二级子域名
  • *Sub Domain:填写我们刚刚所保留的二级子域名

修改完成后,点击更新

image-20230523142620625

隧道更新成功后,点击左侧仪表盘的状态——在线隧道列表,可以看到隧道的公网地址,已经更新为二级子域名了.

然后我们使用其中一种http方式地址在浏览器访问,即可看到我们的站点界面,这样一个固定不变的远程访问个人站点配置好了

image-20230523144012999

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/402012.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2024 全国水科技大会暨第二届智慧水环境管理与技术创新论坛

论坛二:第二届智慧水环境管理与技术创新论坛 召集人:刘炳义 武汉大学智慧水业研究所所长、教授 为贯彻落实中共中央国务院印发《数字中国建设整体布局规划》和国务院关于印发《“十四五”数字经济发展规划》的通知,推动生态环境智慧治理&…

stm32和嵌入式linux可以同步学习吗?

在开始前我有一些资料,是我根据网友给的问题精心整理了一份「stm3的资料从专业入门到高级教程」, 点个关注在评论区回复“888”之后私信回复“888”,全部无偿共享给大家!!!如果需要使用STM32,建…

源码剖析Spring依赖注入:今天你还不会,你就输了

在之前的讲解中,我乐意将源码拿出来并粘贴在文章中,让大家看一下。然而,我最近意识到这样做不仅会占用很多篇幅,而且实际作用很小,因为大部分人不会花太多时间去阅读源码。 因此,从今天开始,我将…

【Vue3】toRefs和toRef在reactive中的一些应用

💗💗💗欢迎来到我的博客,你将找到有关如何使用技术解决问题的文章,也会找到某个技术的学习路线。无论你是何种职业,我都希望我的博客对你有所帮助。最后不要忘记订阅我的博客以获取最新文章,也欢…

sql server想要小数点后向下取整怎么搞

select FORMAT(3.169, N2) as 四舍五入1, CAST(3.169 AS decimal(9,2)) as 四舍五入2, ROUND(3.169, 2) as 四舍五入3, CAST(FLOOR(3.169 * 100) / 100 AS decimal(9,2)) as 向下取整1, FLOOR(3.169 * 100) / 100 as 向下取整2, ceiling(3.169 * 100) / 100 as 向上取整—…

如何使用 GitHub Action 在 Android 中构建 CI-CD

如何使用 GitHub Action 在 Android 中构建 CI-CD 一、什么是 CI/CD?二、什么是 CI:持续集成?三、什么是CD:持续部署?3.1 持续交付3.2 持续部署 四、使用 GitHub 操作在 Android 中构建 CI-CD 管道4.1 步骤 五、什么是…

K210基础实验——点亮LED灯

一、目的是点亮K210开发板左下角的LED0和LED1,LED0是红灯,LED1是绿灯,两颗LED灯都是低电平点亮,高电平熄灭。 二、这是原理图上的硬件连接,LED0连接的是IO0,LED1连接的是IO17。 三、在src目录下新建文件夹 …

P2670 [NOIP2015 普及组] 扫雷游戏 ---- 洛谷

题目描述 扫雷游戏是一款十分经典的单机小游戏。在 n 行 m 列的雷区中有一些格子含有地雷(称之为地雷格),其他格子不含地雷(称之为非地雷格)。玩家翻开一个非地雷格时,该格将会出现一个数字——提示周围格子…

《游戏引擎架构》--学习3

内存管理 优化动态内存分配 维持最低限度的堆分配,并且永不在紧凑循环中使用堆分配 容器 迭代器 Unicode

uni-app搭建h5项目

一、 打开官方网站 https://uniapp.dcloud.net.cn/quickstart-cli.html 二、找到使用vue-cli命令行,按照文档上的步骤进行搭建 全局安装 vue-cli npm install -g vue/cli搭建项目 可以根据命令行搭建,搭建vue2.0对应的是webpack, 也可以搭…

vulnhub靶场---->DOUBLETROUBLE: 1

详细思路 知识点1.网段探测2.nmap扫描3.目录扫描4.隐写5.上传木马文件6.awk提权 知识点 图片隐写----->steghide 密码爆破----->stegseek awk提权------>sudo awk BEGIN {system("/bin/bash")}1.网段探测 kali:192.168.0.131 靶机:192.168.0.1…

微信小程序-消息订阅整体流程

1.首先登录微信公众平台,网址:微信公众平台 2.找到“订阅消息”,如果订阅消息没开启,可以点击开启,然后根据自己的消息需求到公共模版里找合适的,然后点击选用,如果没有比较合适的可以申请模版…

【开源】SpringBoot框架开发音乐平台

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块三、系统展示 四、核心代码4.1 查询单首音乐4.2 新增音乐4.3 新增音乐订单4.4 查询音乐订单4.5 新增音乐收藏 五、免责说明 一、摘要 1.1 项目介绍 基于微信小程序JAVAVueSpringBootMySQL的音乐平台,包含了音乐…

使用maven集成spring在测试的时候报出了如下的异常:version 60

使用maven集成spring在测试的时候报出了如下的异常: Caused by: java.lang.IllegalArgumentException: Unsupported class file major version 60 解决:

MySQL学习笔记3: MySQL数据库基础

目录 前言目标数据库操作(针对database 的操作)1. 创建数据库 create database 数据库名;2. 查看数据库 show databases;3. 选中数据库 use 数据库名;4. 删除数据库 drop database 数据库名; mysql中支持的数据类型1. 数值类型: NUMERIC(M,D)2. 字符串类…

LeetCode | 两数相加 C语言

Problem: 2. 两数相加 文章目录 思路解题方法Code一些感想 思路 主要是一一相加和逆序的方式存储 先说逆序储存,看下图 我们先声明出指针p和指针q,还有指针head(主要用于return上而已),然后进行一系列操作&#xff0c…

【Spring Cloud】实现微服务调用的负载均衡

文章目录 什么是负载均衡自定义实现负载均衡启动shop-product微服务通过nacos查看微服务的启动情况自定义实现负载均衡 基于Ribbon实现负载均衡添加注解修改服务调用的方法Ribbon支持的负载均衡策略通过修改配置来调整 Ribbon 的负载均衡策略通过注入Bean来调整 Ribbon 的负载均…

【Vue】本地使用 axios 调用第三方接口并处理跨域

前端处理跨域 一. 开发准备 开发工具:VScode框架:Vue2项目结构:vue脚手架生成的标准项目(以下仅显示主要部分) 本地已搭建好的端口:8080要请求的第三方接口:http://1.11.1.111:端口号/xxx-api…

3.1 XPath的使用

目录 3.1.1 XPath的作用 3.1.2 XPath使用前提 3.1.3 XPath的使用 &#xff08;1&#xff09;属性匹配和获取一个属性值节点的内容 &#xff08;2&#xff09;属性多值匹配 &#xff08;3&#xff09;获取<>中的内容 &#xff08;4&#xff09;多属性匹配 &#…

通知:全面停工停产6个月,员工解雇工

随着新能源汽车兴起&#xff0c;汽车行业涌现出许多造车新势力&#xff0c;包括蔚来、理想、小鹏、哪吒、零跑等。然而&#xff0c;近日&#xff0c;高合汽车陷入了困境&#xff0c;宣布全面停工停产&#xff0c;员工被解雇&#xff0c;新车降价清仓。 据百能云芯电子元器件商城…