最近在学习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的链接便是你自己的网页了

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

本地web服务映射到外网
一: 什么是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
以上便是基本的搭建本地服务映射外网的基本使用,更深层次的使用方法还有很多,需要自己慢慢探寻了,有不对的地方希望能流言纠正,谢谢
---------------------
作者:海M滨
来源:CSDN
原文:https://blog.csdn.net/u012918868/article/details/80891675
版权声明:本文为博主原创文章,转载请附上博文链接!

java -Mac搭建本地服务器并映射到外网的更多相关文章

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

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

  2. mac搭建本地服务器

    目录 基础部分 1234 启动服务器添加自定义文档到本地服务器查看自定义效果手机/其他电脑 访问本机服务器 说明:本地开发需要搭建本地服务器进行页面的调试,mac系统自带apache服务,本篇日志是针 ...

  3. 【转】使用ngrok快速地将本地Web服务映射到外网

    为什么要使用ngrok? 作为一个Web开发者,我们有时候会需要临时地将一个本地的Web网站部署到外网,以供它人体验评价或协助调试等等,通常我们会这么做: 找到一台运行于外网的Web服务器 服务器上有 ...

  4. 如何免费的将本地Web服务映射到外网

    链接地址:https://hongmaju.github.io/2018/05/13/ngrok%E5%B0%86%E6%9C%AC%E5%9C%B0Web%E6%9C%8D%E5%8A%A1%E6% ...

  5. 3 微信开发本地代理环境的搭建--实现将内网ip映射到外网

    微信公众号的开发,要搭建网站,并且随时都有可能修改网站内容进行调试,这就需要临时外网能返回本地开发环境搭建的项目进行测试,即内网映射到公网,但是好多开发者没有自己的域名和服务器,这里我们先来搭建一个本 ...

  6. Mac 搭建 SVN 服务器环境

    Mac 搭建 SVN 服务器环境 一.创建svn repository svnadmin create /path/svn/pro //仓库位置,svn是svn的目录,pro是一个版本库的目录 PS: ...

  7. iOS开发网络篇—搭建本地服务器

    iOS开发网络篇—搭建本地服务器 一.简单说明 说明:提前下载好相关软件,且安装目录最好安装在全英文路径下.如果路径有中文名,那么可能会出现一些莫名其妙的问题. 提示:提前准备好的软件 apache- ...

  8. IIS搭建本地服务器,花生壳实现外网通过域名访问网站

    配置服务器 作为一个青年,没有实力,做不出标图所示的服务器. 作为一个学生,买不起服务器 作为一个小孩,买不起域名 但别忘了 作为一个平民玩家,只要有耐心 装备迟早会做出来的 (注:感觉有钱与没钱还是 ...

  9. MacOS搭建本地服务器

    MacOS搭建本地服务器 一,需求分析 1.1,开发app(ios android)时通常需往app中切入web页面,直接导入不行,故需搭建本地的测试网站服务,通过IP嵌入访问页面. 1.2,开发小程 ...

随机推荐

  1. ionicframework(二)

    Start building with Ionic! Follow these quick steps and start building high quality mobile apps in m ...

  2. python处理xls、xlsx格式excle

    一.windows下读取xls格式文件,所需模块xlrd.xlw 1.下载安装包 xlrd地址:https://pypi.org/project/xlrd/#files xlwt地址:https:// ...

  3. Android 6.0 超级简单的权限申请2 (Permission)

    代码地址如下:http://www.demodashi.com/demo/13506.html 写在前面 上次写了一个权限申请的例子Android 6.0 超级简单的权限申请 (Permission) ...

  4. Python-Sublime Text3 激活码

    1.点击菜单-help-Enter License 2.输入以下内容中的一个 —– BEGIN LICENSE —– Michael Barnes Single User License EA7E- ...

  5. 欧洲顶级音频播放软件AIMP

    http://zmingcx.com/europes-top-software-aimp-audio-player.html 音频播放软件众多,耳熟能详的Winamp.Foobar2000.千千静听. ...

  6. js中keydown和keypress的区别

    keydown和keypress这些事件是当一个对象具有焦点时进行按下或松开一个键时发生的. keydown在按下的时候返回键盘上的代码值,然后由TranslateMessage函数翻译成字符,并且由 ...

  7. tomcat下运行war包

    例如你下的包名test.war直接放入webapps目录下,到bin目录下双击启动startup.bat,不要关掉tomcat控制台窗口,回到webapps下应该要看到自动解压出一个test的目录,如 ...

  8. Kafka 快速起步

    Kafka 快速起步 原创 2017-01-05 杜亦舒 性能与架构 性能与架构 性能与架构 微信号 yogoup 功能介绍 网站性能提升与架构设计 主要内容:1. kafka 安装.启动2. 消息的 ...

  9. c++ abs与fabs

    在stdlib.h中定义的abs只针对整数取决对值,如果要对浮点数取绝对值,应该用fabs(或fabsf). 而math.h中定义的abs是可以对浮点数取绝对值的. 所以如果包含了stdlib.h和m ...

  10. 《MVC +EasyUI 》——表单的提交

        之前用AJax给Controller传递參数,然后再调用服务端的方法对数据库进行更改,今天碰到一个新的方法,就是表单的提交.这样能够省去AJax穿參.当表单提交后.我们能够获取表单上控件中的值 ...