10分钟教你搭建自己的ngrok服务器

2019-03-15 15:28:33

参考地址 10分钟教你搭建自己的ngrok服务器


内网穿透想必开发过微信的同志都很了解,大部分人选择网上寻找各种现成的,比如ngrok官网、ittun-ngrok、sunny-ngrok或者花生壳之类的。但是世界上没有免费的午餐,要不就是收费,要不就是免费但是偶尔会出现连接失败的问题(当然大多数时间是没有问题的)。


偶然,正在测试微信的某些功能,但是正在使用的ittun-ngrok连接失败了。导致测试无法进行,最终萌生出自己搭建一个ngrok服务器的想法。


1、必要条件


(1)服务器,用来搭建ngrok的服务器,必须有公网ip,并且可以正常访问(本次测试使用的是Ubuntu 16.04 64位)。 

(2)域名,用来生成访问域名。


2、安装git 和Golang


apt-get install build-essential golang mercurial git

1

Golang,Go语言支持,因为Ngrok是基于Go语言编写的


3、下载源码,当然也可以不安装git,但是需要手动上传代码到需要的位置。


此处使用非官方地址,修复了部分包无法获取(摘自网络)


git clone https://github.com/tutumcloud/ngrok.git ngrok

1



下载下来的目录结构 



4、生成自签名证书 

使用ngrok.com官方服务时,我们使用的是官方的SSL证书。自建ngrokd服务,如果不想买SSL证书,我们需要生成自己的自签名证书,并编译一个携带该证书的ngrok客户端。


证书生成过程需要一个NGROK_BASE_DOMAIN。 以ngrok官方随机生成的地址xxx.ngrok.com为例,其NGROK_BASE_DOMAIN就是“ngrok.com”,如果你要提供服务的地址为“example.ngrok.xxx.com”,那NGROK_BASE_DOMAIN就应该 是“ngrok.xxx.com”。本次测试,由于没有多余的域名,我替换成自己的二级域名“weixin.yangjiace.xyz”。


cd ngrok


NGROK_DOMAIN="weixin.yangjiace.xyz"


openssl genrsa -out base.key 2048


openssl req -new -x509 -nodes -key base.key -days 10000 -subj "/CN=$NGROK_DOMAIN" -out base.pem


openssl genrsa -out server.key 2048


openssl req -new -key server.key -subj "/CN=$NGROK_DOMAIN" -out server.csr


openssl x509 -req -in server.csr -CA base.pem -CAkey base.key -CAcreateserial -days 10000 -out server.crt

1

2

3

4

5

6

7

8

9

10

11

12

13

 

执行完成后需要替换证书


cp base.pem assets/client/tls/ngrokroot.crt

1

5、编译


make release-server release-client

1



编译成功后会在bin目录下找到ngrokd和ngrok这两个文件。其中ngrokd 就是服务端程序了。 



6、启动服务端


./bin/ngrokd -tlsKey=server.key -tlsCrt=server.crt -domain="weixin.yangjiace.xyz" -httpAddr=":80" -httpsAddr=":443"

1

httpAddr、httpsAddr 分别是 ngrok 用来转发 http、https 服务的端口,可以随意指定。ngrokd 还会开一个 4443 端口用来跟客户端通讯(可通过 -tunnelAddr=”:xxx” 指定)。由于微信限制不能出现端口号,因此这个使用了80、443端口。


7、编译客户端


(1)windows


GOOS=windows GOARCH=amd64 make release-client  

1

(2)mac


GOOS=darwin GOARCH=amd64 make release-client

1

执行对应的命令会在bin目录下生成相对应的windows、mac目录,ngrok.exe就存放在对应目录下。将对应的ngrok.exe下载到本地。


8、设置本地客户端


(1)在同级目录下新建一个配置文件ngrok.cfg


server_addr: "weixin.yangjiace.xyz:4443"  

trust_host_root_certs: false  

1

2

(2)同级目录下新建一个启动脚本startup.bat


@echo on

cd %cd%

#ngrok -proto=tcp 22

#ngrok start web

ngrok -config=ngrok.cfg -log=ngrok.log -subdomain=yjc 8080

