Mac搭建本地服务器并映射到外网

最近在学习Html,小有进步变想着写一个浪漫的静态页面给女朋友浪漫一下,那么问题就来了,如何把我的网页让对网络一窍不通的女朋友看到,所以便想到了是用自己电脑作为服务器的想法.百度以后整理如下:

Mac自带Apache服务器,所以比较简单
一: 打开终端

//开启apache:需要输入密码

sudo apachectl start

//重启apache:

sudo apachectl restart

//关闭apache:

sudo apachectl stop

开启成功之后用同一局域网的浏览器打开http://127.0.0.1/或者http://localhost测试一下回显示

局域网It work.png

二: 此处显示的网页在/Library/WebServer/Documents,打开文件路径

image.png

it work的网页是上图的index.html.en,以此类推,如果想要放自己的网站,可以吧文件拖入上图,类似HaiMiLove文件,此时打开http://127.0.0.1/haimilove的链接便是你自己的网页了

三:使用完成记得关闭,不然很耗费电脑性能

一: 什么是ngrok
本地服务映射到外网有很多,但这里说的是通过免费ngrok内网穿透映射到外网
ngrok官网下载地址:https://ngrok.com/download
Ngrok 是一个反向代理，通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

ngrok官网介绍.png

二: 如何使用ngrok
上面已经介绍了如何打开本地web服务,在上面的基础上开始映射到外网奥

下载

官网下载.png
解压缩,并放到一个你认为合适的地方,注意:解压缩后的二进制文件是直接使用的,所以放到一个你认为方便的地方开始用终端命令行使用它吧
2.1 使用命令行打开文件所在位置,一下以我自己文件位置为例

cd /Users/mass

image.png

2.2 开启服务

./ngrok http localhost:80

注意,此处开启服务需要用上面的时候开启本地服务时候的端口号,如果你从来没有设置过则默认是80 ,如果不是可以在/etc/apache2/httpd.conf的网络配置文件中查看,具体的方法自行百度

修改默认路径

修改默认端口号

开启成功.png

注意:http://097df238.ngrok.io便是外网可以访问的地址,这个地址在每次开启服务都是不同的,如果想要固定地址,就得注册ngrok获得token并付费获得,具体流程在注册成功后官网介绍很详细,上图中的Account便是我注册的免费账户,通过 auth token绑定

你还可以通过 http://127.0.0.1:4040 ngrok正在运行，查看隧道请求的历史记录。您还可以检查每个请求的标题和响应，或者重播请求以加快您的开发过程。当然也可以在终端查看

流量.png

秒客网