IBM Cloud Docs
Apps web

Apps web

Cuando desarrolla una aplicación web, puede utilizar el flujo web de IBM Cloud® App ID para autenticar usuarios de forma segura. Los usuarios podrán acceder al contenido protegido del lado del servidor en sus apps web.

Comprensión del flujo

Las aplicaciones web a menudo requieren que los usuarios se autentiquen para acceder a contenido protegido App ID utiliza el flujo de código de autorización de OIDC para autenticar de forma segura a los usuarios. Con este flujo, cuando el usuario se ha autenticado, la app recibe un código de autorización. El código se cambia por una señal de acceso, identidad y renovación. En código, paso de intercambio los tokens siempre se envían utilizando un backchannel seguro entre la app y el servidor OIDC. Este proceso proporciona otra capa de seguridad, ya que el atacante no puede interceptar los tokens. Las señales se pueden enviar directamente a la aplicación de alojamiento del servidor web para la autenticación de usuario.

Flujo de solicitudes de aplicaciones web
Flujo de solicitudes de aplicaciones web

  1. Un usuario inicia el flujo de autorización enviando una solicitud al punto final /authorization mediante la API o SDK de App ID.

  2. Si el usuario no está autorizado, el flujo de autenticación se inicia con una redirección a App ID.

  3. En función de los parámetros de solicitud de /authorization del usuario o de la configuración del proveedor de identidad, inicia el widget de inicio de sesión en el navegador del usuario.

  4. El usuario elige un proveedor de identidad para autenticarse con y completa el proceso de inicio de sesión.

  5. El proveedor de identidad redirecciona a la app de cliente con el código de autorización.

  6. El SDK de App ID intercambia el código de autorización por señales de identidad, acceso y señales de renovación opcionales desde el servicio App ID.

  7. Las señales se guardan mediante el SDK de App ID y se produce una redirección a la aplicación de cliente.

  8. Se otorga acceso al usuario a la app.

Configuración del SDK de Node.js

Puede configurar App ID para que trabaje con sus aplicaciones web de Node.js.

Antes de empezar

Debe tener los siguientes requisitos previos:

  • Una instancia del servicio App ID
  • Un conjunto de credenciales de servicio
  • NPM versión 4 o superior
  • Node versión 6 o superior
  • El URI de redirección establecido en el panel de control del servicio App ID

Consulte el siguiente vídeo para obtener más información sobre la protección de las aplicaciones Node con App ID. A continuación, pruébelo usted mismo utilizando una sencilla aplicación de ejemplo de Node.

Instalación del SDK de Node.js

  1. Utilizando la línea de mandatos, vaya al directorio que contiene la app Node.js.

  2. Instale el servicio App ID.

    npm install --save ibmcloud-appid
    

Inicialización del SDK de Node.js

  1. Añada las siguientes definiciones de require al archivo server.js.

    const express = require('express');
    const session = require('express-session')
    const passport = require('passport');
    const WebAppStrategy = require("ibmcloud-appid").WebAppStrategy;
    const CALLBACK_URL = "/ibm/cloud/appid/callback";
    
  2. Configurar la app express para utilizar el middleware de sesión express.

    const app = express();
    app.use(session({
       secret: "123456",
       resave: true,
       saveUninitialized: true
    }));
    app.use(passport.initialize());
    app.use(passport.session());
    

    Debe configurar el middleware con el almacenamiento de sesión adecuado para entornos de producción. Para obtener más información, consulte express.js.

  3. Obtenga las credenciales de una de las formas siguientes.

    • Vaya al separador Aplicaciones del panel de control de App ID. Si no tiene ninguna aplicación en la lista, puede pulsar Añadir aplicación para crear una.

    • Realizando una solicitud POST al punto final de /management/v4/<tenantId>/applications.

      Formato de la solicitud:

      curl -X POST \  https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \
      -H 'Content-Type: application/json' \
      -H 'Authorization: Bearer <IAMToken>' \
      -d '{"name": "ApplicationName"}'
      

      Respuesta de ejemplo:

      {
      "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f",
      "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61",
      "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4",
      "name": "ApplicationName",
      "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61"
      }
      
  4. Opcional: decida el formato del URI de redirección. La redirección puede tener dos formatos diferentes. Si no se proporciona ninguna de las siguientes opciones, el SDK de App ID intenta recuperar el application_uri de la aplicación que se está ejecutando en IBM Cloud y añade un sufijo por defecto /ibm/cloud/appid/callback.

    • Manualmente en un nuevo WebAppStrategy({redirectUri: "...."})
    • Como una variable de entorno denominada redirectUri
  5. Con la información obtenida en los pasos anteriores, inicialice el SDK.

    passport.use(new WebAppStrategy({
    tenantId: "<tenantID>",
    clientId: "<clientID>",
    secret: "<secret>",
    oauthServerUrl: "<oauthServerURL>",
    redirectUri: "<appURL>" + CALLBACK_URL
    }));
    
  6. Configurar passport con serialización y deserialización. Este paso de configuración es necesario para la persistencia de la sesión autenticada en las solicitudes HTTP. Para más información, consulte los documentos del pasaporte.

    passport.serializeUser(function(user, cb) {
       cb(null, user);
       });
    passport.deserializeUser(function(obj, cb) {
       cb(null, obj);
       });
    
  7. Añada el código siguiente al archivo server.js para emitir las redirecciones de servicio.

    app.get(CALLBACK_URL, passport.authenticate(WebAppStrategy.STRATEGY_NAME));
    
  8. Registre el punto final protegido añadiendo el siguiente fragmento de código en el archivo app.js.

    app.get(‘/protected_resource’, passport.authenticate(WebAppStrategy.STRATEGY_NAME), function(req, res) {res.json(req.user); });
    

