OpenWRT builds a personal web site and combines intranet penetration to achieve remote access to the public network

Article directory

  • Preface
    • 1. Check uhttpd installation
    • 2. Deploy the web site
    • 3. Install cpolar intranet penetration
    • 4. Configure remote access address
    • 5. Configure fixed remote address

Foreword

uhttpd is a web server written from scratch by OpenWrt/LuCI developers. It aims to become an excellent, stable, lightweight task HTTP server suitable for embedded devices, and is very well integrated with the OpenWrt configuration framework. It is the default web server that manages OpenWrt and provides all the functionality of a modern web server.

Next, we will deploy uhttpd on openwrt to build a web server, and use cpolar to safely expose it to the public network, so that public network users can also normally access the web server under openwrt.

1. Check uhttpd installation

Under the normal version, if you can access the openWRT web console interface in the browser, it means that uhttpd has been installed. Similarly, we can see a directory named www under the root directory, which means that it has been installed. uhttpd.

image-20230523130756649

2. Deploy web site

Now that uhttpd has been installed, we can use it directly. We only need to copy our site into the www folder. Next, we will mainly introduce HTML website deployment and use a free site for demonstration.

Go to the www folder

cd /www

Use wget to download the site, and ftp to upload files.

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

After downloading, unzip it

tar xzf meditation-app-master.tar.gz

After decompression, we can see a folder named meditation-app-master. Here we can also see a folder named cgi-bin. This is openWRT. The location of the web console interface.

image-20230523131916555

At this time, we use the openWRT LAN IP address and the resource path /meditation-app-master/index.html in the external browser to see the site we downloaded and deployed. If you do not add a resource path, it will jump to the openWRT web interface by default. At this time, our static site has been configured.

Next, we install cpolar intranet penetration to enable remote access to this web site in a public network environment.

image-20230523132258910

3. Install cpolar intranet penetration

Operate openwrt through ssh connection and download the public key:

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

Add the public key after the download is complete

opkg-key add cpolar-public.key

Add cpolar’s opkg warehouse source

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

Update repository

opkg update

Then start installing cpolar and execute the following three installation commands to install the three packages:

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

After the installation is completed, open the openwrt Web management interface? We can see that there is a service. After clicking it, we can see our cpolar intranet penetration

image-20230426172304148

After clicking in, you can see the cpolar interface. Next, configure the cpolar Authtoken.

Log in to the cpolar official website. If you have not registered an account, you can register an account first, and then click Verify on the left to view your authentication token.

cpolar official website: https://www.cpolar.com

20230111103532

Then copy the token viewed on the official website to the Auth Token in the openwrt cpolar service interface, and click save after setting.

image-20230426174954224

After successfully saving, click Open Web-UI interface in the interface to see the cpolar web ui interface.

Use the account registered on our official website to log in. After logging in, you can manage the tunnel and the installation is complete.

4. Configure remote access address

In the cpolar web ui management interface, we click Tunnel Management on the left dashboard – Create Tunnel. Since uhttpd is deployed in the openWRT Web management interface, SSL is set up. So port 443 is used, so we need to create an http tunnel pointing to port 443:

  • Tunnel name: Customizable, be careful not to repeat it
  • Protocol: http
  • Local address: 443
  • Domain name type: Choose a random domain name
  • Region: Select China VIP

Click Create

image-20230523140759808

After the creation is successful, open the online tunnel list and you can see the address for public network access. There are two public network address access methods, one is http and the other is https.

image-20230523140850963

Then we use one of the http methods public network address, and add the resource path: /meditation-app-master/index.html and access it in the browser, you can see our site interface, so This remote access is now configured.

image-20230523141202524

5. Configure fixed remote address

When we created the tunnel earlier, we used a free random temporary address. The public network address it generates will change within 24 hours. In order to facilitate long-term and stable connections, we can fix the access address, which is called a fixed second-level subdomain name in cpolar, or You can also configure access using your own domain name. Here we take the cpolar subdomain name as an example

You need to upgrade to the basic package or above to support the configuration of second-level subdomain names.

Log in to the cpolar official website backend, click Reserve on the left dashboard, find Reserve second-level subdomain name, and reserve a second-level subdomain name for the http tunnel.

  • Region: Select server region
  • Name: Fill in the second-level subdomain name you want to reserve (can be customized)
  • Description: Notes, which can be customized

image-20230523142316564

This example reserves a second-level subdomain named websitewrt. After the subdomain name is successfully reserved, we copy the subdomain name and then configure it into the tunnel.

image-20230523142403980

Open the cpolar web ui management interface. Click Tunnel Management on the left dashboard – Tunnel List, find the tunnel that needs to be configured with a second-level subdomain name, and click Edit on the right

Modify the tunnel information and configure the second-level subdomain name into the tunnel:

  • Domain name type: select Second-level subdomain name instead
  • *Sub Domain: Fill in the second-level subdomain name we just reserved

After the modification is completed, click Update

image-20230523142620625

After the tunnel is successfully updated, click StatusOnline Tunnel List on the left dashboard. You can see that the public network address of the tunnel has been updated to a second-level subdomain name.

Then we use one of the http methods to access it in the browser, and we can see our site interface. Such a fixed remote access personal site is configured.

image-20230523144012999