Axios または Fetch を使用して JavaScript で短い URL を長い URL に変換する方法

短い URL を長い URL に変換することは、Web 開発、特にリダイレクトを扱う場合の一般的なタスクです。この記事では、JavaScript と 2 つの人気のあるライブラリ、Axios と Fetch API を使用してこれを実現する方法を説明します。短縮された TikTok リンクから完全な URL を取得する方法を示します。

Axios を使用する

Axios は、ブラウザーおよび Node.js 用の Promise ベースの HTTP クライアントです。以下は、Axios を使用して短い URL を長い形式に変換する方法の簡単な例です。

axios("https://vt.tiktok.com/ZS6yXCpvq/")
  .then(res => console.log(`Axios获取的完整URL: ${res.request.res.responseUrl}`))
  .catch(err => console.error(err));

// Axios によって取得された完全な URL: https://www.php.cn/link/99ec8b626a47132c52969dd081cdd808

手順:

• axios() を使用して、短縮 URL の GET リクエストを開始します。
• 成功すると、応答オブジェクトには res.request.res.responseUrl プロパティが含まれ、リダイレクト後の完全な URL が保持されます。
• リクエスト中にエラーが発生した場合、そのエラーは catch ブロックで捕捉され、エラー メッセージが記録されます。

フェッチを使用する

Fetch API は、ネットワーク リクエストを行うためのより現代的な方法を提供します。これを使用して同じ結果を得る方法は次のとおりです:

fetch("https://vt.tiktok.com/ZS6yXCpvq/")
  .then(res => res.text())
  .then(data => console.log(`Fetch获取的完整URL: ${data}`))
  .catch(err => console.error(err));

// Fetch によって取得された完全な URL: https://www.php.cn/link/99ec8b626a47132c52969dd081cdd808

手順:

• fetch() 関数は、指定された URL へのリクエストを開始します。
• res.url プロパティには、リダイレクト後の最終 URL が含まれます。 (注: 元の回答での res.url の使用は正確ではない可能性があります。実際の状況に応じて、最終 URL を取得するには res.text() を使用する必要があります)
• Axios と同様に、エラーは catch ブロックで処理されます。

結論

Axios と Fetch はどちらも、JavaScript で短い URL を長い URL に変換する簡単な方法を提供します。 Axios はインターセプターや自動 JSON データ変換などの追加機能を提供しますが、Fetch は最新のブラウザーに組み込まれており、基本的なリクエストには強力です。プロジェクトのニーズに応じて、URL リダイレクトを処理する方法を選択できます。

以上がAxios または Fetch を使用して JavaScript で短い URL を長い URL に変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。