Para obtener más información, consulte el repositorio App ID Node.js GitHub.

Configuración del SDK de Liberty for Java

Puede configurar App ID para trabajar con sus aplicaciones web de Liberty for Java.

Antes de empezar

Debe tener los siguientes requisitos previos:

  • Una instancia del servicio App ID
  • Un conjunto de credenciales de servicio
  • Apache Maven 3.5 o superior
  • Java 1.8
  • Una aplicación web de Liberty for Java

Consulte el siguiente vídeo para obtener más información sobre la protección de las aplicaciones Liberty for Java con App ID. A continuación, pruébelo usted mismo utilizando una sencilla aplicación de ejemplo de Liberty for Java.

Instalación del SDK de Liberty for Java

  1. Añada una característica OpenID Connect en server.xml.

    <featureManager>
       <feature>ssl-1.0</feature>
       <feature>appSecurity-2.0</feature>
       <feature>openidConnectClient-1.0</feature>
    </featureManager>
    
  2. Obtenga las credenciales de una de estas dos maneras.

    • Vaya al separador Aplicaciones del panel de control de App ID. Si aún no dispone de una, puede pulsar Añadir aplicación para crear una nueva.

    • Realizando una solicitud POST al punto final de /management/v4/<tenantID>/applications.

      Formato de la solicitud:

      curl -X POST \  https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \
      -H 'Content-Type: application/json' \
      -H 'Authorization: Bearer <IAMToken>' \
      -d '{"name": "ApplicationName"}'
      

      Respuesta de ejemplo:

      {
      "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f",
      "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61",
      "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4",
      "name": "ApplicationName",
      "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61"
      }
      
  3. Cree una característica de Open ID Connect Client y defina los siguientes marcadores de posición. Utilice las credenciales de servicio para rellenar los marcadores.

    <openidConnectClient
       clientId='App ID client_ID'
       clientSecret='App ID Secret'
       authorizationEndpointUrl='oauthServerUrl/authorization'
       tokenEndpointUrl='oauthServerUrl/token'
       jwkEndpointUrl='oauthServerUrl/publickeys'
       issuerIdentifier='Changed according to the region'
       tokenEndpointAuthMethod="basic"
       signatureAlgorithm="RS256"
       authFilterid="myAuthFilter"
       trustAliasName="ibm.com"
    />
    
    Variables del elemento de OIDC para las apps de Liberty for Java
    Componente Descripción
    clientID
    secret
    oauth-server-url
    Complete el paso dos para obtener las credenciales de servicio.
    authorizationEndpointURL Añada /authorization al final de oauthServerURL.
    tokenEndpointUrl

    Añadir /token al final de oauthServerURL.

    jwkEndpointUrl Añada /publickeys al final de oauthServerURL.
    issuerIdentifier El identificador del emisor tiene el formato siguiente: &lt;region>&gt;.cloud.ibm.com. Obtenga más información sobre las regiones disponibles.
    tokenEndpointAuthMethod Especificado como "básico".
    signatureAlgorithm Especificado como "RS256".
    authFilterid La lista de recursos para proteger.
    trustAliasName El nombre del certificado dentro del almacén de confianza.

Inicialización del SDK de Liberty for Java

  1. En el archivo server.xml, defina un filtro de autorización para especificar recursos protegidos. Si no se define un filtro, el servicio protege todos los recursos.

    <authFilter id="myAuthFilter">
       <requestUrl id="myRequestUrl" urlPattern="/protected_resource" matchType="contains"/>
    </authFilter>
    
  2. Defina el tipo de sujeto especial como ALL_AUTHENTICATED_USERS.

    <application type="war" id="ProtectedServlet" context-root="/appidSample" location="${server.config.dir}/apps/libertySample-1.0.0.war">
       <application-bnd>
             <security-role name="myrole">
                <special-subject type="ALL_AUTHENTICATED_USERS"/>
             </security-role>
       </application-bnd>
    </application>
    
  3. Descargue el archivo libertySample-1.0.0.war de GitHub y colóquelo en la carpeta de aplicaciones de su servidor. Por ejemplo, si el servidor se denomina defaultServer, el archivo war debería ubicarse en target/liberty/wlp/usr/servers/defaultServer/apps/.

  4. Configure SSL añadiendo lo siguiente al archivo server.xml. También tiene que crear un almacén de confianza.

       <keyStore id="defaultKeyStore" password="myPassword"/>
       <keyStore id="appidtruststore" password="Liberty" location="${server.config.dir}/mytruststore.jks"/>
       <ssl id="defaultSSLConfig" keyStoreRef="defaultKeyStore" trustStoreRef="appidtruststore"/>
    

