CloudFlare WorkersでAPI情報を秘匿するProxyを建てる

CloudFlare Workersとは

CDNなど提供するCloudFlareが提供するエッジコンピューティング・サーバーレスサービスです。

CloudFlare Workers

JavaScript、Rust、C、C++ などをCloudFlareのエッジサーバーで実行することができます。

今回は、APIエンドポイントへのアクセスして結果を返すだけ（要はプロキシする）サーバーを、JavaScriptで立ててみます。

事前準備

CloudFlare Workersの使い方は、下記の記事が詳しいのでそちらの通りに進めます。

無料で使えるエッジコンピューティングサーバー・Cloudflare Workersで簡易APIを立ててみる

wrangler initして、account_idを入れるところまでできていればOKです。

wrangler.tomlは下記のようになります。

name = "proxy-worker"
type = "webpack"
account_id = "CloudFlare WorkersのアカウントID"
workers_dev = true
route = ""
zone_id = ""

type = “webpack”だけあれば動きます。

APIプログラムを書く

基本的には、

• Webサーバー・アプリからCloudFlare Workersで構築したAPIを叩く
• 本番APIのエンドポイントを叩いてリクエストを返す

という形です。やっていることはただのプロキシですが、

• APIエンドポイントを秘匿できる
• APIシークレットを秘匿できる

というメリットがあります。

また、サーバーレスDBなどを使っている場合は、DBサービスの変更に伴うAPIエンドポイントの変更があった時に、アプリ側の変更をせずにClouldFlare Workers側のエンドポイントURLを変更するだけで済むため、メンテナンス性も向上します。

Proxyを建てる

index.jsを用意します。

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

const apiUrl = 'https://xxxxxx.xxx'
const reqHeaders = { 'content-type': 'application/json', 'Access-Control-Allow-Origin': '*' }

async function handleRequest(request) {
  const data = await request.json()
  const params = JSON.stringify(data)

  const result = await fetch(apiUrl, {
    headers: { 'Authorization': 'Bearer ' + SECRET, 'Content-Type': 'application/json'},
    method: 'POST',
    body: params
  })
  .catch((e) => { throw Error(e); })
  .then(function(res) {
    return res.json()
  })

  if(result.errors){
    return new Response(JSON.stringify({error: result.errors}), {
      headers: reqHeaders,
    })
  }else{
    return new Response(JSON.stringify({id: result.data.createDeliver.id}), {
      headers: reqHeaders,
    })
  }
}

やっていることは簡単で、

• 受け取ったPOSTリクエストBodyをそのままAPI受け流す
• 返却したデータをJSONで返す

ということをしているだけです。

こうすることで、APIのエンドポイントは独自ドメインに設定できるので、本番APIのエンドポイントAPIを秘匿できます。

環境変数を追加する

プログラム中の「SECRET」は、CloudFlareの環境変数で、ここにAPIのAuth Keyを格納します。

これは、wranglerコマンドから一発でできます。

wrangler secret put SECRET

「SECRET」は環境変数名で、自由に決められます。

Enter the secret text you'd like assigned to the variable SECRET on the script named xxxx:

と出てきたら、シークレットをコピペしてエンターを押せば、CloudFlare Workersに環境変数が登録されます。

これで、APIシークレットも秘匿できました。

プロキシサーバーを公開する

あとは、公開するだけです。

wrangler publish

簡単ですね。

独自ドメインとの連携はこちらの記事がわかりやすいです。

Cloudflare Workersを独自ドメイン・サブドメインで使う方法

–

簡単なものですが、CloudFlare WorkersでAPI情報を秘匿するProxyを建てて見ました。

データ操作に関わるAPIの場合、ユーザーから秘匿する必要があるケースが多くあるので、こうしたプロキシサーバーが簡単に建てられるのは嬉しいですね。