La versión 2 de AWS SDK para JavaScript ha llegado al final del soporte. Se recomienda que migre a [AWS SDK para JavaScript v3](https://docs.aws.amazon.com//sdk-for-javascript/v3/developer-guide/). Para ver detalles e información adicionales sobre cómo realizar la migración, consulte este [anuncio](https://aws.amazon.com/blogs//developer/announcing-end-of-support-for-aws-sdk-for-javascript-v2/).

# Configuración de credenciales en un navegador web
<a name="setting-credentials-browser"></a>

Hay varias formas de proporcionar credenciales al SDK desde scripts de navegador. Algunas de ellas son más seguras y otras ofrecen más comodidad mientras se desarrolla un script. A continuación se muestran las formas de suministro de credenciales según su orden de recomendación:

1. Uso de Amazon Cognito Identity para autenticar a los usuarios y proporcionar credenciales

1. Uso de identidades federadas web

1. codificadas de forma rígida en el script

**aviso**  
No se recomienda codificar de forma rígida las credenciales de AWS en sus scripts. Si las codifica de forma rígida, corre el riesgo de que su ID de clave de acceso y la clave de acceso secreta queden expuestos.

**Topics**
+ [Uso de Amazon Cognito Identity para autenticar a los usuarios](loading-browser-credentials-cognito.md)
+ [Uso de identidades federadas web para autenticar usuarios](loading-browser-credentials-federated-id.md)
+ [Ejemplos de identidades federadas web](config-web-identity-examples.md)

# Uso de Amazon Cognito Identity para autenticar a los usuarios
<a name="loading-browser-credentials-cognito"></a>

La forma recomendada de obtener credenciales de AWS para los scripts del navegador es utilizar el objeto de credenciales de Amazon Cognito Identity, `AWS.CognitoIdentityCredentials`. Amazon Cognito permite la autenticación de los usuarios a través de proveedores de identidad de terceros.

Para usar Amazon Cognito Identity, primero debe crear un grupo de identidades en la consola Amazon Cognito. Un grupo de identidades representa el grupo de identidades que su aplicación proporciona a los usuarios. Las identidades que se dan a los usuarios identifican de forma inequívoca cada cuenta de usuario. Las identidades de Amazon Cognito no son credenciales. Se intercambian por credenciales utilizando la compatibilidad con las identidades web federadas en AWS Security Token Service (AWS STS).

Amazon Cognito es útil para administrar la abstracción de identidades a través de varios proveedores de identidades con el objeto `AWS.CognitoIdentityCredentials`. La identidad que se carga se intercambia por credenciales en AWS STS.

## Configuración del objeto de credenciales de Amazon Cognito Identity
<a name="browser-cognito-configuration"></a>

Si todavía no ha creado un grupo de identidades, cree uno para usarlo con los scripts de navegador en la [consola de Amazon Cognito](https://console.aws.amazon.com/cognito) antes de configurar `AWS.CognitoIdentityCredentials`. Cree y asocie roles de IAM autenticados y sin autenticar para su grupo de identidades.

La identidad de los usuarios sin autenticar no se verifica, lo que hace que este rol sea adecuado para los usuarios invitados de la aplicación o para cuando no importa si se verifica la identidad de los usuarios. Los usuarios autenticados inician sesión en la aplicación a través de un proveedor de identidades externo que verifica sus identidades. Asegúrese de asignar los permisos de los recursos de forma adecuada, para no conceder acceso a ellos a los usuarios no autenticados.

Después de configurar un grupo de identidades con proveedores de identidades asociados, puede utilizar `AWS.CognitoIdentityCredentials` para autenticar a los usuarios. Para configurar las credenciales de la aplicación para utilizar `AWS.CognitoIdentityCredentials`, establezca la propiedad `credentials` de `AWS.Config` o una configuración específica para cada servicio. El siguiente ejemplo utiliza `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'
  }
});
```

La propiedad opcional `Logins` es un mapeo entre los nombres de los proveedores de identidad y los tokens de identidad de los proveedores. La forma de obtener el token del proveedor de identidad depende del proveedor que se utilice. Por ejemplo, si Facebook es uno de sus proveedores de identidad, puede utilizar la función `FB.login` del [SDK de Facebook](https://developers.facebook.com/docs/facebook-login/web) para obtener un token de proveedor de identidad:

```
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.');
  }
});
```

## Cambio de usuarios sin autenticar a usuarios autenticados
<a name="browser-switching-unauthenticated-users"></a>

Amazon Cognito es compatible con los usuarios autenticados y no autenticados. Los usuarios sin autenticar reciben acceso a sus recursos incluso si no han iniciado sesión con alguno de sus proveedores de identidades. Este grado de acceso es útil para mostrar contenido a usuarios antes de que inicien sesión. Cada usuario sin autenticar tiene una identidad única en Amazon Cognito, aunque no haya iniciado sesión ni se haya autenticado individualmente.

### Usuario sin autenticar inicialmente
<a name="browser-switching-initially-unauthenticated-user"></a>

Los usuarios suelen comenzar con el rol sin autenticar, para el que se establece la propiedad de credenciales de su objeto de configuración sin una propiedad `Logins`. En este caso, la configuración predeterminada podría tener el siguiente aspecto:

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

### Cambie a usuario autenticado
<a name="switch-to-authenticated"></a>

Cuando un usuario sin autenticar inicia sesión en un proveedor de identidades y tiene un token, puede cambiar el usuario de no estar autenticado a estar autenticado llamando a una función personalizada que actualiza el objeto de credenciales y añade el token `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;
}
```

También puede crear un objeto `CognitoIdentityCredentials`. Si lo hace, debe restablecer las propiedades de las credenciales de los objetos de servicio existentes que ha creado. Los objetos de servicio leen en la configuración global solo al realizarse la inicialización del objeto. 

Para obtener más información acerca del objeto `CognitoIdentityCredentials`, consulte [https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CognitoIdentityCredentials.html](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CognitoIdentityCredentials.html) en la referencia de la API de AWS SDK para JavaScript. 

# Uso de identidades federadas web para autenticar usuarios
<a name="loading-browser-credentials-federated-id"></a>

Puede configurar directamente distintos proveedores de identidades para obtener acceso a recursos de AWS a través de la federación de identidades web. AWS actualmente admite la autenticación de usuarios mediante las identidades web federadas a través de varios proveedores de identidades:
+ [Login with Amazon](https://login.amazon.com)
+ [Inicio de sesión con Facebook](https://www.facebook.com/about/login)
+ [Inicio de sesión con Google](https://developers.google.com/identity/)

Primero debe registrar la aplicación con los proveedores compatibles con su aplicación. Luego cree un rol de IAM y configure permisos para él. El rol de IAM que cree se utilizará para conceder los permisos que haya configurado para él a través del proveedor de identidades respectivo. Por ejemplo, puede configurar un rol que permita a los usuarios que han iniciado sesión a través de Facebook tener acceso de lectura a un bucket de Amazon S3 específico que usted controla.

Una vez que tenga un rol de IAM con privilegios configurados y una aplicación registrada en los proveedores de identidades de su elección, puede configurar el SDK para obtener credenciales para el rol de IAM usando código auxiliar, tal y como se indica a continuación:

```
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
});
```

El valor del parámetro `ProviderId` depende del proveedor de identidades especificado. El valor del parámetro `WebIdentityToken` es el token de acceso recuperado desde un inicio de sesión correcto con el proveedor de identidades. Para obtener más información sobre cómo configurar y recuperar tokens de acceso para cada proveedor de identidades, consulte la documentación del proveedor de identidades.

## Paso 1: Registro en proveedores de identidades
<a name="config-web-identity-register"></a>

Para empezar, registre una aplicación en los proveedores de identidades que decida admitir. Se le pedirá que proporcione información que identifique su aplicación y posiblemente su autor. De este modo, se garantiza que los proveedores de identidades sepan quién está recibiendo su información de usuario. En todos los casos, el proveedor de identidades emitirá un ID de aplicación que se utilizará para configurar los roles de usuarios.

## Paso 2: Creación de un rol de IAM para un proveedor de identidades
<a name="config-web-identity-role"></a>

Después de obtener el ID de aplicación de un proveedor de identidades, vaya a la consola de IAM en [https://console.aws.amazon.com/iam/](https://console.aws.amazon.com/iam/) para crear un rol de IAM nuevo.

**Para crear un rol de IAM para proveedor de identidades**

1. Vaya a la sección **Roles** de la consola y, a continuación, seleccione **Create New Role (Crear nuevo rol)**.

1. Escriba un nombre para el nuevo rol que le ayudará a realizar un seguimiento de su uso, como por ejemplo **facebookIdentity** y luego elija **Next Step (Paso siguiente)**.

1. En **Select Role Type (Seleccionar tipo de rol)**, elija **Role for Identity Provider Access (Rol para acceso del proveedor de identidades)**.

1. Para **Grant access to web identity providers (Conceder acceso a los proveedores de identidades web)**, elija **Select (Seleccionar)**.

1. En la lista **Proveedor de identidades**, elija el proveedor de identidades que desea usar para este rol de IAM.  
![\[Selección del rol para el acceso de proveedores de identidades\]](http://docs.aws.amazon.com/es_es/sdk-for-javascript/v2/developer-guide/images/iam-provider-select.png)

1. Escriba el ID de la aplicación que ha proporcionado el proveedor de identidades en ** Application ID (ID de la aplicación)** y, a continuación, seleccione **Next Step (Paso siguiente)**.

1. Configure permisos para los recursos que desea mostrar y permita el acceso a operaciones específicas en recursos específicos. Para obtener más información sobre los permisos de IAM, consulte [Descripción general de los permisos de AWS IAM](https://docs.aws.amazon.com/IAM/latest/UserGuide/access_permissions.html) en la *Guía del usuario de IAM*. Revise y, si es necesario, personalice la relación de confianza del rol y, a continuación, seleccione **Next Step (Paso siguiente)**.

1. Asocie las políticas adicionales que necesita y, a continuación, seleccione **Next Step (Paso siguiente)**. Para obtener más información acerca de las políticas de IAM, consulte [Descripción general de las políticas de IAM](https://docs.aws.amazon.com/IAM/latest/UserGuide/access_policies.html) en la *Guía del usuario de IAM*.

1. Revise el nuevo rol y, a continuación, elija **Create role (Crear rol)**.

Puede añadir más restricciones al rol como, por ejemplo, limitarlo a ID de usuario específicos. Si el rol concede permisos de escritura sobre sus recursos, asegúrese de que restringe el rol correctamente a los usuarios que tengan los privilegios adecuados; de lo contrario, cualquier usuario con una identidad de Amazon, Facebook o Google podrá modificar recursos de su aplicación.

Para obtener más información acerca de cómo usar la federación de identidades web en IAM, consulte [Acerca de identidades web federadas](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_roles_providers_oidc.html) en la *Guía del usuario de IAM*.

## Paso 3: Obtención de un token de acceso después de iniciar sesión
<a name="config-web-identity-obtain-token"></a>

Configure la acción de inicio de sesión para su aplicación mediante el SDK del proveedor de identidades. Puede descargar e instalar un SDK de JavaScript del proveedor de identidades que permita el inicio de sesión de usuario mediante OAuth u OpenID. Para obtener información acerca de cómo descargar y configurar el código del SDK en su aplicación, consulte la documentación del SDK para su proveedor de identidades:
+ [Login with Amazon](https://login.amazon.com/website)
+ [Inicio de sesión con Facebook](https://developers.facebook.com/docs/javascript)
+ [Inicio de sesión con Google](https://developers.google.com/identity/)

## Paso 4: Obtención de credenciales temporales
<a name="config-web-identity-get-credentials"></a>

Una vez que haya configurado su aplicación, los roles y los permisos a nivel de recursos, añada el código a la aplicación para obtener credenciales temporales. Estas credenciales se proporcionan a través de AWS Security Token Service con la identidad web federada. Los usuarios inician sesión en el proveedor de identidades, el cual devuelve un token de acceso. Configure el objeto `AWS.WebIdentityCredentials` con el ARN para el rol de IAM que ha creado para este proveedor de identidades:

```
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
});
```

Los objetos de servicio que se creen posteriormente tendrán las credenciales apropiadas. Los objetos creados antes de configurar la propiedad `AWS.config.credentials` no tienen las credenciales actuales.

También puede crear `AWS.WebIdentityCredentials` antes de recuperar el token de acceso. Esto le permite crear objetos de servicio que dependen de las credenciales antes de cargar el token de acceso. Para ello, cree el objeto de credenciales sin el parámetro `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;
```

A continuación, establezca `WebIdentityToken` en la devolución de llamada del SDK del proveedor de identidades que contiene el token de acceso:

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

# Ejemplos de identidades federadas web
<a name="config-web-identity-examples"></a>

A continuación se ofrecen algunos ejemplos de uso de identidades federadas web para obtener credenciales en JavaScript de navegador. Estos ejemplos debe ejecutarse desde un esquema de host http:// o https:// para garantizar que el proveedor de identidades pueda realizar redirecciones a la aplicación. 

## Ejemplo de inicio de Login with Amazon
<a name="config-web-identity-amazon-login-example"></a>

En el código siguiente se muestra cómo utilizar Login with Amazon como proveedor de identidades. 

```
<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>
```

## Ejemplo de inicio de sesión con Facebook
<a name="config-web-identity-facebook-login-example"></a>

En el código siguiente se muestra cómo utilizar el inicio de sesión con Facebook como proveedor de identidades:

```
<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>
```

## Ejemplo de inicio de sesión con Google\$1
<a name="config-web-identity-google-login-example"></a>

En el código siguiente se muestra cómo utilizar el inicio de sesión con Google\$1 como proveedor de identidades. El token de acceso que se utiliza para la identidad web federada de Google se almacena en `response.id_token` en lugar de almacenarse en `access_token`, como es el caso de otros proveedores de identidades. 

```
<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>
```