De forma predeterminada, la configuración SSL requiere que el almacén de confianza esté configurado para OpenID Connect. Más información sobre la configuración de OpenID Connect Client en Liberty.

Configuración del SDK de Spring Boot for Java

Puede configurar App ID para que funcione con aplicaciones de Spring Boot.

Antes de empezar

Debe tener los siguientes requisitos previos:

  • Una instancia del servicio App ID
  • Un conjunto de credenciales de servicio
  • Un proyecto Java + Maven
  • Apache Maven 3.5 o superior
  • Java 1.8
  • Spring Boot 2.0 y Security OAuth 2.0 o superior

Inicialización de la infraestructura de Spring Boot

  1. Añada el siguiente código entre las etiquetas <project> </project> en su archivo Maven pom.xml.

    <parent>
       <groupId>org.springframework.boot</groupId>
       <artifactId>spring-boot-starter-parent</artifactId>
       <version>2.0.2.RELEASE</version>
       <relativePath/>
    </parent>
    
  2. Añada las dependencias siguientes al archivo pom.xml de Maven.

    <dependencies>
       <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-web</artifactId>
       </dependency>
       <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-security</artifactId>
       </dependency>
       <dependency>
             <groupId>org.springframework.security.oauth.boot</groupId>
             <artifactId>spring-security-oauth2-autoconfigure</artifactId>
             <version>2.0.0.RELEASE</version>
       </dependency>
    </dependencies>
    
  3. En el mismo archivo, incluya el plugin de Maven.

    <plugin>
       <groupId>org.springframework.boot</groupId>
       <artifactId>spring-boot-maven-plugin</artifactId>
    </plugin>
    

Inicialización de OAuth2

  1. Añada las anotaciones siguientes al archivo Java.

    @SpringBootApplication
    @EnableOAuth2Sso
    
  2. Amplíe la clase con WebSecurityConfigurerAdapter.

  3. Altere temporalmente cualquier configuración de seguridad y registre el punto final protegido.

       @Override
       protected void configure(HttpSecurity http) throws Exception {
          http.authorizeRequests()
                   .antMatchers("/protected_Resource").authenticated()
                   .and().logout().logoutSuccessUrl("/").permitAll();
       }
    

Adición de credenciales

  1. Obtenga las credenciales de una de las formas siguientes.

    • Vaya al separador Aplicaciones del panel de control de App ID. Si aún no dispone de una, puede pulsar Añadir aplicación para crear una nueva.

    • Realizando una solicitud POST al punto final de /management/v4/<tenantID>/applications.

      Formato de la solicitud:

      curl -X POST \  https://us-south.appid.cloud.ibm.com/management/v4/39a37f57-a227-4bfe-a044-93b6e6060b61/applications/ \
      -H 'Content-Type: application/json' \
      -H 'Authorization: Bearer <IAMToken>' \
      -d '{"name": "ApplicationName"}'
      

      Respuesta de ejemplo:

      {
      "clientId": "111c22c3-38ea-4de8-b5d4-338744d83b0f",
      "tenantId": "39a37f57-a227-4bfe-a044-93b6e6060b61",
      "secret": "ZmE5ZDQ5ODctMmA1ZS00OGRiLWExZDMtZTA1MjkyZTc4MDB4",
      "name": "ApplicationName",
      "oAuthServerUrl": "https://us-south.appid.cloud.ibm.com/oauth/v4/39a37f57-a227-4bfe-a044-93b6e6060b61"
      }
      
  2. Añada un archivo de configuración application.yml al directorio /springbootsample/src/main/resources/. Puede completar la configuración con la información de las credenciales de servicio.

    security:
    oauth2:
       client:
       clientId: <clientID>
       clientSecret: <clientSecret>
       accessTokenUri: <oauthServerURL>/token
       userAuthorizationUri: <oauthServerURL>/authorization
       resource:
       userInfoUri: <oauthServerURL>/userinfo
    

Utilización de App ID con otros idiomas

Con un SDK de cliente compatible con OIDC, puede utilizar App ID con otros lenguajes. Consulte la lista de bibliotecas certificadas para obtener más información.

Próximos pasos

Con App ID instalado en la aplicación, casi está listo para iniciar la autenticación de usuarios. A continuación, intente realizar una de las siguientes actividades: