適用於 JavaScript 的 AWS SDK v2 已end-of-support。我們建議您遷移至 [適用於 JavaScript 的 AWS SDK v3](https://docs.aws.amazon.com//sdk-for-javascript/v3/developer-guide/)。如需如何遷移的其他詳細資訊和資訊，請參閱此[公告](https://aws.amazon.com/blogs//developer/announcing-end-of-support-for-aws-sdk-for-javascript-v2/)。

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 設定 登入資料
<a name="setting-credentials"></a>

AWS 使用登入資料來識別誰正在呼叫 服務，以及是否允許存取請求的資源。

不論是在 web 瀏覽器或 Node.js 伺服器上執行，JavaScript 程式碼必須包含有效的登入資料，才能透過 API 存取服務。您可以使用 `AWS.Config` 或依服務，透過將登入資料直接傳遞至服務物件，在組態物件上全域設定登入資料。

有幾個方式可以來設定在 web 瀏覽器中 Node.js 和 JavaScript 之間不同的登入資料。本節的主題說明如何在 Node.js 或 Web 瀏覽器設定登入資料。在每個案例中，選項會以建議的順序呈現。

## 登入資料的最佳實務
<a name="credentials-best-practices"></a>

適當設定登入資料可確保您的應用程式或瀏覽器指令碼可以存取所需的服務與資源，同時將可能影響關鍵任務應用程式或洩漏敏感資料的安全性問題的接觸降到最低。

在特定登入資料時要套用的重要原則，即是一律授予任務所需的最低權限。提供資源的最低許可並視需要新增進一步許可是較安全的作法，而不是提供超過最低權限的許可，而造成您必須修復在稍後可能發現的安全性問題。例如，除非您需要讀取和寫入個別資源，例如 Amazon S3 儲存貯體或 DynamoDB 資料表中的物件，否則請將這些許可設定為唯讀。

如需授予最低權限的詳細資訊，請參閱《*IAM 使用者指南*》中最佳實務主題的[授予最低權限](https://docs.aws.amazon.com/IAM/latest/UserGuide/best-practices.html#grant-least-privilege)一節。

**警告**  
如果這麼做是可行的，我們建議您不要將登入資料寫死在應用程式或瀏覽器指令碼中。硬式編碼登入資料會造成暴露敏感資訊的風險。

如需如何管理存取金鑰的詳細資訊，請參閱《》中的[管理 AWS 存取金鑰的最佳實務](https://docs.aws.amazon.com/general/latest/gr/aws-access-keys-best-practices.html) AWS 一般參考。

**Topics**
+ [登入資料的最佳實務](#credentials-best-practices)
+ [在 Node.js 設定登入資料](setting-credentials-node.md)
+ [在 Web 瀏覽器中設定登入資料](setting-credentials-browser.md)

# 在 Node.js 設定登入資料
<a name="setting-credentials-node"></a>

在 Node.js 中將登入資料提供給軟體開發套件有幾種方法。有些方法比較安全，有些在開發應用程式時更方便。在 Node.js 中取得登入資料時，對於依賴不只一個來源 (像是環境變數和您載入的 JSON 檔案) 時請小心。您可以變更程式碼執行所用的許可，而不需了解發生的變更。

以下是您可以提供登入資料的方法，依建議順序列出：

1. 從 Amazon EC2 的 AWS Identity and Access Management (IAM) 角色載入

1. 從共享登入資料檔案 (`~/.aws/credentials`) 載入。

1. 從環境變數中載入

1. 從磁碟上的 JSON 檔案載入

1. JavaScript 開發套件提供的其他登入資料提供者類別

如果開發套件有不只一個登入資料來源，預設的選擇順序如下：

1. 透過服務客戶建構函數明確設定的登入資料

1. 環境變數

1. 共享登入資料檔案

1. 從 ECS 登入資料提供者 (若適用的話) 載入的登入資料

1. 使用共用 AWS 組態檔案或共用登入資料檔案中指定的登入資料程序取得的登入資料。如需詳細資訊，請參閱[使用所設定的登入資料程序在 Node.js 中載入登入資料](loading-node-credentials-configured-credential-process.md)。

1. 使用 AWS Amazon EC2 執行個體的登入資料提供者從 IAM 載入的登入資料 （如果在執行個體中繼資料中設定）

如需詳細資訊，請參閱 API 參考[https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CredentialProviderChain.html](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CredentialProviderChain.html)中的 [https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/Credentials.html](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/Credentials.html)和 。

**警告**  
雖然可以這樣做，但不建議硬式編碼應用程式中的 AWS 登入資料。將登入資料寫死會造成存取金鑰 ID 和私密存取金鑰遭暴露的風險。

本節的主題說明如何在 Node.js 中載入登入資料。

**Topics**
+ [從 Amazon EC2 的 IAM 角色載入 Node.js 中的登入資料](loading-node-credentials-iam.md)
+ [載入 Node.js Lambda 函數的登入資料](loading-node-credentials-lambda.md)
+ [從共用登入資料檔案中在 Node.js 中載入登入資料](loading-node-credentials-shared.md)
+ [從環境變數在 Node.js 中載入登入資料](loading-node-credentials-environment.md)
+ [從 JSON 檔案中在 Node.js 中載入登入資料](loading-node-credentials-json-file.md)
+ [使用所設定的登入資料程序在 Node.js 中載入登入資料](loading-node-credentials-configured-credential-process.md)

# 從 Amazon EC2 的 IAM 角色載入 Node.js 中的登入資料
<a name="loading-node-credentials-iam"></a>

如果您在 Amazon EC2 執行個體上執行 Node.js 應用程式，您可以利用 Amazon EC2 的 IAM 角色自動提供登入資料給執行個體。如果您將執行個體設定為使用 IAM 角色，開發套件會自動選取應用程式的 IAM 登入資料，無需手動提供登入資料。

如需將 IAM 角色新增至 Amazon EC2 執行個體的詳細資訊，請參閱 *AWS SDKs和工具參考指南*中的[為 Amazon EC2 執行個體使用 IAM 角色](https://docs.aws.amazon.com/sdkref/latest/guide/access-iam-roles-for-ec2.html)。

# 載入 Node.js Lambda 函數的登入資料
<a name="loading-node-credentials-lambda"></a>

建立 AWS Lambda 函數時，您必須建立具有執行函數許可的特殊 IAM 角色。此角色稱為*執行角色*。設定 Lambda 函數時，您必須指定您建立的 IAM 角色做為對應的執行角色。

執行角色提供 Lambda 函數執行 和 呼叫其他 Web 服務所需的登入資料。因此，您不需要提供登入資料給在 Lambda 函數中寫入的 Node.js 程式碼。

如需建立 Lambda 執行角色的詳細資訊，請參閱《 *AWS Lambda 開發人員指南*》中的[管理許可：使用 IAM 角色 （執行角色）](https://docs.aws.amazon.com/lambda/latest/dg/intro-permission-model.html#lambda-intro-execution-role)。

# 從共用登入資料檔案中在 Node.js 中載入登入資料
<a name="loading-node-credentials-shared"></a>

您可以將 AWS 登入資料保留在 SDKs和命令列界面所使用的共用檔案中。載入適用於 JavaScript 的 SDK 時，會自動搜尋名為「憑證」的共用登入資料檔案。共用登入資料檔案保存位置取決於您的作業系統：
+ 在 Linux、Unix 和 macOS 上的共用登入資料檔案：`~/.aws/credentials`
+ 在 Windows 上的共用登入資料檔案：`C:\Users\USER_NAME\.aws\credentials`

如果您還沒有共用的登入資料檔案，請參閱[使用 進行 SDK 身分驗證 AWS](getting-your-credentials.md)。完成這些指示之後，您應該會在登入資料檔案中看到類似下列的文字，其中 *<YOUR\$1ACCESS\$1KEY\$1ID>* 是您的存取金鑰 ID, 而 *<YOUR\$1SECRET\$1ACCESS\$1KEY>* 是您的私密存取金鑰：

```
[default]
aws_access_key_id = <YOUR_ACCESS_KEY_ID>
aws_secret_access_key = <YOUR_SECRET_ACCESS_KEY>
```

如需使用此檔案的使用範例，請參閱[Node.js 入門](getting-started-nodejs.md)。​

`[default]` 區段標題指定預設設定檔和登入資料的相關值。您可以在相同的共用組態檔中建立其他設定檔，每個設定檔包含其專屬的登入資料資訊。下列範例顯示具有預設設定檔和兩個其他設定檔的組態檔：

```
[default] ; default profile
aws_access_key_id = <DEFAULT_ACCESS_KEY_ID>
aws_secret_access_key = <DEFAULT_SECRET_ACCESS_KEY>
    
[personal-account] ; personal account profile
aws_access_key_id = <PERSONAL_ACCESS_KEY_ID>
aws_secret_access_key = <PERSONAL_SECRET_ACCESS_KEY>
    
[work-account] ; work account profile
aws_access_key_id = <WORK_ACCESS_KEY_ID>
aws_secret_access_key = <WORK_SECRET_ACCESS_KEY>
```

依預設，軟體開發套件會檢查 `AWS_PROFILE` 環境變數來判斷要使用哪個設定檔。如果未在您的環境中設定 `AWS_PROFILE` 變數，軟體開發套件會使用 `[default]` 設定檔的登入資料。若要使用其他設定檔的登入資料，請設定或變更 `AWS_PROFILE` 環境變數的值。例如上述的組態檔案，若要使用工作帳戶的登入資料，請將 `AWS_PROFILE` 環境變數設定為​ `work-account` (對應您的作業系統)。​

**注意**  
設定環境變數之後，請務必採取適當的動作 (根據作業系統需求)，讓您的變數可在 shell 或命令環境使用。

設定環境變數 （如有需要） 之後，您可以執行使用 SDK 的 JavaScript 檔案，例如名為 的檔案`script.js`。

```
$ node script.js
```

您也可以擇一在載入軟體開發套件前設定 `process.env.AWS_PROFILE`，或選取以下範例中所示的登入資料供應商，來明確選取軟體開發套件所用的設定檔：

```
var credentials = new AWS.SharedIniFileCredentials({profile: 'work-account'});
AWS.config.credentials = credentials;
```

# 從環境變數在 Node.js 中載入登入資料
<a name="loading-node-credentials-environment"></a>

SDK 會自動偵測您環境中設定為變數的 AWS 登入資料，並將其用於 SDK 請求，無需在應用程式中管理登入資料。您設為提供登入資料的環境變數為：
+ `AWS_ACCESS_KEY_ID`
+ `AWS_SECRET_ACCESS_KEY`
+ `AWS_SESSION_TOKEN`

如需設定環境變數的詳細資訊，請參閱 *AWS SDKs和工具參考指南*中的[環境變數支援](https://docs.aws.amazon.com/sdkref/latest/guide/environment-variables.html)。

# 從 JSON 檔案中在 Node.js 中載入登入資料
<a name="loading-node-credentials-json-file"></a>

您可以使用 `AWS.config.loadFromPath`，從磁碟上的 JSON 文件載入組態和登入資料。指定的路徑是相對於程序的目前工作目錄。例如，若要從包含以下內容的 `'config.json'` 檔案載入登入資料：

```
{ "accessKeyId": <YOUR_ACCESS_KEY_ID>, "secretAccessKey": <YOUR_SECRET_ACCESS_KEY>, "region": "us-east-1" }
```

然後使用下列程式碼：

```
var AWS = require("aws-sdk");
AWS.config.loadFromPath('./config.json');
```

**注意**  
從 JSON 文件載入組態資料會重設所有現有組態資料。在使用此技術後新增其他組態資料。從瀏覽器指令碼不支援的 JSON 文件中載入登入資料。

# 使用所設定的登入資料程序在 Node.js 中載入登入資料
<a name="loading-node-credentials-configured-credential-process"></a>

您可以使用沒有內建在軟體開發套件中的方法取得登入資料。若要這樣做，請在共用 AWS 組態檔案或共用登入資料檔案中指定登入資料程序。如果`AWS_SDK_LOAD_CONFIG`環境變數設定為任何值，則 SDK 會偏好組態檔案中指定的程序，而不是登入資料檔案中指定的程序 （如果有的話）。

如需在共用 AWS 組態檔案或共用登入資料檔案中指定登入資料程序的詳細資訊，請參閱 *AWS CLI 命令參考*，特別是[從外部程序取得登入](https://docs.aws.amazon.com/cli/latest/topic/config-vars.html#sourcing-credentials-from-external-processes)資料的相關資訊。

如需使用 `AWS_SDK_LOAD_CONFIG` 環境變數的相關資訊，請參閱本文件中的[使用共用組態檔](setting-region.md#setting-region-config-file)。

# 在 Web 瀏覽器中設定登入資料
<a name="setting-credentials-browser"></a>

透過瀏覽器指令碼將登入資料提供給軟體開發套件有幾種方法。有些方法比較安全，有些在開發指令碼時更方便。以下是您可以提供登入資料的方法，依建議順序列出：

1. 使用 Amazon Cognito Identity 驗證使用者並提供登入資料

1. 使用 Web 聯合身分

1. 在指令碼中將程式碼寫死

**警告**  
我們不建議硬式編碼指令碼中的 AWS 登入資料。將登入資料寫死會造成存取金鑰 ID 和私密存取金鑰遭暴露的風險。

**Topics**
+ [使用 Amazon Cognito Identity 驗證使用者](loading-browser-credentials-cognito.md)
+ [使用 Web 聯合身分來驗證使用者](loading-browser-credentials-federated-id.md)
+ [Web 聯合身分範例](config-web-identity-examples.md)

# 使用 Amazon Cognito Identity 驗證使用者
<a name="loading-browser-credentials-cognito"></a>

為瀏覽器指令碼取得 AWS 登入資料的建議方法是使用 Amazon Cognito Identity 登入資料物件 `AWS.CognitoIdentityCredentials`。Amazon Cognito 透過第三方身分提供者啟用使用者身分驗證。

若要使用 Amazon Cognito Identity，您必須先在 Amazon Cognito 主控台中建立身分集區。身分集區代表應用程式提供給使用者的身分群組。提供給使用者的身分可唯一識別每個使用者帳戶。Amazon Cognito 身分不是憑證。在 AWS Security Token Service () 中使用 Web 聯合身分支援交換憑證AWS STS。

Amazon Cognito 可協助您使用 `AWS.CognitoIdentityCredentials` 物件管理多個身分提供者的身分抽象。接著，會將載入的身分交換為在 AWS STS中的登入資料。

## 設定 Amazon Cognito 身分登入資料物件
<a name="browser-cognito-configuration"></a>

如果您尚未建立身分集區，請在設定 之前，在 [Amazon Cognito 主控台](https://console.aws.amazon.com/cognito)中建立身分集區以與瀏覽器指令碼搭配使用`AWS.CognitoIdentityCredentials`。建立身分集區的已驗證和未驗證 IAM 角色，並將其建立關聯。

未經授權的使用者的身分未經驗證，因此這個角色適用於您應用程式的訪客使用者，或使用者身分是否已驗證並不重要的情況。已驗證使用者透過驗證其身分的第三方身分提供者來登入應用程式。請務必適當地限制資源許可範圍，以避免從未經授權的使用者授與資源的存取權。

在您以連接的身分提供者設定身分集區之後，您可以使用 `AWS.CognitoIdentityCredentials` 來驗證使用者。若要設定您的應用程式登入資料使用 `AWS.CognitoIdentityCredentials`，請將 `credentials` 屬性設定為 `AWS.Config` 或每個服務的組態。以下範例使用 `AWS.Config`：

```
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
  IdentityPoolId: 'us-east-1:1699ebc0-7900-4099-b910-2df94f52a030',
  Logins: { // optional tokens, used for authenticated login
    'graph.facebook.com': 'FBTOKEN',
    'www.amazon.com': 'AMAZONTOKEN',
    'accounts.google.com': 'GOOGLETOKEN'
  }
});
```

選用的 `Logins` 屬性是身分提供者名稱與這些身分提供者的身分權杖的對應。您從身分提供者取得權杖的方式，取決於您使用的供應商。例如，如果 Facebook 是您的身分提供者之一，您可以使用 `FB.login`Facebook 開發套件[的 ](https://developers.facebook.com/docs/facebook-login/web) 函數來取得身分提供者權杖：

```
FB.login(function (response) {
  if (response.authResponse) { // logged in
    AWS.config.credentials = new AWS.CognitoIdentityCredentials({
      IdentityPoolId: 'us-east-1:1699ebc0-7900-4099-b910-2df94f52a030',
      Logins: {
        'graph.facebook.com': response.authResponse.accessToken
      }
    });

    s3 = new AWS.S3; // we can now create our service object

    console.log('You are now logged in.');
  } else {
    console.log('There was a problem logging you in.');
  }
});
```

## 將未經驗證的使用者切換為經驗證的使用者
<a name="browser-switching-unauthenticated-users"></a>

Amazon Cognito 支援已驗證和未驗證的使用者。未驗證的使用者即使沒有以任何身分提供者登入，也能存取您的資源。這個程度的存取能在使用者登入前就顯示內容，非常有用。每個未驗證的使用者在 Amazon Cognito 中都有唯一的身分，即使他們尚未個別登入和驗證。

### 最初未驗證的使用者
<a name="browser-switching-initially-unauthenticated-user"></a>

使用者通常會以未經驗證的角色開始，您會為該角色設定組態物件的登入資料屬性，而不使用 `Logins` 屬性。在這種情況下，您的預設組態可能如下所示：

```
// set the default config object
var creds = new AWS.CognitoIdentityCredentials({
 IdentityPoolId: 'us-east-1:1699ebc0-7900-4099-b910-2df94f52a030'
});
AWS.config.credentials = creds;
```

### 切換到已驗證使用者
<a name="switch-to-authenticated"></a>

當未驗證使用者登入身分提供者，且您有一個字符時，您可以透過呼叫自訂函數更新登入資料物件並新增 `Logins` 字符，將使用者從未驗證切換為已驗證：

```
// Called when an identity provider has a token for a logged in user
function userLoggedIn(providerName, token) {
  creds.params.Logins = creds.params.Logins || {};
  creds.params.Logins[providerName] = token;
                    
  // Expire credentials to refresh them on the next request
  creds.expired = true;
}
```

您也可建立 `CognitoIdentityCredentials` 物件。如果您建立此物件，您必須為建立的任何現有服務物件重設登入資料屬性。服務物件僅會在物件初始化時從全域組態進行讀取。

如需`CognitoIdentityCredentials`物件的詳細資訊，請參閱《 適用於 JavaScript 的 AWS SDK API 參考[https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CognitoIdentityCredentials.html](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CognitoIdentityCredentials.html)》中的 。

# 使用 Web 聯合身分來驗證使用者
<a name="loading-browser-credentials-federated-id"></a>

您可以直接設定個別身分提供者，以使用 Web 聯合身分存取 AWS 資源。 AWS 目前支援透過數個身分提供者使用 Web 聯合身分驗證使用者：
+ [Login with Amazon](https://login.amazon.com)
+ [Facebook 登入](https://www.facebook.com/about/login)
+ [Google 登入](https://developers.google.com/identity/)

您必須先使用應用程式支援的供應商註冊應用程式。接著，建立 IAM 角色並設定其許可。然後，您建立的 IAM 角色會用來授予您透過個別身分提供者為其設定的許可。例如，您可以設定角色，讓透過 Facebook 登入的使用者能夠讀取您控制的特定 Amazon S3 儲存貯體。

同時擁有已設定權限的 IAM 角色，以及向您選擇的身分提供者註冊的應用程式之後，您可以設定 SDK，以使用協助程式程式碼取得 IAM 角色的登入資料，如下所示：

```
AWS.config.credentials = new AWS.WebIdentityCredentials({
   RoleArn: 'arn:aws:iam::<AWS_ACCOUNT_ID>/:role/<WEB_IDENTITY_ROLE_NAME>',
   ProviderId: 'graph.facebook.com|www.amazon.com', // this is null for Google
   WebIdentityToken: ACCESS_TOKEN
});
```

`ProviderId` 參數中的值取決於指定的身分提供者。`WebIdentityToken` 參數中的值是透過身分提供者成功登入時所擷取的存取字符。如需為每個身分提供者設定和擷取存取字符的詳細資訊，請參閱身分提供者的文件。

## 步驟 1：向身分提供者註冊
<a name="config-web-identity-register"></a>

若要開始，請向您選擇要支援的身分提供者註冊應用程式。系統會要求您提供可辨識您應用程式和其作者的資訊。這可確保身分提供者了解誰在接收其使用者資訊。在每個案例中，身分供應商會發行您用來設定使用者角色的應用程式 ID。

## 步驟 2：為身分提供者建立 IAM 角色
<a name="config-web-identity-role"></a>

從身分提供者取得應用程式 ID 之後，請前往 IAM 主控台，網址為 [https://console.aws.amazon.com/iam/](https://console.aws.amazon.com/iam/)：//www.healthnet.com，以建立新的 IAM 角色。

**為身分提供者建立 IAM 角色**

1. 前往主控台的 **Roles (角色)** 區段，然後選擇 **Create New Role (新建角色)**。

1. 為新角色輸入可協助您追蹤其用量的名稱，例如 **facebookIdentity**，然後選擇 **Next Step (下一步)**。

1. 在 **Select Role Type (選擇角色類型)** 中，選擇 **Role for Identity Provider Access (身分提供者存取的角色)**。

1. 針對 **Grant access to web identity providers (將存取授予 web 身分提供者)**，選擇 **Select (選取)**。

1. 從**身分提供者**清單中，選擇您要用於此 IAM 角色的身分提供者。  
![\[選取適用於身分提供者存取的角色\]](http://docs.aws.amazon.com/zh_tw/sdk-for-javascript/v2/developer-guide/images/iam-provider-select.png)

1. 輸入在 **Application ID (應用程式 ID)** 中由身分提供者提供的應用程式 ID，然後選擇 **Next Step (下一步)**。

1. 為您要公開的資源設定許可，允許對特定資源進行特定操作。如需 IAM 許可的詳細資訊，請參閱《[IAM AWS 使用者指南》中的 IAM 許可概觀](https://docs.aws.amazon.com/IAM/latest/UserGuide/access_permissions.html)。 **檢視，並視需要自訂角色的信任關係，然後選擇 **Next Step (下一步)**。

1. 連接您需要的額外政策，然後選擇 **Next Step (下一步)**。如需關於 IAM 政策的詳細資訊，請參閱《IAM 使用者指南》**中的 [IAM 政策概觀](https://docs.aws.amazon.com/IAM/latest/UserGuide/access_policies.html)。

1. 檢閱新角色，然後選擇 **Create Role (建立角色)**。

您可以將其他限制條件提供給該角色，像是將其範圍限制在特定的使用者 ID。如果該角色將寫入許可授予您的資源，請確保您正確地將角色範圍限制在含正確權限的使用者，否則具有 Amazon、Facebook 或 Google 身分的任何使用者都能夠修改您應用程式中的資源。

如需在 IAM 中使用 Web 聯合身分的詳細資訊，請參閱《*IAM 使用者指南*》中的[關於 Web 聯合身分](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_roles_providers_oidc.html)。

## 步驟 3：在登入後取得供應商存取字符
<a name="config-web-identity-obtain-token"></a>

使用身分提供者的軟體開發套件來為應用程式設定登入動作。您可以透過啟用使用者登入 (使用 OAuth 或 OpenID) 的身分提供者，來下載和安裝 JavaScript 軟體開發套件。如需如何在應用程式中下載和設定軟體開發套件程式碼的詳細資訊，請參閱身分提供者的軟體開發套件文件
+ [Login with Amazon](https://login.amazon.com/website)
+ [Facebook 登入](https://developers.facebook.com/docs/javascript)
+ [Google 登入](https://developers.google.com/identity/)

## 步驟 4：取得暫時登入資料
<a name="config-web-identity-get-credentials"></a>

在應用程式、角色和資源許可都設定後，將該程式碼新增至應用程式來取得暫時登入資料。這些登入資料是透過 AWS Security Token Service 使用 Web 聯合身分的 提供。使用者登入身分提供者，而傳回存取字符。針對您為此身分提供者建立的 IAM 角色，使用 ARN 設定`AWS.WebIdentityCredentials`物件：

```
AWS.config.credentials = new AWS.WebIdentityCredentials({
    RoleArn: 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>',
    ProviderId: 'graph.facebook.com|www.amazon.com', // Omit this for Google
    WebIdentityToken: ACCESS_TOKEN // Access token from identity provider
});
```

後續建立的服務物件會擁有適當的登入資料。在設定 `AWS.config.credentials` 屬性前建立的物件不會有目前的登入資料。

您也可以建立 `AWS.WebIdentityCredentials`，再擷取存取字符。此可讓您建立依靠登入資料的服務物件，再載入存取字符。若要這麼做，請建立不含 `WebIdentityToken` 參數的登入資料物件：

```
AWS.config.credentials = new AWS.WebIdentityCredentials({
  RoleArn: 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>',
  ProviderId: 'graph.facebook.com|www.amazon.com' // Omit this for Google
});

// Create a service object
var s3 = new AWS.S3;
```

接著會透過包含該存取字符的身分提供者軟體開發套件，在回呼中設定 `WebIdentityToken`：

```
AWS.config.credentials.params.WebIdentityToken = accessToken;
```

# Web 聯合身分範例
<a name="config-web-identity-examples"></a>

這裡有一些使用 web 聯合身分來在瀏覽器 JavaScript 中取得登入資料的範例。這些範例的執行必須透過 http:// 或 https:// 主機結構描述，來確保身分提供者可以重新導向至您的應用程式。

## Login with Amazon 範例
<a name="config-web-identity-amazon-login-example"></a>

以下程式碼說明如何使用 Login with Amazon 做為身分提供者。

```
<a href="#" id="login">
  <img border="0" alt="Login with Amazon"
    src="https://images-na.ssl-images-amazon.com/images/G/01/lwa/btnLWA_gold_156x32.png"
    width="156" height="32" />
</a>
<div id="amazon-root"></div>
<script type="text/javascript">
  var s3 = null;
  var clientId = 'amzn1.application-oa2-client.1234567890abcdef'; // client ID
  var roleArn = 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>';

  window.onAmazonLoginReady = function() {
    amazon.Login.setClientId(clientId); // set client ID

    document.getElementById('login').onclick = function() {
      amazon.Login.authorize({scope: 'profile'}, function(response) {
        if (!response.error) { // logged in
          AWS.config.credentials = new AWS.WebIdentityCredentials({
            RoleArn: roleArn,
            ProviderId: 'www.amazon.com',
            WebIdentityToken: response.access_token
          });

          s3 = new AWS.S3();

          console.log('You are now logged in.');
        } else {
          console.log('There was a problem logging you in.');
        }
      });
    };
  };

  (function(d) {
    var a = d.createElement('script'); a.type = 'text/javascript';
    a.async = true; a.id = 'amazon-login-sdk';
    a.src = 'https://api-cdn.amazon.com/sdk/login1.js';
    d.getElementById('amazon-root').appendChild(a);
  })(document);
</script>
```

## Facebook Login 範例
<a name="config-web-identity-facebook-login-example"></a>

以下程式碼說明如何使用 Facebook Login 做為身分提供者：

```
<button id="login">Login</button>
<div id="fb-root"></div>
<script type="text/javascript">
var s3 = null;
var appId = '1234567890'; // Facebook app ID
var roleArn = 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>';

window.fbAsyncInit = function() {
  // init the FB JS SDK
  FB.init({appId: appId});

  document.getElementById('login').onclick = function() {
    FB.login(function (response) {
      if (response.authResponse) { // logged in
        AWS.config.credentials = new AWS.WebIdentityCredentials({
          RoleArn: roleArn,
          ProviderId: 'graph.facebook.com',
          WebIdentityToken: response.authResponse.accessToken
        });

        s3 = new AWS.S3;

        console.log('You are now logged in.');
      } else {
        console.log('There was a problem logging you in.');
      }
    });
  };
};

// Load the FB JS SDK asynchronously
(function(d, s, id){
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement(s); js.id = id;
   js.src = "//connect.facebook.net/en_US/all.js";
   fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));
</script>
```

## Google\$1 Sign-in 範例
<a name="config-web-identity-google-login-example"></a>

以下程式碼說明如何使用 Google\$1 Sign-in 做為身分提供者。透過 Google 用於 web 聯合身分的存取字符會存放在 `response.id_token`，而不是與其他身分提供者一樣放在 `access_token`。

```
<span
  id="login"
  class="g-signin"
  data-height="short"
  data-callback="loginToGoogle"
  data-cookiepolicy="single_host_origin"
  data-requestvisibleactions="http://schemas.google.com/AddActivity"
  data-scope="https://www.googleapis.com/auth/plus.login">
</span>
<script type="text/javascript">
  var s3 = null;
  var clientID = '1234567890.apps.googleusercontent.com'; // Google client ID
  var roleArn = 'arn:aws:iam::<AWS_ACCOUNT_ID>:role/<WEB_IDENTITY_ROLE_NAME>';

  document.getElementById('login').setAttribute('data-clientid', clientID);
  function loginToGoogle(response) {
    if (!response.error) {
      AWS.config.credentials = new AWS.WebIdentityCredentials({
        RoleArn: roleArn, WebIdentityToken: response.id_token
      });

      s3 = new AWS.S3();

      console.log('You are now logged in.');
    } else {
      console.log('There was a problem logging you in.');
    }
  }

  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/client:plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
 </script>
```