1

2

3

4

5

其中,-config指向配置文件,-log存放日志文件位置,-subdomain为自定义的域名前缀。8080为端口号。


(3)启动,点击启动脚本startup.bat完成启动。 



9、设置为系统程序,并后台运行。




服务器在运行ngrok时,如果关闭会话窗口,会导致服务中断,很显然这不是我们想要的结果,我们需要服务不断的在后台运行,当需要的时候在停止。


在/etc/systemd/system/目录下创建服务ngrok.service,内容为


[Unit]

Description=ngrok

After=network.target


[Service]

ExecStart=/myweb/ngrok/bin/ngrokd -tlsKey=/myweb/ngrok/server.key -tlsCrt=/myweb/ngrok/server.crt -domain="weixin.yangjiace.xyz" -httpAddr=":80" -httpsAddr=":443"


[Install]

WantedBy=multi-user.target

1

2

3

4

5

6

7

8

9

其中要根据自己的实际目录修改相对应的目录。


这样我们就可以了通过systemctl start ngrok.service启动服务。然后就可以愉快的玩耍了。

--------------------- 

作者:梦幻逝水 

来源:CSDN 

原文:https://blog.csdn.net/yjc_1111/article/details/79353718 

版权声明:本文为博主原创文章,转载请附上博文链接!


  • 2019-12-10 11:15:08

    用CSS给SVG 的内容添加样式

    SVG图形的一个最常见用例是图标系统,其中最常用的SVG sprite技术就是使用SVG<use> 元素在文档中任意位置“实例化”图标。 使用<use>元素实例化图标或任何其它的SVG元素或图像,给元素添加样式时经常会碰到一些问题。这篇文章的目的是尽可能给你介绍一些方法来解决:使用<use>引入的内容添加样式受限的问题。 但是在开始之前,我们先快速浏览一下SVG的主要结构和分组元素,然后慢慢进入use的世界中,以及shadow DOM,然后重回CSS的怀抱。我们会逐步讲解为什么给<use>内容添加样式会比较麻烦,以及有什么好的解决方案。

  • 2019-12-10 16:21:05

    display:flex的子元素无法设置宽度

    子元素有个flex-shrink属性,表示在父元素宽度不够的情况下是自动收缩不?0表示不自动收缩,1表示自动收缩;所以将子元素(图片)添加属性:flex-shrink:0;即

  • 2019-12-10 21:14:11

    axios文件上传功能+formData

    在项目中使用axios上传文件,记得new一个纯净的axios或者考虑用ajax请求。因为axios在项目估计已经用了全局配置请求头等信息,这里的配置可能被全局请求头拦截,导致请求失败。 2.1构造formData 作者:exmexm 链接:https://www.jianshu.com/p/9c708a47d8a5 来源:简书 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

  • 2019-12-11 16:04:15

    CSS中的 “var()” 和 “:root”

    var() var()函数可以代替元素中任何属性中的值的任何部分。var()函数不能作为属性名、选择器或者其他除了属性值之外的值。(这样做通常会产生无效的语法或者一个没有关联到变量的值。)

  • 2019-12-11 16:18:51

    npm发布vue组件

    开发之前先看看官网的 开发规范 我们开发的之后期望的结果是支持 import、require 或者直接使用 script 标签的形式引入,就像这样

  • 2019-12-11 16:21:00

    .vue文件 加scoped 样式不起作用

    在vue组件中,为了使样式私有化(模块化),不对全局造成污染,在style标签上添加scoped属性,以表示它只属于当下的模块。但是要慎用,因为在我们需要修改公共组件(第三方库或者项目中定制的组件)的样式的时候,scoped会造成很多困难,组要增加额外的复杂度。

  • 2019-12-11 16:22:04

    Vue中的scoped和scoped穿透,scoped原理

    在Vue文件中的style标签上有一个特殊的属性,scoped。当一个style标签拥有scoped属性时候,它的css样式只能用于当前的Vue组件,可以使组件的样式不相互污染。如果一个项目的所有style标签都加上了scoped属性,相当于实现了样式的模块化。