Ngrok内网穿透

vue http-server启动的项目
其他设备就可以访问由 http-server 启动的 Vue 项目：

1. 同一局域网：这些设备需要与运行 http-server 的设备在同一局域网内。

2. 开放端口：你使用来启动 http-server 的端口需要在你的网络防火墙中开放，以便其他设备可以访问。

3. 正确的 IP 地址和端口：要访问该服务，其他设备需要使用 http-server 托管的设备的局域网 IP 地址和正确的端口。

比如说，如果你的电脑 IP 是 192.168.1.5，你的 Vue 项目通过 http-server 在 8080 端口上运行，那么其他设备就可以通过在浏览器中输入 192.168.1.5:8080 来访问你的项目。

ngrok start --config ./ngrok.yml my-project 运行完这个命令，那个是我可以访问我项目的地址

执行完你所给出的命令后，ngrok将会启动并创建一个隧道，允许外部设备通过公网来访问你的项目。你可以访问你正在运行的ngrok的实时web界面，找到你的公开网址。

打开你的web浏览器，访问 http://localhost:4040 ，你将看到ngrok 提供的一个实时的Web UI，你可以在这里找到你的公网地址。

通常，这个地址将类似于 http://yoursubdomain.ngrok.io 或是 https://yoursubdomain.ngrok.io ，具体取决于你的 ngrok.yml配置文件的内容。你可以用这个公网地址在任何可以访问互联网的设备上访问你的项目。

注意，如果你的 ngrok 会话结束或重新启动，这个公网地址可能会改变。如果你需要一个固定的公网地址，你可能需要购买 ngrok 的专业版本。

以下是使用ngrok start --config ./ngrok.yml my-project命令的详细教程：

1. 首先，你需要安装ngrok。你可以在此处下载ngrok的安装包并按照提供的指南进行安装。

2. 在你的项目根目录下创建一个ngrok.yml的配置文件。

3. 在配置文件中，你需要指定你要公开的本地网络端口。以下是一个示例配置：
   必须添加的配置项
   1.version
   2.authtoken

# version: 1 //随机写 (******必须存在的)
# authtoken:   ngrok auth token //自己注册的token (******必须存在的)
# tunnels:
#   my-project:  # Name of the tunnel
#     addr: 8080  # Localhost port number
#     proto: http  # Protocol (http, https or tcp)
#     hostname: 127.0.0.1:8080 //hostname 配置是需要购买的，不配置此项也可以使用，但是每次启动会随机生成访问地址

在此配置中，你创建了一个名为my-project的隧道，该隧道 指向你本地机器上的8080端口。

4. 保存你的ngrok.yml 文件，并运行以下命令：

ngrok start --config ./ngrok.yml my-project

6. 运行以上命令后，ngrok 将在控制台中显示一个URL，这个URL就是你可以访问你项目的地址。这个URL将会连接到你本地机器上的8080端口。
   当你运行 ngrok start --config ./ngrok.yml my-project 这个命令以后，ngrok会在你的命令行或者终端窗口中显示一个类似于这样的输出：

ngrok by @inconshreveable                                                                               (Ctrl+C to quit)

Session Status        online
Account               your-email@example.com (Plan: Free)
Version               2.3.35
Region                United States (us)
Web Interface         http://127.0.0.1:4040
Forwarding            http://abc1234.ngrok.io -> http://localhost:80
Forwarding            https://abc1234.ngrok.io -> http://localhost:80

Connections           ttl     opn     rt1     rt5     p50     p90
                       0       0       0.00    0.00    0.00    0.00

在这个输出中，Forwarding部分写的网址（如http://abc1234.ngrok.io)就是可以让外部网络访问到你本地项目的公开URL。同时，你也可以通过浏览器访问Web Interface部分的网址（http://127.0.0.1:4040）来查看ngrok的实时web界面并查看被ngrok映射的所有服务状态和详细信息。

请注意，每次启动ngrok时，如果你没有配置固定的URL，那么abc1234这样的部分是随机生成的，所以每次都会不一样。如果你希望每次都使用同一个URL，你需要用到ngrok的高级功能，包括购买ngrok的专业版并进行相关配置。