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

使用宝塔面板在Linux上搭建网站，并通过内网穿透实现公网访问

news 2026/2/10 19:03:11

文章目录

前言
1. 环境安装
2. 安装cpolar内网穿透
3. 内网穿透
4. 固定http地址
5. 配置二级子域名
6. 创建一个测试页面

前言

宝塔面板作为简单好用的服务器运维管理面板，它支持Linux/Windows系统，我们可用它来一键配置LAMP/LNMP环境、网站、数据库、FTP等，通过Web端轻松管理服务器。

以下教程，我们将演示使用宝塔面板快速简单搭建本地web网站，并做内网穿透，实现不在同个局域网下的用户也可以访问到本地web站点，无需公网IP，也不用设置路由器。

1. 环境安装

安装apache服务器,在宝塔面板中我们点击网站,然后会提示安装apache服务器。

选择极速安装

然后等待安装完成即可,安装完成在左边消息列表会提示

2. 安装cpolar内网穿透

https://www.cpolar.com/

打开宝塔终端命令窗口,使用cpolar一件安装脚本:

curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash

token认证

登录cpolar官网,点击左侧的验证，查看自己的认证token，之后将token贴在命令行里

cpolar authtoken xxxxxxx

20230111103532

向系统添加服务

sudo systemctl enable cpolar

启动cpolar服务

sudo systemctl start cpolar

开放9200端口

在宝塔面板中选择安全.然后开放9200端口

登录cpolar web UI 管理界面

然后局域网ip访问9200端口即可出现cpolar管理界面，输入cpolar邮箱账号进行登陆

3. 内网穿透

登录cpolar web UI管理界面后，我们创建一个http隧道，指向80端口,因为apache服务默认是80端口

隧道名称：可自定义，注意不要重复
协议：http
本地地址：80
端口类型：随机域名
地区：China vip

点击创建

创建成功后我们打开在线隧道列表复制创建的公网地址

然后我们打开宝塔面板,点击网站,选择添加站点,把复制的公网地址粘贴到域名的参数框,然后点击提交

这个时候我们可以看到站点创建成功

然后我们再使用复制的公网地址,打开浏览器访问,出现欢迎页表示成功

4. 固定http地址

由于刚刚创建隧道使用的是随机临时地址，该地址会在24小时内发生变化，为了长期远程访问，我们接下来将这个公网地址配置为固定的。

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

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

地区：选择服务器地区
名称：填写您想要保留的二级子域名（可自定义）
描述：即备注，可自定义填写

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

5. 配置二级子域名

登录cpolar web ui管理界面。点击左侧仪表盘的隧道管理——隧道列表，找到需要配置二级子域名的隧道（本例中为apache website隧道），点击右侧的编辑

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

域名类型：改为选择二级子域名
Sub Domain：填写我们刚刚所保留的二级子域名（本例为mywebsitegame）

修改完成后，点击更新

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

然后我们打开宝塔面板,找到站点,点击设置

添加一个我们固定的公网地址域名

然后把之前创建的随机地址删除

然后我们打开浏览器,使用固定的公网地址进行访问,以上我们就配置好了站点远程访问

6. 创建一个测试页面

点击站点根目录路径,直接点击

新建一个名字为game.html页面

然后双击文件编辑,把下面代码复制进去(贪吃蛇小游戏),然后Ctrl+S保存

