JavaScript・TypeScript・WebAssembly を世界中のエッジで実行できる Deno Deploy(ディノデプロイ)についてまとめています。


Deno Deploy は2021年3月29日 Deno Company の設立と共に公開されました。
現在のところ public beta 扱いで課金なく無料提供されています。

🦕 Deno Deploy Beta 1 | Deno Blog

2021年6月23日、Deploy Beta 1 となっています。
2021年10月~12月に一般提供開始予定です。
後に有料化、または有料プランが登場する可能性があります。


目次


公式サイト


簡単な使い方

Sign In 後 New Project からプロジェクト名 を決めます。
これはアドレス https://プロジェクト.deno.dev/ で使われます。

すると GitHub の連携を促す画面になりますが、
デプロイは次のどちらかです。

  • .js・.ts のソースが入っている URL を Deploy URL に入れる。
    URL は誰でも参照できる場所である必要があります。
  • Git Integration で Git プロジェクトの .js・.ts のソースを入れる。
    Git プロジェクトは GitHub などで Public 状態の必要があります。
    Git 連携にすると git push でソースが更新された時にデプロイされます。

例えばこんなソースです。

addEventListener("fetch", (event) => {
  event.respondWith(new Response("(・~・)mog?"));
});

デプロイが正常に完了するとプロジェクトページに戻るので、
DOMAIN に参照されている プロジェクト.deno.dev で
(・~・)mog? と表示されるのを確認して下さい。


サンプル

🦕 Deno Deploy Docs

ここには Guide・Tutorials・Examples でいくつかソースが存在します。

 Workers - Examples | Cloudflare Docs

Deno Deploy Docs にもある通り、Cloudflare Workers と API で互換性があります。
そのため、Cloudflare Workers 本来の API のみで動作しているソースは
Deno Deploys でも動作する可能性が高いです。
ただし、外部サービスを使用しているものは修正が必要で、
KV を使用したもの(Workers Site など)は Dyno Deploy では動作しません。

同様に GitHub で Deno Deploy を検索しても
Docs にあるサンプルをそのまま動作させたプロジェクトばかりの状態ですが、
Cloudflare Workers で検索すると Deno Deploy でも使用できる
有益なソースが見つかるかもしれません。

🎈 Cloudflare Workers | ふうせん🎈 FU-SEN

ページ運営者が実際に使用しているソースを公開しています。
こちらのソースは Deno Deploy でも動作可能な事を確認できています。

Deno Deploy 固有で特に使えそうなサンプルをいくつか紹介します。

他ドメインへ転送

async function handleRequest(request) {
  return Response.redirect("https://example.net.eu.org/deno/", 301)
}

addEventListener("fetch", async event => {
  event.respondWith(handleRequest(event.request))
})

上のソースはドメイン内どの URL でも
https://example.net.eu.org/deno/ へ 301 転送します。

async function handleRequest(request) {
  const url = new URL(request.url)
  const { pathname, search } = url
  const destinationURL = "https://example.net.eu.org" + pathname + search
  return Response.redirect(destinationURL, 301)
}

addEventListener("fetch", async event => {
  event.respondWith(handleRequest(event.request))
})

このようにするとプロトコル・ドメイン部分を
https://example.net.eu.org に置き換え、(後ろに / を付けないで下さい)
その後ろは継承して転送します。URL パラメータも含まれます。

この処理はドメイン登録サービスなどでも提供されていますが、
Deno Deploy は 🎈 Let’s Encrypt を発行し、https で転送を行います。
もちろん http からも転送できます。https が常識的になっている中、これは理想的です。

Cloudflare ではページルールでも転送設定ができるため、
Cloudflare Workers でこれを使用するケースは少ないです。

特定場所内の内容を読み込み表示する(プロキシ)

async function handleRequest(request) {
  const url = new URL(request.url)
  const { pathname, search } = url
  const destinationURL = "https://example.net.eu.org/deno" + pathname + search
  return await fetch(destinationURL.toString(), request)
}

addEventListener("fetch", event => {
  event.respondWith(handleRequest(event.request))
})

https://ドメイン/ 参照時に https://example.net.eu.org/deno/ を参照します。
下層ディレクトリ・ファイルおよび URL パラメータも継承されます。

import { h, serveStatic, serve } from "https://deno.land/x/[email protected]/mod.ts";

serve({
  "/:filename*": serveStatic("https://example.net.eu.org/deno/", { cache: false }),
});

同じ動作を  Sift で実現した例です。
serveStatic() では URL パラメータを引き継ぎません。別の方法を用いる必要があります。
また Sift は 404 の時に独自の表示へ置き換えるので、その時の表示が異なります。

この方法を用いて https://プロジェクト.deno.dev/ で
Web サイトなどを表示する事が可能です。
また、独自ドメインを設定する事で、
独自ドメインを設定できないサーバ・Web サービスから配信して、
独自ドメインを適用する事ができます。


Sift

 satyarohith/sift | GitHub

Deno Deploy で使用できる簡易ルータです。

import { serve } from "https://deno.land/x/[email protected]/mod.ts";

serve({
  "/:filename*": serveStatic("/deno/", { baseUrl: "https://example.net.eu.org/" })
});

上のソースで https://example.net.eu.org/deno/ 下を
https://プロジェクト.deno.dev/ で表示できるようになります。

