翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。 # JavaScript を使用する次の JavaScript ウェブページの例では、ユーザーがイメージを選択し、そのイメージで検出された顔の推定年齢を表示することを許可します。推定年齢は [DetectFaces](https://docs.aws.amazon.com/rekognition/latest/APIReference/API_DetectFaces.html) を呼び出すと返されます。選択したイメージは、JavaScript の `FileReader.readAsDataURL` 関数を使用してロードされます。これに伴って、イメージは base64 でエンコードされます。これは、HTML キャンバスでイメージを表示するのに役立ちます。ただし、イメージバイトを Amazon Rekognition Image オペレーションに渡す前にエンコードされていない状態にする必要があります。この例では、ロードされたイメージバイトをエンコードされていない状態にする方法を示しています。エンコードされたイメージバイトが有用でない場合は、代わりにロードされたイメージがエンコードされない `FileReader.readAsArrayBuffer` を使用します。つまり、最初にイメージバイトをエンコードされていない状態にする処理なしで、Amazon Rekognition Image オペレーションを呼び出すことができます。例については、[readAsArrayBuffer を使用する](#image-bytes-javascript-unencoded)を参照してください。 **JavaScript の例を実行するには** 1. ソースコード例をエディタにロードします。 1. Amazon Cognito identity プールの識別子を取得します。詳細については、「[Amazon Cognito identity プールの識別を取得します。](#image-bytes-javascript-auth)」を参照してください。 1. コード例の `AnonLog` 関数で、`IdentityPoolIdToUse` と `RegionToUse` は「[Amazon Cognito identity プールの識別を取得します。](#image-bytes-javascript-auth)」のステップ 9 で書き留めた値に変更します。 1. `DetectFaces` 関数の `RegionToUse` を、前のステップで使用した値に変更します。 1. ソースコード例を `.html` ファイルとして保存します。 1. ブラウザにファイルをロードします。 1. [**参照...**] ボタンを選択して、1 つ以上の顔が含まれたイメージを選択します。イメージ内で検出された顔ごとの推定年齢が含まれたテーブルが表示されます。 **注記** 以下のコード例では、Amazon Cognito に含まれなくなった 2 つのスクリプトを使用しています。これらのファイルを取得するには、[aws-cognito-sdk.min.js](https://raw.githubusercontent.com/aws/amazon-cognito-identity-js/master/dist/aws-cognito-sdk.js) および [amazon-cognito-identity.min.js](https://raw.githubusercontent.com/aws/amazon-cognito-identity-js/master/dist/amazon-cognito-identity.min.js) のリンクをたどり、それぞれのテキストを個別の `.js` ファイルとして保存します。 ## JavaScript のコード例次のコード例では JavaScript V2 を使用しています。JavaScript V3 の例については、[AWS 「Documentation SDK examples GitHub repository」の「例」を参照してください。](https://github.com/awsdocs/aws-doc-sdk-examples/tree/master/javascriptv3/example_code/rekognition/estimate-age-example/src) ``` Rekognition

Age Estimator

``` ### readAsArrayBuffer を使用する次のコードスニペットは、JavaScript V2 を使用したサンプルコード内の `ProcessImage` 関数の代替の実装です。`readAsArrayBuffer` を使用してイメージを読み込み、`DetectFaces` を呼び出します。ロードしたファイルは `readAsArrayBuffer` で base64 エンコードされないため、Amazon Rekognition オペレーションを呼び出す前にイメージのバイトをエンコード解除する必要はありません。 ``` //Copyright 2018 Amazon.com, Inc. or its affiliates. All Rights Reserved. //PDX-License-Identifier: MIT-0 (For details, see https://github.com/awsdocs/amazon-rekognition-developer-guide/blob/master/LICENSE-SAMPLECODE.) function ProcessImage() { AnonLog(); var control = document.getElementById("fileToUpload"); var file = control.files[0]; // Load base64 encoded image for display var reader = new FileReader(); reader.onload = (function (theFile) { return function (e) { //Call Rekognition AWS.region = "RegionToUse"; var rekognition = new AWS.Rekognition(); var params = { Image: { Bytes: e.target.result }, Attributes: [ 'ALL', ] }; rekognition.detectFaces(params, function (err, data) { if (err) console.log(err, err.stack); // an error occurred else { var table = ""; // show each face and build out estimated age table for (var i = 0; i < data.FaceDetails.length; i++) { table += ''; } table += "

Low	High
' + data.FaceDetails[i].AgeRange.Low + '	' + data.FaceDetails[i].AgeRange.High + '

"; document.getElementById("opResult").innerHTML = table; } }); }; })(file); reader.readAsArrayBuffer(file); } ``` ## Amazon Cognito identity プールの識別を取得します。わかりやすいように、この例では、匿名の Amazon Cognito identity プールを使用して、 Amazon Rekognition Image API に認証されていないアクセスを提供します。これは、お客様のニーズに適している場合もあります。たとえば、認証されていないアクセスを使用して、ユーザーがサインアップする前に、無料または試用でウェブサイトにアクセスできるようにできます。認証されたアクセスを提供するには、Amazon Cognito ユーザープールを使用します。詳細については、[Amazon Cognito ID ユーザープール](https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-identity-pools.html) を参照してください。以下の手順では、認証されていない ID へのアクセスを有効にする ID プールを作成する方法と、コード例で必要な ID プールの ID を取得する方法を説明します。 **ID プールの ID を取得するには** 1. [Amazon Cognito コンソール](https://console.aws.amazon.com/cognito/federated)を開きます。 1. [**Create new identity pool**] を選択します。 1. [**ID プール名\$1**] に ID プールの名前を入力します。 1. [**認証されていない ID**] で、[**認証されていない ID に対してアクセスを有効にする**] を選択します。 1. **[プールの作成]** を選択します。 1. [**詳細の表示**] を選択して、認証されていない ID のロール名をメモします。 1. [**許可**] を選択します。 1. [**プラットフォーム**] で [**JavaScript**] を選択します。 1. [**AWS 認証情報の取得**] で、コードスニペットに表示される `AWS.config.region` と `IdentityPooldId` の値をメモします。 1. IAM コンソール ([https://console.aws.amazon.com/iam/](https://console.aws.amazon.com/iam/)) を開きます。 1. ナビゲーションペインで **Roles (ロール) ** を選択してください。 1. ステップ 6 で書き留めたロール名を選択します。 1. [**アクセス許可**] タブで、[**ポリシーのアタッチ**] を選択します。 1. [**AmazonRekognitionReadOnlyAccess**] を選択します。 1. ［**ポリシーをアタッチ**] を選択します。