--- id: bd7158d8c443edefaeb5bd0f title: ファイルメタデータ マイクロサービス challengeType: 4 forumTopicId: 301506 dashedName: file-metadata-microservice --- # --description-- と同様の機能を持つフルスタック JavaScript アプリを構築してください。 プロジェクトに取り組むにあたり、以下の方法のうち 1 つを用いてコードを記述します。 - [GitHub リポジトリ](https://github.com/freeCodeCamp/boilerplate-project-filemetadata/)をクローンし、ローカル環境でプロジェクトを完了させる。 - [Replit 始動プロジェクト](https://replit.com/github/freeCodeCamp/boilerplate-project-filemetadata)を使用して、プロジェクトを完了させる。 - 使い慣れたサイトビルダーを使用してプロジェクトを完了させる。 必ず GitHub リポジトリのすべてのファイルを取り込む。 完了したら、プロジェクトの動作デモをどこか公開の場にホストしてください。 そして、`Solution Link` フィールドでデモへの URL を送信してください。 必要に応じて、プロジェクトのソースコードへのリンクも、`GitHub Link` フィールドへ提出してください。 # --instructions-- ** ヒント: ** `multer` npm パッケージを使用してファイルのアップロードを処理することができます。 # --hints-- サンプルの URL ではなく、自分で作成したプロジェクトを提供する必要があります。 ```js (getUserInput) => { assert( !/.*\/file-metadata-microservice\.freecodecamp\.rocks/.test( getUserInput('url') ) ); }; ``` ファイルのアップロードを含むフォームを送信できます。 ```js async (getUserInput) => { const site = await fetch(getUserInput('url')); const data = await site.text(); const doc = new DOMParser().parseFromString(data, 'text/html'); assert(doc.querySelector('input[type="file"]')); }; ``` フォームのファイル入力フィールドの `name` 属性を `upfile` に設定します。 ```js async (getUserInput) => { const site = await fetch(getUserInput('url')); const data = await site.text(); const doc = new DOMParser().parseFromString(data, 'text/html'); assert(doc.querySelector('input[name="upfile"]')); }; ``` ファイルを送信すると、JSON レスポンスの中で `name`、`type` および `size` (バイト単位) を受け取ります。 ```js async (getUserInput) => { const formData = new FormData(); const fileData = await fetch( 'https://cdn.freecodecamp.org/weather-icons/01d.png' ); const file = await fileData.blob(); formData.append('upfile', file, 'icon'); const data = await fetch(getUserInput('url') + '/api/fileanalyse', { method: 'POST', body: formData }); const parsed = await data.json(); assert.property(parsed, 'size'); assert.equal(parsed.name, 'icon'); assert.equal(parsed.type, 'image/png'); }; ``` # --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. */ ```