Skip to content

Commit

Permalink
feat: Implement ngrok v1 proxy for serve command (#4)
Browse files Browse the repository at this point in the history
## Description
I implemented the integration with [ngrok
v1](https://github.com/inconshreveable/ngrok) as one of the integrations
for the Tunnel feature.
This feature uses ngrok to tunnel the URL passed to the serve command,
and sets the ngrok URL as the endpoint URL for the LIFF app.

Below is what the terminal looks like when the command is executed:
```
❯ npx @line/liff-cli serve -l 1234567890-aBcDeFg -u http://127.0.0.1:8081 --proxy-type ngrok-v1 --ngrok-command ngrok
Successfully updated endpoint url for LIFF ID: 1234567890-aBcDeFg.

→  LIFF URL:     https://liff.line.me/1234567890-aBcDeFg
→  Proxy server: https://abc123.ngrok.example.com/
```


In order for users to use this feature, they need to install `node-pty`.
`node-pty` is a large package.
ref: https://bundlephobia.com/package/[email protected]

Because not all users will use the ngrok v1 integration feature, I
specified it in `peerDependencies`.
  • Loading branch information
odanado authored Feb 12, 2025
1 parent 6493f64 commit 01ca03d
Show file tree
Hide file tree
Showing 11 changed files with 341 additions and 19 deletions.
175 changes: 169 additions & 6 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

12 changes: 11 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
"eslint": "8.50.0",
"eslint-config-prettier": "9.1.0",
"msw": "2.3.1",
"node-pty": "1.0.0",
"prettier": "3.3.1",
"publint": "0.2.8",
"typescript": "5.4.5",
Expand All @@ -48,6 +49,15 @@
"conf": "12.0.0",
"http-proxy": "1.18.1",
"inquirer": "9.2.23",
"picocolors": "1.1.0"
"picocolors": "1.1.0",
"strip-ansi": "7.1.0"
},
"peerDependencies": {
"node-pty": "^1.0.0"
},
"peerDependenciesMeta": {
"node-pty": {
"optional": true
}
}
}
6 changes: 6 additions & 0 deletions src/serve/commands/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,9 @@ describe("serveCommand", () => {
url: "https://example.com?hoge=fuga",
host: "https://example.com",
port: "8000",
proxyType: "local-proxy",
localProxyPort: "9001",
ngrokCommand: "ngrok",
inspect: true,
};

Expand All @@ -45,6 +47,10 @@ describe("serveCommand", () => {
"--local-proxy-port",
options.localProxyPort,
"--inspect",
"--proxy-type",
options.proxyType,
"--ngrok-command",
options.ngrokCommand,
]);

expect(serveAction).toHaveBeenCalledWith(options, proxy);
Expand Down
20 changes: 12 additions & 8 deletions src/serve/commands/index.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { Command } from "commander";
import { LocalProxy } from "../proxy/local-proxy.js";
import path from "path";
import { serveAction } from "../serveAction.js";
import { resolveProxy } from "../resolveProxy.js";

export const installServeCommands = (program: Command) => {
const serve = program.command("serve");
Expand All @@ -18,18 +17,23 @@ export const installServeCommands = (program: Command) => {
"-i, --inspect",
"The flag indicates LIFF app starts on debug mode. (default: false)",
)
.option(
"--proxy-type <proxyType>",
"The type of proxy to use. local-proxy or ngrok-v1",
"local-proxy",
)
.option(
"--local-proxy-port <localProxyPort>",
"The port number of the application proxy server to listen on when running the CLI.",
"9000",
)
.option(
"--ngrok-command <ngrokCommand>",
"The command to run ngrok.",
"ngrok",
)
.action(async (options) => {
const cwd = process.cwd();
const proxy = new LocalProxy({
keyPath: path.resolve(cwd, "localhost-key.pem"),
certPath: path.resolve(cwd, "localhost.pem"),
port: options.localProxyPort,
});
const proxy = resolveProxy(options);
await serveAction(options, proxy);
});
return serve;
Expand Down
Loading

0 comments on commit 01ca03d

Please sign in to comment.