• 内网穿透
  • 简介
  • ngrok
  • 单服务
    • 本地服务
    • 开启代理验证
  • 多服务
    • 本地服务
      • 前端
      • 后端
      • 配置文件
    • 启动服务

内网穿透

简介

内网服务通过代理隧道(特定代理工具)实现在外网也可以访问 相关的技术称为内网穿透 
当然有公网IP 可以直接使用作为服务的IP(根据办理宽带运营商不同 通常需要咨询运营商获取公网IP)

1. 常用的内网穿透工具
	花生壳: https://hsk.oray.com/
	ngork: https://ngrok.com/
	飞鸽：https://www.fgnwct.com/
	nps: https://github.com/ehang-io/nps/blob/master/README_zh.md

ngrok

1. 下载地址
https://bin.equinox.io/c/bNyj1mQVY4c/ngrok-v3-stable-windows-amd64.zip

2. 根据机器系统安装

3. 参考文档
https://ngrok.com/docs

4. 快速开始
a. 启动一个本地服务
b. 安装ngrok代理软件包
c. 初始化配置
	c1.初次登录新建账号
		https://dashboard.ngrok.com/login
	c2.获取认证token
	c3.执行命令初始化会在指定用户目录生成配置文件
		ngrok config add-authtoken TOKEN
d. 开启ngrok代理
	邮箱认证(重要) 否则后续开启代理后会失败 
		https://dashboard.ngrok.com/user/settings
	指定命令
		ngrok http <本地服务端口>

单服务

本地服务

from flask import Flask, jsonify

app = Flask(__name__)


@app.route("/")
def index():
    return jsonify({"code": 0, "msg": "ok"})


if __name__ == '__main__':
    app.run(host='0.0.0.0', port=6666, debug=False)

开启代理验证

cd <ngrok安装目录>
ngork config add-authtoken <token>
ngrok http <本地服务端口>
curl https://2b18-223-104-194-130.ngrok-free.app

多服务

本地服务

前端

npm config set registry https://registry.npm.taobao.org
npm install cnpm
npm install -g vue-cli
cnpm install -g  webpack 

vue init webpack vue2Test
cd vue2Test
npm run dev

PS: vue2修改webpack.dev.conf.js
const devWebpackConfig = merge(baseWebpackConfig, {
  module: {
    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
  },
  // cheap-module-eval-source-map is faster for development
  devtool: config.dev.devtool,

  // these devServer options should be customized in /config/index.js
  devServer: {
    disableHostCheck: true,  # 加上
 	},
 }

后端

'''
pip install flask
'''
from flask import Flask, jsonify

app = Flask(__name__)


@app.route("/")
def index():
    return jsonify({"code": 0, "msg": "ok"})


if __name__ == '__main__':
    app.run(host='0.0.0.0', port=6666, debug=False)

1. ngrok官网设置静态域名
	https://dashboard.ngrok.com/cloud-edge/domains

2.1 命令行绑定域名方式运行单服务
	ngrok http --domain=<域名>  <本地服务端口>

2.2 采用在配置文件指定服务名方式
	# 编辑配置文件(ngrok.yml) 在初始化配置(ngrok config add-authtoken <token>)时会在指定用户目录下生成
	# yml配置参数详见https://ngrok.com/docs/secure-tunnels/ngrok-agent/reference/config/
	ngrok config edit 
	# 运行单(多)个服务
	ngrok start <服务名1> <服务名2>
	# 运行所有服务(需要绑定不同域名)
	ngrok start --all

配置文件

version: "2"
authtoken: <token>
tunnels:
  vue2Service:
    proto: http
    hostname: <域名1>
    addr: 127.0.0.1:8081

  flaskService:
    proto: http
    hostname: <域名2>
    addr: 127.0.0.1:6666

启动服务

ngrok start vue2Service
curl https://pleasing-special-primate.ngrok-free.app

ngrok start flaskService
curl https://pleasing-special-primate.ngrok-free.app