当前位置: 首页 > news >正文

如何在OpenWRT部署uhttpd搭建服务器实现远程访问本地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

相关文章:

  • 超维空间M1无人机使用说明书——41、ROS无人机使用yolo进行物体识别
  • 【JAVA基础】JVM之类加载--双亲委派机制
  • C语言——结构体类型(二)【结构体内存对齐,结构体数组】
  • 美客多本土店与跨境店有何区别?本土店如何入驻运营?
  • IPv6邻居发现协议(NDP)---路由发现
  • Web缓存代理
  • 【算法】七夕祭
  • What does `$?` do?
  • C# 语法进阶 委托
  • 基于web的电影院购票系统
  • [C#]winform利用seetaface6实现C#人脸检测活体检测口罩检测年龄预测性别判断眼睛状态检测
  • vue项目使用typescript创建抽象类及其使用
  • 全链路压力测试有哪些主要作用
  • 虽然是个去年的旧新闻,但这透露了IBM的新去向
  • docker/华为云cce 部署nacos 2.3.0 集群模式
  • [分享]iOS开发-关于在xcode中引用文件夹右边出现问号的解决办法
  • Angularjs之国际化
  • Consul Config 使用Git做版本控制的实现
  • CSS实用技巧干货
  • flask接收请求并推入栈
  • Java超时控制的实现
  • JS变量作用域
  • MySQL常见的两种存储引擎:MyISAM与InnoDB的爱恨情仇
  • Mysql优化
  • PhantomJS 安装
  • Swoft 源码剖析 - 代码自动更新机制
  • UMLCHINA 首席专家潘加宇鼎力推荐
  • 阿里云购买磁盘后挂载
  • ------- 计算机网络基础
  • 全栈开发——Linux
  • 实现菜单下拉伸展折叠效果demo
  • ​第20课 在Android Native开发中加入新的C++类
  • (C++17) std算法之执行策略 execution
  • (附源码)php投票系统 毕业设计 121500
  • (免费领源码)python#django#mysql校园校园宿舍管理系统84831-计算机毕业设计项目选题推荐
  • (十)【Jmeter】线程(Threads(Users))之jp@gc - Stepping Thread Group (deprecated)
  • (一)Mocha源码阅读: 项目结构及命令行启动
  • (转)Android学习笔记 --- android任务栈和启动模式
  • (转)平衡树
  • (自用)learnOpenGL学习总结-高级OpenGL-抗锯齿
  • .[hudsonL@cock.li].mkp勒索加密数据库完美恢复---惜分飞
  • .net core 6 集成和使用 mongodb
  • .net FrameWork简介,数组,枚举
  • .NET MVC之AOP
  • .net 提取注释生成API文档 帮助文档
  • .net 写了一个支持重试、熔断和超时策略的 HttpClient 实例池
  • .Net 转战 Android 4.4 日常笔记(4)--按钮事件和国际化
  • .net经典笔试题
  • .net中应用SQL缓存(实例使用)
  • [ C++ ] STL---stack与queue
  • [ vulhub漏洞复现篇 ] JBOSS AS 5.x/6.x反序列化远程代码执行漏洞CVE-2017-12149
  • [《百万宝贝》观后]To be or not to be?
  • [20160902]rm -rf的惨案.txt
  • [23] 4K4D: Real-Time 4D View Synthesis at 4K Resolution
  • [Android]Android开发入门之HelloWorld