[適用於 JavaScript 的 AWS SDK V3 API 參考指南](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/)詳細說明 第 3 版 適用於 JavaScript 的 AWS SDK (V3) 的所有 API 操作。

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

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

透過瀏覽器指令碼將登入資料提供給軟體開發套件有幾種方法。有些方法比較安全，有些在開發指令碼時更方便。

 以下是您可以依建議順序提供登入資料的方式：

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

1. 使用 Web 聯合身分

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

**Topics**
+ [使用 Amazon Cognito Identity 來驗證使用者](loading-browser-credentials-cognito.md)

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

為瀏覽器指令碼取得 AWS 登入資料的建議方法是使用 Amazon Cognito Identity 登入資料用戶端 `CognitoIdentityClient`。Amazon Cognito 可透過第三方身分提供者對使用者進行身分驗證。

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

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

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

如果您尚未建立身分集區，請先在 [Amazon Cognito 主控台](https://console.aws.amazon.com/cognito)中建立身分集區，以與瀏覽器指令碼搭配使用，再設定 Amazon Cognito 用戶端。建立身分集區的已驗證和未驗證 IAM 角色，並將其建立關聯。如需詳細資訊，請參閱《*Amazon Cognito 開發人員指南*》中的[教學課程：建立身分集](https://docs.aws.amazon.com/cognito/latest/developerguide/tutorial-create-identity-pool.html)區。

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

設定身分集區之後，請使用 中的 `fromCognitoIdentityPool`方法`@aws-sdk/credential-providers`，從身分集區擷取登入資料。在建立 Amazon S3 用戶端的下列範例中，將 *AWS\$1REGION* 取代為區域，並將 *IDENTITY\$1POOL\$1ID* 取代為身分集區 ID。

```
// Import required AWS SDK clients and command for Node.js
import {S3Client} from "@aws-sdk/client-s3";
import {fromCognitoIdentityPool} from "@aws-sdk/credential-providers";

const REGION = AWS_REGION;

const s3Client = new S3Client({
  region: REGION,
  credentials: fromCognitoIdentityPool({
    clientConfig: { region: REGION }, // Configure the underlying CognitoIdentityClient.
    identityPoolId: 'IDENTITY_POOL_ID',
    logins: {
            // Optional tokens, used for authenticated login.
        },
  })
});
```

選用的 `logins` 屬性是身分提供者名稱與這些身分提供者的身分權杖的對應。您從身分提供者取得權杖的方式，取決於您使用的供應商。例如，如果您使用 Amazon Cognito 使用者集區做為身分驗證提供者，您可以使用類似以下的方法。

```
// Get the Amazon Cognito ID token for the user. 'getToken()' below.
let idToken = getToken();
let COGNITO_ID = "COGNITO_ID"; // 'COGNITO_ID' has the format 'cognito-idp.REGION.amazonaws.com/COGNITO_USER_POOL_ID'
let loginData = {
  [COGNITO_ID]: idToken,
};
const s3Client = new S3Client({
    region: REGION,
    credentials: fromCognitoIdentityPool({
    clientConfig: { region: REGION }, // Configure the underlying CognitoIdentityClient.
    identityPoolId: 'IDENTITY_POOL_ID',
    logins: loginData
  })
});

// Strips the token ID from the URL after authentication.
window.getToken = function () {
  var idtoken = window.location.href;
  var idtoken1 = idtoken.split("=")[1];
  var idtoken2 = idtoken1.split("&")[0];
  var idtoken3 = idtoken2.split("&")[0];
  return idtoken3;
};
```

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

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

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

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

```
// Import the required 適用於 JavaScript 的 AWS SDK v3 modules.                   
import {fromCognitoIdentityPool} from "@aws-sdk/credential-providers";
// Set the default credentials.
const creds = fromCognitoIdentityPool({
  identityPoolId: 'IDENTITY_POOL_ID',
  clientConfig: { region: REGION } // Configure the underlying CognitoIdentityClient.
});
```

### 切換到已驗證使用者
<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;
}
```