Sift では :filename が特殊な動作で、URL の後ろに付けられます。
ここでは /:filename* としているので、/ も対象になります。
Sift の README は /:filename+ で、/ は対象外です。

serve({
  "/:filename*": serveStatic("https://example.net.eu.org/deno/")
});

Sift のサンプルを見ると baseUrl が必須のように見えますが、
単に URL() へ引き継いでいる仕様で、baseUrl は省略できるので、
上のように URL をフル表記する事が可能です。

import { serve } from "https://deno.land/x/[email protected]/mod.ts";

serve({
  "/": serveStatic("public/index.html", { baseUrl: import.meta.url }),
  "/:filename*": serveStatic("public", { baseUrl: import.meta.url })
});

baseUrl: import.meta.url として、
Deploy URL または Github URL で .js または .ts ファイルを読み込んだ場所を
カレントとして処理できます。カレントそのものであれば . を使用できます。

serve({
  404: () => new Response("Not Found", { status: 404 })
});

Not Found 時の動作も 404 で指定できます。
ただし 404 参照の段階ですでに URL を参照済みのため
serveStatic は使用できません。
指定がない場合 Sift がソースで用意しているテキスト表示になります。
これで問題なければ、特に 404 を指定する必要はありません。

Response() の文字列は \n で改行し、複数行出力可能です。
status で HTTP ステータス、 headers で HTTP ヘッダーを指定できます。

serve({
  404: async () => await fetch("https://example.net.eu.org/deno/404.html"),
});

カスタムページを出力したい場合は fetch() を用いる必要があります。
Git を用いる場合は RAW から取得するため、HTML ファイルは text/plain になり、
意図した状態で出力されない場合があるので、ご注意下さい。

なお、日本語のフォルタ・ファイルも正常に動作します。


独自ドメイン

Deno Deploy Web から プロジェクトを選択した後、
Settings - 左サイドバー Domains を選択します。

使用したいドメイン名を入力し Add を選択して一覧に追加します。
ここでは www.example.net など、サブドメインが必要な場合は
サブドメインを含めたドメイン名にして下さい。

追加したドメイン名を選択すると「DNS RECORDS」が表示されています。
A・AAAA・TXT レコードの 3 つです。これらを全てネームサーバへ登録します。

正常に登録されていると、無料の SSL 証明書 🎈 Let’s Encrypt の発行を行い、
設定した独自ドメインが SSL で参照できるようになります。
ページ運営者が確認した感じだと、ネームサーバの TTL が比較的短時間であれば、
Deno Deploy 側で素早く認識して、すぐに証明書を発行する事ができました。
必要な場合は任意の SSL 証明書へ変更する事も可能になっています。

🎈 EU.org は設定できない事をページ運営者が確認できています。
一部のドメイン・サブドメインはあえて登録できないようにしてある可能性があります。


制限

🦕 Pricing & Limits | Deno Deploy Docs

項目 制限
リクエスト数 1 分 1000 リクエスト
1 日 100000 リクエスト
メモリ 256MB
CPU 時間 1 リクエスト 50 ミリ秒
環境変数 8KB
ES モジュール デプロイ毎に 1000
.ts・.fs サイズ 20MB
デプロイ回数 1 時間 30 回
独自ドメイン 50

Deno Deploy は今のところ制限に関連した使用量の確認手段がありません。

リクエスト数は参照数に直結となります。

デプロイ回数はプロジェクト数が多くなってくると制限に達するでしょう。
可能な場合はローカルで確認するようにします。

独自ドメインは プロジェクト.deno.dev を含まない数でしょう。


Q&A

Deno Deploy のサーバはどこにありますか?

🦕 Regions | Deno Deploy Docs

世界各所にサーバがあります。日本の場合東京と大阪にあります。
そのため、日本ではレスポンスが素早いのを期待できます。

ページ運営者が日本から確認している限りだと、2021年6月現在
API の互換性がある Cloudflare Workers とほぼ変わらないレスポンスでした。
ただし、世界中で利用される前提だとサーバの違いにより、
使用場所によって可変があるはずですし、
独自ドメインの設定や外部サーバの参照などでレスポンス速度は変わってきます。

Cloudflare Workers との違いは何ですか?

 Cloudflare Workers
🎈 Cloudflare Workers | ふうせん🎈 FU-SEN

API では互換性がありますが、
Cloudflare Workers では Cloudflare 管理のドメインと連動し、
ドメイン内の IRL で実行できる範囲で細かく指定できます。
また、データベース KV が存在し、ファイルも保存ができます。
これを活かして静的サイトが公開できる Workers Site も提供されています。
また、Cloudflare の機能は多彩なので、Cloudflare Workers を使用しなくても
代用できる機能が存在します。(例えば転送はページルールで実現できます)

Deno Deploy は公開されたてなので、ここまで環境が整っていません。
簡易ルータなど、Deno Deploy 向けのライブラリも今のところはまだ限定的で、
本当に .js・.ts ソースレベルでの操作が今のところはメインとなります。
Deno Deploy 専用で開発されたソースの一部は include されていて、
これは Cloudflare Workers で動作しないケースがあります。
(クイック編集では include されたソースは使用不可)

その点で Cloudflare Workers と Deno Deploy で
主要になってくるソースが変わってきますし、用途も変わってくるでしょう。

Cloudflare Workers のソース編集経験がある場合、Deno Deploy も使用できるでしょう。
そうでなければ、独特の API などを知るため、慣れるまでは日数を要するでしょう。