Node.jsで`URLPattern`を使ったコードを書いてみる
Cloudflare WorkersでURLPatternを利用したい場合、「Pico」というフレームワークを使用することができます。Node.jsではURLPatternがサポートされていないため、Polyfillを使って補完する必要があります。Picoを使用することでURLPatternを利用することができ、Cloudflare WorkersでもOKです。ただし、URLPattern APIはまだ実験的な段階で、安定版ではないようです。プロジェクトによっては使用することができそうです。
目次
Cloudflare Workersまわりなどを調べている際に、「Pico」というフレームワークを見つけました。
このライブラリが、RouterにURLPattern
を利用しているらしく、仕組みに興味が湧いたので触ってみました。
そもそもNode.jsではURLPattern
がサポートされていない(?)
さっそく動かそうとして、見事にエラーを踏み抜きます。
$ node index.js
/Users/sandbox/javascript/index.js:1
const pattern = new URLPattern({ pathname: "/entry/:id" });
^
ReferenceError: URLPattern is not defined
記事や関連リンクを読み返すと、そもそも一部のブラウザやWeb Workersでしかサポートしていない様子です。
Web Workersで動くので、Cloudflare WorkersはOKということですね。
Polyfilを入れて動かす
この手のAPIはだいたいPolyfilを誰かが作っています。
ということで、さっそく見つけたライブラリを追加しましょう。
% npm i urlpattern-polyfill
これで動きました。
const { URLPattern } = require("urlpattern-polyfill");
const pattern = new URLPattern({ pathname: "/entry/:id" });
const match = pattern.exec("http://localhost/entry/123?page=2");
console.log(match);
実行結果はこちら。
$ node index.js
{
inputs: [ 'http://localhost/entry/123?page=2' ],
protocol: { input: 'http', groups: { '0': 'http' } },
username: { input: '', groups: { '0': '' } },
password: { input: '', groups: { '0': '' } },
hostname: { input: 'localhost', groups: { '0': 'localhost' } },
port: { input: '', groups: { '0': '' } },
pathname: { input: '/entry/123', groups: { id: '123' } },
search: { input: 'page=2', groups: { '0': 'page=2' } },
hash: { input: '', groups: { '0': '' } }
}
URLPattern APIは”Experimental”
MDNの記事やPicoの紹介ページにもNoticeされていますが、2023年4月現在まだまだ安定版ではない様子です。
This is an experimental technology
独自でFrameworkを作りたくなった時(AWS LambdaとかFirebase Functionsとか)に使えそうかなと思ったのですが、継続して面倒を見続けるつもりのプロジェクトや壊れても大きな問題にならないものに絞って使うくらいがよさそうです。