--- id: bd7158d8c443edefaeb5bd0e title: URL 短縮マイクロサービス challengeType: 4 forumTopicId: 301509 dashedName: url-shortener-microservice --- # --description-- と同様の機能を持つフルスタック JavaScript アプリを構築してください。 プロジェクトに取り組むにあたり、以下の方法のうち 1 つを用いてコードを記述します。 - [GitHub リポジトリ](https://github.com/freeCodeCamp/boilerplate-project-urlshortener/)をクローンし、ローカル環境でプロジェクトを完了させる。 - [Replit 始動プロジェクト](https://replit.com/github/freeCodeCamp/boilerplate-project-urlshortener)を使用して、プロジェクトを完了させる。 - 使い慣れたサイトビルダーを使用してプロジェクトを完了させる。 必ず GitHub リポジトリのすべてのファイルを取り込む。 完了したら、プロジェクトの動作デモをどこか公開の場にホストしてください。 そして、`Solution Link` フィールドでデモへの URL を送信してください。 必要に応じて、プロジェクトのソースコードへのリンクも、`GitHub Link` フィールドへ提出してください。 # --instructions-- ** ヒント: ** POST リクエストを処理するために、ボディ解析ミドルウェアを使用してください。 また、`dns` コアモジュールの `dns.lookup(host, cb)` 関数を使用して、送信された URL を確認することも可能です。 # --hints-- サンプルの URL ではなく、自分で作成したプロジェクトを提供する必要があります。 ```js (getUserInput) => { assert( !/.*\/url-shortener-microservice\.freecodecamp\.rocks/.test( getUserInput('url') ) ); }; ``` `/api/shorturl` へ URL を POST し、`original_url` および `short_url` プロパティを持つ JSON レスポンスを取得できます。 例: `{ original_url : 'https://freeCodeCamp.org', short_url : 1}` ```js async (getUserInput) => { const url = getUserInput('url'); const urlVariable = Date.now(); const fullUrl = `${url}/?v=${urlVariable}` const res = await fetch(url + '/api/shorturl', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: `url=${fullUrl}` }); if (res.ok) { const { short_url, original_url } = await res.json(); assert.isNotNull(short_url); assert.strictEqual(original_url, `${url}/?v=${urlVariable}`); } else { throw new Error(`${res.status} ${res.statusText}`); } }; ``` `/api/shorturl/` へアクセスすると、元の URL にリダイレクトされます。 ```js async (getUserInput) => { const url = getUserInput('url'); const urlVariable = Date.now(); const fullUrl = `${url}/?v=${urlVariable}` let shortenedUrlVariable; const postResponse = await fetch(url + '/api/shorturl', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: `url=${fullUrl}` }); if (postResponse.ok) { const { short_url } = await postResponse.json(); shortenedUrlVariable = short_url; } else { throw new Error(`${postResponse.status} ${postResponse.statusText}`); } const getResponse = await fetch( url + '/api/shorturl/' + shortenedUrlVariable ); if (getResponse) { const { redirected, url } = getResponse; assert.isTrue(redirected); assert.strictEqual(url,fullUrl); } else { throw new Error(`${getResponse.status} ${getResponse.statusText}`); } }; ``` 有効な `http://www.example.com` 形式に従っていない無効な URL を渡すと、JSON レスポンスで `{ error: 'invalid url' }` が返されます。 ```js async (getUserInput) => { const url = getUserInput('url'); const res = await fetch(url + '/api/shorturl', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: `url=ftp:/john-doe.invalidTLD` }); if (res.ok) { const { error } = await res.json(); assert.isNotNull(error); assert.strictEqual(error.toLowerCase(), 'invalid url'); } else { throw new Error(`${res.status} ${res.statusText}`); } }; ``` # --solutions-- ```js /** Backend challenges don't need solutions, because they would need to be tested against a full working project. Please check our contributing guidelines to learn more. */ ```