PHPStudy快速搭建网站并结合内网穿透远程访问本地站点

文章目录

    • @[toc]
      • 使用工具
      • 1. 本地搭建web网站
        • 1.1 下载phpstudy后解压并安装
        • 1.2 打开默认站点,测试
        • 1.3 下载静态演示站点
        • 1.4 打开站点根目录
        • 1.5 复制演示站点到站网根目录
        • 1.6 在浏览器中,查看演示效果。
      • 2. 将本地web网站发布到公网
        • 2.1 安装cpolar内网穿透
        • 2.2 映射内网端口
        • 2.3 实现公网访问本地web网站

本教程为快速在本地环境下搭建web网站,同时实现可在外网环境下访问!!


使用工具

  • phpstudy(本地搭建web网站)
  • cpolar内网穿透(将网站发布到公网可访问)

1. 本地搭建web网站

1.1 下载phpstudy后解压并安装

官网下载:https://www.xp.cn/download.html

安装后的效果,如图:

1

点击,一键启动 WNMP 旁边的启动按钮,会默认启动nginx,MYSQL 5.7,在启动过程中,如有提示防火墙提示,允许即可。

2

1.2 打开默认站点,测试

在PHPStudy面版–网站–选择localhost 80的默认站点,点击管理,弹出下拉菜单,选择打开网站,会弹出浏览器,打开本地默认站点http://localhost

3

如下图,说明安装成功。

4

1.3 下载静态演示站点

下载:https://www.cpolar.com/static/downloads/meditation-app-master.zip

下载后,解压缩,复制目录下的所有文件,如下图

5

1.4 打开站点根目录

我们找到并打开网站的根目录

6

默认在 D:\phpstudy_pro\WWW, 我们将目录里所有文件删除,如下图

7

1.5 复制演示站点到站网根目录

复制我们的演示站点所有文件到该目录下,复制后如下图:

8

1.6 在浏览器中,查看演示效果。

这个网站此时只能在本地局域网内访问,公网暂时还无法访问到。

9

2. 将本地web网站发布到公网

要将在本地搭建的网站发布到公网可访问,可以做内网穿透来实现,我这里选择用cpolar内网穿透,支持http/https/tcp协议,不限制流量,可以免费使用,不用公网IP,也不用设置路由器,使用比较简单。

2.1 安装cpolar内网穿透

cpolar内网穿透官网:https://www.cpolar.com/

点击进入cpolar官网,点击免费使用注册一个账号,并下载最新版本的cpolar

  • Windows系统下载zip压缩包,解压后得到cpolar安装包,然后双击安装包一路默认安装即可;
  • linux系统支持一键自动安装脚本;
  • macOS系统下载zip压缩包,解压后得到cpolar,然后通过命令行带参数运行即可。

linux系统以及macOS系统安装cpolar可参考官网文档教程————→https://www.cpolar.com/docs

2.2 映射内网端口

cpolar安装完成后,在浏览器上访问127.0.0.1:9200,使用cpolar账号登录web UI

web ui

登录成功进入主界面后,点击左侧仪表盘的隧道管理——创建隧道

  • 隧道名称:可自定义命名,注意不要重复
  • 协议:选择http
  • 本地地址:80(填写你想要映射的内网端口)
  • 域名类型:免费用户选择随机域名,付费用户可以配置固定的二级子域名或者自定义域名
  • 地区:选择China vip

然后点击创建

在这里插入图片描述

2.3 实现公网访问本地web网站

隧道创建成功后,可以在左侧仪表盘的状态——在线隧道列表,查看到刚刚所创建隧道的公网地址,有两行,一个是http协议,一个是https协议。

在这里插入图片描述

将公网地址复制到浏览器访问即可,成功实现公网访问本地网站。

13

PS:需要注意的是,由于这次使用的是免费的cpolar,所生成的公网地址为随机临时地址,每隔24小时就会发生变化,并且带宽较小,比较适用于开发测试。如果你想要将访问地址设置成固定的,可以升级cpolar套餐配置,支持21天退款保证,详细可以参考下一篇文章教程。

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

04set注入专题/简单类型/数组/List/Set/Map/空字符串/null/特殊符号

