ngrok官网：https://ngrok.com/

注册，登录，可以使用github账号登录

选择自己的操作系统，下载软件包

安装包如下

到.exe所在文件下执行这个命令，要带上自己的token

准备内网穿透，将自己的本地服务ip端口替换成示例的

然后会出现这样的东西

直接在浏览器上去访问，

这是由于第一次访问，没有信任感，点下visit site就可以了

这是由于vite的限制呢 ,Vite 项目里，有个 server.allowedHosts 配置项，作用是限制哪些域名 / 主机能访问你的本地开发服务，防止非法域名的访问，保障开发环境安全。改造下

就可以了

export default defineConfig({
  server: {
    // 允许访问的主机，添加 ngrok 的域名
    allowedHosts: ['you---------ip.ngrok-free.app', 'localhost', '127.0.0.1']
  }
})

每次启动ngrok,分配给我们的是变化的，使用这个命令启动就可以创建一个不变的域名，同时vite.config.ts中也要添加这个域名

如果本地有多个端口

1、找到本地的ngrok.yml文件，可以实现转发，这里的ip依旧是会变化的，如果要不变化，是需要借助subdomain来实现的，而这个是要收费的

ngrok start frontend

ngrok start backend

ngrok start database

或者一键启动           ngrok start --all

但是ip也是会变的

或者根据不同的访问路径去配置多个本地服务（反向代理）

同一端口

server {
    listen 80;
    server_name example.com;  # 替换为你的域名或 IP

    # 转发到第一个服务（例如 8080 端口）
    location /service1/ {
        proxy_pass http://localhost:8080/;  # 注意末尾的斜杠
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

    # 转发到第二个服务（例如 8081 端口）
    location /service2/ {
        proxy_pass http://localhost:8081/;  # 注意末尾的斜杠
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

想要实现更多功能使用FRP