<!DOCTYPE html>
<html>
<head><title>贪吃蛇</title><meta charset="UTF-8"><meta name="keywords" content="贪吃蛇"><meta name="Description" content="这是一个初学者用来学习的小游戏"><style type="text/css">*{margin:0;}.map{margin:100px auto;height:600px;width:900px;background:#00D0FF;border:10px solid #AFAEB2;border-radius:8px;}</style>
</head><body>
<div class="map">
<canvas id="canvas" height="600" width="900"></canvas>
</div><script type="text/javascript">//获取绘制工具/*var canvas = document.getElementById("canvas");var ctx = canvas.getContext("2d");//获取上下文ctx.moveTo(0,0);ctx.lineTo(450,450);*/var c=document.getElementById("canvas");var ctx=c.getContext("2d");/*ctx.beginPath();ctx.moveTo(0,0);ctx.lineTo(450,450);ctx.stroke();*/var snake =[];//定义一条蛇，画蛇的身体var snakeCount = 6;//初始化蛇的长度var foodx =0;var foody =0;var togo =0;function drawtable()//画地图的函数{for(var i=0;i<60;i++)//画竖线{ctx.strokeStyle="black";ctx.beginPath();ctx.moveTo(15*i,0);ctx.lineTo(15*i,600);ctx.closePath();ctx.stroke();}for(var j=0;j<40;j++)//画横线{ctx.strokeStyle="black";ctx.beginPath();ctx.moveTo(0,15*j);ctx.lineTo(900,15*j);ctx.closePath();ctx.stroke();}for(var k=0;k<snakeCount;k++)//画蛇的身体{ctx.fillStyle="#000";if (k==snakeCount-1){ctx.fillStyle="red";//蛇头的颜色与身体区分开}ctx.fillRect(snake[k].x,snake[k].y,15,15);//前两个数是矩形的起始坐标，后两个数是矩形的长宽。}//绘制食物	ctx.fillStyle ="black";ctx.fillRect(foodx,foody,15,15);ctx.fill();}function start()//定义蛇的坐标{//var snake =[];//定义一条蛇，画蛇的身体//var snakeCount = 6;//初始化蛇的长度for(var k=0;k<snakeCount;k++){snake[k]={x:k*15,y:0};}drawtable();addfood();//在start中调用添加食物函数}function addfood(){foodx = Math.floor(Math.random()*60)*15; //随机产生一个0-1之间的数foody = Math.floor(Math.random()*40)*15;for (var k=0;k<snake;k++){if (foodx==snake[k].x&&foody==sanke[k].y)//防止产生的随机食物落在蛇身上{	addfood();}}}	function move(){switch (togo){case 1: snake.push({x:snake[snakeCount-1].x-15,y:snake[snakeCount-1].y}); break;//向左走case 2: snake.push({x:snake[snakeCount-1].x,y:snake[snakeCount-1].y-15}); break;case 3: snake.push({x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y}); break;case 4: snake.push({x:snake[snakeCount-1].x,y:snake[snakeCount-1].y+15}); break;case 5: snake.push({x:snake[snakeCount-1].x-15,y:snake[snakeCount-1].y-15}); break;case 6: snake.push({x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y+15}); break;default: snake.push({x:snake[snakeCount-1].x+15,y:snake[snakeCount-1].y});}snake.shift();//删除数组第一个元素ctx.clearRect(0,0,900,600);//清除画布重新绘制isEat();isDead();drawtable();} 			function keydown(e){switch(e.keyCode){case 37: togo=1; break;case 38: togo=2; break;case 39: togo=3; break;case 40: togo=4; break;case 65: togo=5; break;case 68: togo=6; break;}}function isEat()//吃到食物后长度加1{if(snake[snakeCount-1].x==foodx&&snake[snakeCount-1].y==foody){addfood();snakeCount++;snake.unshift({x:-15,y:-15});}}//死亡函数function isDead(){if (snake[snakeCount-1].x>885||snake[snakeCount-1].y>585||snake[snakeCount-1].x<0||snake[snakeCount-1].y<0){window.location.reload();}}document.onkeydown=function(e)
{keydown(e);} 
window.onload = function()//调用函数
{ start();setInterval(move,150);drawtable();}
</script>
</body>
</html>

然后我们浏览器使用公网地址加这个html文件访问,即可看到我们部署的小游戏。

转载自cpolar极点云文章：Linux服务使用宝塔面板搭建网站，并发布公网访问

使用宝塔面板在Linux上搭建网站，并通过内网穿透实现公网访问

文章目录前言1. 环境安装2. 安装cpolar内网穿透3. 内网穿透4. 固定http地址5. 配置二级子域名6. 创建一个测试页面前言宝塔面板作为简单好用的服务器运维管理面板，它支持Linux/Windows系统，我们可用它来一键配置LAMP/LNMP环境、网站、数据库、FTP等&…...

编程日记 2023/10/12 23:48:26

Unity可视化Shader工具ASE介绍——6、通过例子说明ASE节点的连接方式

大家好，我是阿赵。继续介绍Unity可视化Shader编辑插件ASE的用法。上一篇已经介绍了很多ASE常用的节点。这一篇通过几个小例子，来看看这些节点是怎样连接使用的。这篇的内容可能会比较长，最终是做了一个遮挡X光的效果，不过把这…...

编程日记 2023/10/12 23:47:25

VUE3基础知识梳理

VUE3基础知识梳理一、vue了解和环境搭建1.vue是什么：cn.vuejs.org/vuejs.org2.渐进式框架3.vue的版本4.vueAPI的风格5.准备环境5.1.创建vue项目5.2.vue的目录结构二、vue3语法1.干净的vue项目2.模板语法2.1 文本插值2.2属性绑定2.3条件渲染2.4列表渲染2.5通过key管…...

编程日记 2023/10/12 23:46:25

Java架构师缓存通用设计方案

目录 1 采用多级缓存2 缓存数据尽量前移3 静态化4 数据平衡策略5 jvm缓存的问题6 redis存放数据解决7 redis垂直拆分8 总结1 采用多级缓存在实际应用中需要考虑的实际问题。首先，前端页面可以做缓存，虽然图上没有显示，但在现实应用中这是提高性能的一个重要方面。前端页面缓…...

编程日记 2023/10/12 23:45:24

2023年【危险化学品生产单位安全生产管理人员】及危险化学品生产单位安全生产管理人员模拟考试题

题库来源：安全生产模拟考试一点通公众号小程序危险化学品生产单位安全生产管理人员考前必练！安全生产模拟考试一点通每个月更新危险化学品生产单位安全生产管理人员模拟考试题题目及答案！多做几遍，其实通过危险化学品生产单位安…...

编程日记 2023/10/12 23:44:23

微信小程序在bindscroll事件中监听scroll-view滚动到底

scroll-view其实提供了一个 bindscrolltolower 事件这个事件的作用是直接监听scroll-view滚动到底部但是总有不太一样的情况公司的项目 scroll-view 内部最下面有一个类名叫 bottombj 的元素我希望滚动到这个 bottombj 上面的时候就开始加载滚动分页简单说 bottombj这…...

编程日记 2023/10/12 23:43:22

收银系统商品定价设计思考

一、背景因为门店系统里商品总共也就几万款，一直以来都是根据条码由总部统一定价销售，现在有加盟店，各门店也有进行各自促销活动的需求，这就需要放开门店自主定价权，所以近段时间系统在商品定价上做了扩展。二、商…...

编程日记 2023/10/12 23:42:21

Kotlin函数作为参数指向不同逻辑 fun sum(): (Int, Int) -> Int {return { a, b -> (a b) } }fun multiplication(): (Int, Int) -> Int {return { a, b -> (a * b) } }fun main(args: Array<String>) {var math: (Int, Int) -> Intmath sum()println(m…...

编程日记 2023/10/12 23:39:19

读书笔记—《如何阅读一本书》

读书笔记—《如何阅读一本书》一、阅读的层次1、主动阅读的基础一个阅读者要提出的四个基本问题 2、基础阅读（第一层）3、检视阅读（第二层）4、分析阅读（第三层） 二、阅读不同读物的方法三、阅读的最终目标1…...

编程日记 2023/10/12 23:38:18

Kafka数据同步原理详解

Kafka数据同步原理详解 Kafka是一种分布式的消息队列系统，它具有高吞吐量、可扩展性和分布式特性等优势。在Kafka中，数据按照主题进行分区，每个主题都有一组分区。每个分区都有自己的生产者和消费者，生产者负责向分区中写入消息&…...

编程日记 2023/10/12 23:37:17

C++课程总复习

一、c的第一条程序 1.cout cout >输出类对象，用来输出的，可以自动识别类型，所以不需要加格式符号 << 插入符（输出符号） endl 换行>\n #include <iostream> //#预处理 //include 包含相应的头…...

编程日记 2023/10/12 23:36:17

数据结构—顺序表

目录 1.线性表 2.顺序表概念 3.实现顺序表 (1)声明结构体 (2)初始化 (3)打印数据 (4) 销毁 (5)尾插&头插尾插判断是否扩容头插 (6)尾删&头删尾删头删 (7)指定位置插入元素 (8)删除指定位置元素 (9)查找指定元素位置 (10)修改指定位置元素完整版…...

编程日记 2023/10/12 23:35:16

企业服务器租用对性能有什么要求呢？

企业租用服务器租用首要的是稳定，其次是安全，稳定是为了让企业的工作能够顺利进行，只有性能稳定的服务器才能保证网站之类的正常工作，就让小编带大家看一看有什么要求吧！ 服务器简单介绍。服务器是在网络上为其它客户机…...

编程日记 2023/10/12 23:34:15

2731.移动机器人

2731. 移动机器人 - 力扣（LeetCode） 有一些机器人分布在一条无限长的数轴上，他们初始坐标用一个下标从 0 开始的整数数组 nums 表示。当你给机器人下达命令时，它们以每秒钟一单位的速度开始移动。给你一个字符串 s &#xff0c…...

编程日记 2023/10/12 23:33:14

相交链表Java

给你两个单链表的头节点 headA 和 headB ，请你找出并返回两个单链表相交的起始节点。如果两个链表没有交点，返回 nu11。以下有两种解决方法: 一种是用Map,利用其key值唯一的方法去判断(也可以使用set,set在add时,已存在的元素会返回false,不存在的返回…...

编程日记 2023/10/12 23:32:13

第二章：OSI参考模型与TCP/IP模型

OSI参考模型与TCP/IP模型一、OSI参考模型二、TCP/IP模型2.1 四层分法（书上）2.2 五层分法（实际厂商）2.3 数据封装和解封装2.3.1 封装2.3.2 解封装2.3.3 TCP/IP分层封装2.3.4 数据封装和解封装过程一、OSI参考模型 1.物理层定义电…...

编程日记 2023/10/12 23:31:11

知识图谱04——openGL与ubuntu22.04

跑图神经网络的时候遇到了如下问题 libGL error: failed to load driver: iris libGL error: MESA-LOADER: failed to open iris: /usr/lib/dri/iris_dri.so: 无法打开共享对象文件: 没有那个文件或目录 (search paths /usr/lib/x86_64-linux-gnu/dri:\$${ORIGIN}/dri:/usr/li…...

编程日记 2023/10/12 23:30:10

如何看待为了省小钱而花费时间

相信每个人都会遇到这种情况：购买东西时想着货比三家或者想办法领优惠券、凑单等就可以省下一些钱，但是需要花费不少时间和精力。这时就开始犹豫了：省钱是必要的，需要居安思危，等到缺钱的时候不会后悔；又想…...

编程日记 2023/10/12 23:29:09

Maven Eclipse

Eclipse 提供了一个很好的插件 m2eclipse ，该插件能将 Maven 和 Eclipse 集成在一起。在最新的 Eclipse 中自带了 Maven，我们打开，Windows->Preferences，如果会出现下面的画面： 下面列出 m2eclipse 的一些特点&a…...

编程日记 2023/10/12 23:26:06

Linux：redis集群（3.版本和 5.版本）搭建方法

介绍至少6个实例才能组成集群。3主3从会自动分配 Redis集群原理 Redis集群架构 Redis Cluster采用虚拟槽分区，将所有的数据根据算法映射到0~16383整数槽内 Redis Cluster是一个无中心的结构每个节点都保存数据和整个集群的状态集群角色 Master：Master…...

编程日记 2023/10/12 23:25:05

转转集团旗下首家二手多品类循环仓店“超级转转”开业

6月9日，国内领先的循环经济企业转转集团旗下首家二手多品类循环仓店“超级转转”正式开业。转转集团创始人兼CEO黄炜、转转循环时尚发起人朱珠、转转集团COO兼红布林CEO胡伟琨、王府井集团副总裁祝捷等出席了开业剪彩仪式。据「TMT星球」了解，“超级…...

编程新知 2026/2/8 4:08:40

MVC 数据库

MVC 数据库引言在软件开发领域，Model-View-Controller（MVC）是一种流行的软件架构模式，它将应用程序分为三个核心组件：模型（Model）、视图（View）和控制器（Controller）。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系，以…...

编程新知 2025/10/30 4:58:11

微信小程序 - 手机震动

一、界面 <button type"primary" bindtap"shortVibrate">短震动</button> <button type"primary" bindtap"longVibrate">长震动</button> 二、js逻辑代码注：文档 https://developers.weixin.qq…...

编程新知 2026/1/29 8:41:55

《通信之道——从微积分到 5G》读书总结

第1章绪论 1.1 这是一本什么样的书通信技术，说到底就是数学。那些最基础、最本质的部分。 1.2 什么是通信通信发送方接收方承载信息的信号解调出其中承载的信息信息在发送方那里被加工成信号（调制） 把信息从信号中抽取出来&am…...

编程新知 2026/2/7 11:01:56

什么是EULA和DPA

文章目录 EULA（End User License Agreement）DPA（Data Protection Agreement）一、定义与背景二、核心内容三、法律效力与责任四、实际应用与意义 EULA（End User License Agreement） 定义： EULA即…...

编程新知 2025/10/18 7:13:10

【Java_EE】Spring MVC

目录 Spring Web MVC 编辑注解 RestController RequestMapping RequestParam RequestParam RequestBody PathVariable RequestPart 参数传递注意事项编辑参数重命名 RequestParam 编辑编辑传递集合 RequestParam 传递JSON数据编辑RequestBody …...

编程新知 2026/2/1 16:32:53

Yolov8 目标检测蒸馏学习记录

yolov8系列模型蒸馏基本流程，代码下载：这里本人提交了一个demo:djdll/Yolov8_Distillation: Yolov8轻量化_蒸馏代码实现在轻量化模型设计中，**知识蒸馏（Knowledge Distillation）**被广泛应用，作为提升模型…...

编程新知 2026/1/25 7:20:01

STM32HAL库USART源代码解析及应用

STM32HAL库USART源代码解析前言STM32CubeIDE配置串口USART和UART的选择使用模式参数设置GPIO配置DMA配置中断配置硬件流控制使能生成代码解析和使用方法串口初始化__UART_HandleTypeDef结构体浅析HAL库代码实际使用方法使用轮询方式发送使用轮询方式接收使用中断方式发送使用中…...

编程新知 2026/1/31 13:18:46

GO协程(Goroutine)问题总结

在使用Go语言来编写代码时，遇到的一些问题总结一下 [参考文档]：https://www.topgoer.com/%E5%B9%B6%E5%8F%91%E7%BC%96%E7%A8%8B/goroutine.html 1. main()函数默认的Goroutine 场景再现： 今天在看到这个教程的时候，在自己的电…...

编程新知 2026/1/31 6:53:53

React核心概念：State是什么？如何用useState管理组件自己的数据？

系列回顾： 在上一篇《React入门第一步》中，我们已经成功创建并运行了第一个React项目。我们学会了用Vite初始化项目，并修改了App.jsx组件，让页面显示出我们想要的文字。但是，那个页面是“死”的，它只是静态…...

编程新知 2025/11/3 8:29:51