JavaScriptでURL短縮サービスを作る：エンコード・デコード関数の実装方法

bit.lyやtinyurlなど、長いURLを受け取って何らかの暗号化処理を施し、非常に短いURLを返すサービスを目にする機会は多いでしょう。そして、その短縮URLを開こうとすると、今度は復号処理が実行されて元のURLへと変換され、目的のページが表示されます。

今回は、まったく同じ仕組みをJavaScriptで実装してみましょう。具体的には、次の2つの関数を用意します。

• encrypt() ― 元の（長い）URLを受け取り、一意な短縮URLを返します。
• decrypt() ― 短縮URLを受け取り、元のURLに関する事前情報を持たない状態でも、元のURLへと復元します。

実装の考え方

ここでは、Node.jsのBufferクラスによるBase64エンコード・デコードを利用します。Base64は可逆変換であるため、エンコード→デコードの往復で必ず元の文字列を復元できるのが特徴です。なお、実際の商用の短縮サービスでは「元URLをデータベースに保存し、短いキーだけを返す」方式が一般的ですが、本記事ではまずエンコード・デコードの基本的な仕組みを理解することを目的とします。

サンプルコード

const url = 'https://developer.mozilla.org/en-US/docs/Web/JavaScript';
const encrypt = (longUrl) => {
  const encodedUrl = Buffer.from(longUrl, 'binary').toString('base64');
  return "https://mydemo.com/" + encodedUrl;
};
const decrypt = function(shortUrl) {
  let encodedUrl = shortUrl.split('mydemo.com/')[1];
  return Buffer.from(encodedUrl, 'base64').toString();
};
const encrypted = encrypt(url);
const decrypted = decrypt(encrypted);
console.log(encrypted);
console.log(decrypted);

実行結果

コンソールには以下のように出力されます。

https://mydemo.com/aHR0cHM6Ly9kZXZlbG9wZXIubW96aWxsYS5vcmcvZW4tVVMvZG9jcy9XZWIvSmF2YVNjcmlwdA==
https://developer.mozilla.org/en-US/docs/Web/JavaScript

コードの解説

encrypt() 関数

Buffer.from(longUrl, 'binary')でURL文字列をバイナリデータとして読み込み、.toString('base64')によってBase64形式の文字列へ変換しています。その先頭に独自ドメイン「mydemo.com」を付けることで、短縮URLらしい形式に仕上げています。

decrypt() 関数

まずsplit('mydemo.com/')でドメイン部分を取り除き、Base64エンコード済みの部分だけを抽出します。続いてBuffer.from(encodedUrl, 'base64')でBase64をデコードし、.toString()により元のURL文字列へと復元しています。

このようにエンコードとデコードがきちんと対になっているため、短縮URLから元のURLを正確に復元できるというわけです。