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/138861.html

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

相关文章

Ubuntu环境下为串口设置别名

本文介绍Ubuntu环境下为串口设置别名。 Ubuntu环境下,有时候开发调试会使用到USB转串口,本文介绍在不同使用场景下为串口设置别名的方法。主要分为绑定设备ID和绑定USB端口号。 1.绑定设备ID 绑定设备ID适用于USB转串口的设备ID唯一的情况&#xff0c…

Vatee万腾科技决策力的引领创新:Vatee数字化视野的崭新天地

在数字时代的激烈竞争中,Vatee万腾以其科技决策力的引领,开创了数字化视野的崭新天地。这并不仅仅是一场技术的飞跃,更是一次对未来的深刻洞察和引领创新的勇敢实践。 Vatee万腾的科技决策力不仅仅停留在数据分析和算法的运用,更是…

RK3568驱动指南|第七期-设备树-第65章 设备树下platform_device和platform_driver匹配实验

瑞芯微RK3568芯片是一款定位中高端的通用型SOC,采用22nm制程工艺,搭载一颗四核Cortex-A55处理器和Mali G52 2EE 图形处理器。RK3568 支持4K 解码和 1080P 编码,支持SATA/PCIE/USB3.0 外围接口。RK3568内置独立NPU,可用于轻量级人工…

【Seata源码学习 】 扫描@GlobalTransaction注解 篇一

1. SeataAutoConfiguration 自动配置类的加载 基于SpringBoot的starter机制,在应用上下文启动时,会加载SeataAutoConfiguration自动配置类 # Auto Configure org.springframework.boot.autoconfigure.EnableAutoConfigurationio.seata.spring.boot.aut…

概率论和数理统计(三)数理统计基本概念

前言 “概率论”是给定一个随机变量X的分布F(x),然后求某事件A概率 P ( x ∈ A ) P(x \in A) P(x∈A)或者随机变量X的数字特征.“统计”是已知一组样本数据 { x 1 , x 2 , . . . x n } \{x_1,x_2,...x_n\} {x1​,x2​,...xn​},去求分布F(x) 统计的基本概念 在统计中&#x…

Wpf 使用 Prism 实战开发Day05

首页设计 1.效果图 一.代码现实 根据页面布局,可以将页面设计成3行,每行中分多少列,看需求而定根据页面内容,设计Model 实体类,以及View Model 1.Index.xaml 页面布局设计 RowDefinition 分行(Row&#xf…

11月13日星期一今日早报简报微语报早读

11月13日星期一,农历十月初一,早报微语早读。 1、国家邮政局:“双11”当天全国快递业务量达6.39亿件; 2、公安机关通缉4名缅北电诈头目,其中一人为缅甸掸邦议会原议员; 3、多部门提醒:未满10…

响应式摄影科技传媒网站模板源码带后台

模板信息: 模板编号:540 模板编码:UTF8 模板颜色:黑白 模板分类:摄像、婚庆、家政、保洁 适合行业: 模板介绍: 本模板自带eyoucms内核,无需再下载eyou系统,原创设计、手…

面试被问答3-5年职业规划,该怎么回答

面试官问这些问题的目的是什么?他想得到什么满意的答案。只要清楚这些,就不难回答这个问题。 1、你有没有上进心?公司是否值得培养呢? 你需要对专业能力充满向往,希望自己在3~5年内,把专业能力做好&#…

Python---元组的相关操作方法

由于元组中的数据不允许直接修改,所以其操作方法大部分为查询方法。 编号函数作用1元组[索引]根据索引下标查找元素2index()查找某个数据,如果数据存在返回对应的下标,否则报错,语法和列表、字符串的index方法相同3count()统计某…

JAVA基础:子父类关系里的实例创建流程

实验类: 📎A.javahttps://www.yuque.com/attachments/yuque/0/2023/java/21609500/1699858993581-1df32da6-8360-4a98-aa1b-d9a59d3b2d76.java 📎B.javahttps://www.yuque.com/attachments/yuque/0/2023/java/21609500/1699858998289-d9e31…

得帆低代码OMS助力SAP和Oracle ERP订单模块全线升级,感受非凡体验

场景背景 随着数字化转型进入深水区,智能化、移动化、可视化的需求越来越强烈,而传统的Oracle、SAP销售模块很难快速满足销售端的上述需求,逐渐面临如下痛难点: IT服务商响应不足:企业越来越多信息化的业务需要大量的供…

使用Tipas结合内网穿透在Ubuntu上搭建高效问题解答平台网站

文章目录 前言2.Tipask网站搭建2.1 Tipask网站下载和安装2.2 Tipask网页测试2.3 cpolar的安装和注册 3. 本地网页发布3.1 Cpolar临时数据隧道3.2 Cpolar稳定隧道(云端设置)3.3 Cpolar稳定隧道(本地设置) 4. 公网访问测试5. 结语 前…

thinkphp8 数据库的连接

账号:root 密码:自己设置 http://localhost:888/index.php当出现这个并且能登陆就算成功了。 回到项目config/database.php .env 里面(如果已经.example.env 改成了.env,则改下边,db_name改成你的数据库表名) 多个…

Find My冲浪板|苹果Find My技术与冲浪板结合,智能防丢,全球定位

冲浪板就是冲浪运动中必不可少的器材之一。冲浪板是一块能够承受波浪抛掷的器材,通常由泡沫材质制成,也有一些采用其他材质制成的高档板。冲浪板不仅能够帮助人们在波浪中快速滑行,还能提供重心支撑和掌控波浪的稳定性。电动冲浪板是一种新型…

如何加密RAR压缩文件?

如何使用WinRAR加密压缩包?详细介绍WinRAR中的三种加密方法给大家。 方法一:加密 最简单的加密方法,就是在加密文件时输入想要设置的密码,完成加密和压缩了。 方法二:自动加密 普通的加密方式,需要我们加…

如何向MapInfo Pro添加自定义符号?

用户可以在MapInfo Pro中创建和使用自己的自定义图像作为符号。要访问这些自定义符号,请将它们放在CUSTSYMB目录中,然后从“符号样式”对话框(Style>符号样式)的“字体”列表中的“自定义符号”选项中选择它们。MapInfo Pro中的…

IDEA软件使用步骤

1.IDEA概述 IDEA全称InelliJ IDEA,是用于java语言开发的集成环境,它是业界公认的目前用于Java程序开发最好的工具。 集成环境:把代码编写,编译,执行,调试扽过多种功能综合到一起的开发工具。 下载:https…

vue3 input 上传文件

1.axios封装 http.postFormData function(vm, url, params) {return new Promise((resolve) > {axios.post(url, params, {headers: {Content-Type: multipart/form-data,Authorization: store.state.token},timeout: config.httpTimeOut}).then(res > {custResponseFu…

微服务概念

微服务 微服务是什么 In short, the microservice architectural style [1] is an approach to developing a single application as a suite of small services, each running in its own process and communicating with lightweight mechanisms, often an HTTP resource A…