1.1注入外部Bean 在之前使用的案例就是注入外部Bean的方式。 <!-- class属性声明要管理哪个类中的对象 property标签的name是提示set方法名ref标签指明注入的bean的id--><bean id"userServiceBean" class"com.powernode.spring6.service.UserService…

磁盘损坏0x80070570

要修复的文件在E盘&#xff0c;那就输入&#xff1a;chkdsk e&#xff1a; /f 原文&#xff1a;https://www.haozhuangji.com/xtjc/111213592.html

WEB前端知识点整理(HTML+CSS+JAVASCRTPT)

1.HTML5、HTML和XHTML都是用于创建网页的标记语言&#xff0c;它们之间有一些关键的区别&#xff1a; &#xff08;1&#xff09;语法和规范&#xff1a; HTML5&#xff1a; HTML5是HTML标准的最新版本&#xff0c;引入了许多新的元素和API&#xff0c;以提供更丰富的功能和更…

Keras实现seq2seq

概述 Seq2Seq是一种深度学习模型&#xff0c;主要用于处理序列到序列的转换问题&#xff0c;如机器翻译、对话生成等。该模型主要由两个循环神经网络&#xff08;RNN&#xff09;组成&#xff0c;一个是编码器&#xff08;Encoder&#xff09;&#xff0c;另一个是解码器…

揭开 JavaScript 作用域的神秘面纱(上)

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

欧科云链研究院:奔赴2024,Web3与AI共振引爆数字时代潘多拉魔盒

出品&#xff5c;欧科云链研究院 2024年&#xff0c;Web3与AI两个数字科技的巅峰碰撞&#xff0c;欧科云链研究院探索AI与Web3的技术融合&#xff0c;与澎湃科技联合发布2024年展望&#xff0c;原标题为《2024年展望&#xff1a;Web3与AI共振引爆可信数字社会》&#xff0c;共…

【本科生通信原理】【实验报告】【北京航空航天大学】实验一:通信原理初步

一、实验目的&#xff1a; 熟悉 MATLAB开发环境、掌握 MATLAB基本运算操作&#xff1b;熟悉和了解 MATLAB图形绘制基本指令&#xff1b;熟悉使用 MATLAB分析信号频谱的过程&#xff1b;掌握加性白高斯噪声信道模型 二、实验内容&#xff1a; 三、实验程序&#xff1a; 1、 f…

Ubuntu 安装Nginx服务

文章目录 前言一、Nginx安装1. Nginx默认安装2. Nginx指定版本安装3. Nginx验证4. Nginx服务控制4.1 查看服务状态4.2 停止服务4.3 启动服务4.4 重启服务 5. Nginx文件存放目录 二、自己编译Nginx1. 下载源码2. 依赖配置3. 编译 三、Nginx卸载总结 前言 Nginx&#xff08;发音为…

flutter版本升级后,解决真机和模拟器运行错误问题

flutter从3.3.2升级到3.16.0&#xff0c;项目运行到真机和模拟器报同样的错&#xff0c;错误如下: 解决办法&#xff1a;在android目录下的build.gradle加入下面这行&#xff0c;如下图&#xff1a; 重新运行&#xff0c;正常把apk安装到真机上或者运行到模拟器上

Leetcode2965. 找出缺失和重复的数字

Every day a Leetcode 题目来源&#xff1a;2965. 找出缺失和重复的数字 解法1&#xff1a;哈希 用哈希表统计数组 grid 中各元素的出现次数&#xff0c;其中出现次数为 2 的记为 a。 统计数组 grid 的元素之和为 sum。 数组 grid 其中的值在 [1, n2] 范围内&#xff0c;…

【ONE·MySQL || 基本查询(CRUD)】

总言 主要内容&#xff1a;表的增删查改&#xff08;DML操作&#xff09;。insert插入&#xff08;包含插入更新、插入查询&#xff09;&#xff0c;replace替换。select查询&#xff08;包含列别名、distinct去重、where条件筛选、order排序、limit子句、group by子句、having…

使用 Python 进行贝叶斯优化

一、介绍 贝叶斯优化是一种先进的技术&#xff0c;用于优化评估成本高昂的函数。该策略为全局优化提供了原则性策略&#xff0c;强调探索&#xff08;尝试新领域&#xff09;和开发&#xff08;尝试看起来有前途的领域&#xff09;之间的平衡。 二、什么是贝叶斯优化&#xff1…