Google SignIn with Node.js to a Couchbase Mobile Application

El uso de las API de OAuth proporcionadas por aplicaciones de terceros, como Google+, para iniciar sesión en tu aplicación móvil puede ofrecer a los usuarios una primera experiencia agradable. Pueden iniciar sesión con una cuenta que ya conocen y en la que confían y rellenar su perfil con los datos que introdujeron en Google+. En este tutorial, usted aprenderá cómo:

Escribe una aplicación Node.js para gestionar la autenticación con Sync Gateway.
Utiliza la API REST de Couchbase Sync Gateway Admin para crear usuarios y sesiones.
Integrar Google Sign-In en una aplicación iOS escrita con Swift 2.
Cree una aplicación iOS sencilla en Swift para probar el nuevo punto final de inicio de sesión y replicar algunos documentos.

El proyecto final puede consultarse en GitHub.

Requisitos previos

Los requisitos previos para este tutorial son:

Node.js
Xcode 7+ (utilizarás Swift 2 para crear la aplicación de ejemplo)

Primeros pasos

Descargue Sync Gateway desde el siguiente enlace y descomprima el archivo:

https://www.couchbase.com/nosql-databases/downloads

En un nuevo archivo llamado sync-gateway-config.jsonpegue lo siguiente:

{
  "log": ["*"],
  "databases": {
    "simple-login": {
      "server": "walrus:",
      "users": { "GUEST": { "disabled": true } },
      "sync": `
        function(doc, oldDoc) {
          channel(doc._id);
          access(doc.user_id, doc._id);
        }
      `
    }
  }
}

{

"log": ["*"],

"databases": {

"simple-login": {

"server": "walrus:",

"users": { "GUEST": { "disabled": true } },

"sync": `

function(doc, oldDoc) {

channel(doc._id);

access(doc.user_id, doc._id);

}

En este archivo de configuración, está creando una base de datos llamada simple-login y utilizando la función de sincronización para asignar cada documento a un canal diferente y conceder a un usuario acceso al canal (el nombre de usuario se almacena en el archivo usuario_id del documento).

Inicie Sync Gateway con el siguiente comando:

$ ~/Downloads/couchbase-sync-gateway/bin/sync_gateway sync-gateway-config.json

1	$ ~/Downloads/couchbase-sync-gateway/bin/sync_gateway sync-gateway-config.json

Proxy inverso para Sync Gateway

Con Sync Gateway en funcionamiento, podrá centrarse en crear el servidor de aplicaciones para gestionar la autenticación entre Google y Sync Gateway.

Utilizará el popular Express para gestionar la solicitud de creación de un usuario y el módulo solicitar para dirigir el resto del tráfico a Sync Gateway.

Instala los siguientes módulos de Node.js:

$ npm install express body-parser request --save

1	$ npm install express body-parser request --save

Cree un nuevo archivo llamado servidor.js y añade lo siguiente:

// 1
var express = require('express')
  , bodyParser = require('body-parser')
  , request = request('request').defaults({json: true});

// 2
var app = express();
app.use('/google_signin', bodyParser.json());

app.post('/google_signin', function (req, res) {
  // TODO: handle login request
});

// 3
app.all('*', function (req, res) {
  var url = 'https://0.0.0.0:4984' + req.url;
  req.pipe(request(url)).pipe(res);
});

// 4
var server = app.listen(8000, function () {
  var host = server.address().address;
  var port = server.address().port;

  console.log('App listening at https://%s:%s', host, port);
});

// 1

var express = require('express')

, bodyParser = require('body-parser')

, request = request('request').defaults({json: true});

// 2

var app = express();

app.use('/google_signin', bodyParser.json());

app.post('/google_signin', function (req, res) {

// TODO: handle login request

});

// 3

app.all('*', function (req, res) {

var url = 'https://0.0.0.0:4984' + req.url;

req.pipe(request(url)).pipe(res);

});

// 4

var server = app.listen(8000, function () {

var host = server.address().address;

var port = server.address().port;

console.log('App listening at https://%s:%s', host, port);

});

Estas son las diferentes cosas que suceden:

Requiere el módulo Node.js que instalaste anteriormente.
Instanciar una nueva instancia de express y utilizar la función bodyParser middleware sólo para el /google_signin punto final.
Proxy todas las demás solicitudes a Sync Gateway.
Inicia el servidor web Node.js en el puerto 8000.

Inicie el servidor con $ node server.js y abrir https://localhost:8000 en su navegador. Debería ver el mensaje de bienvenida de Sync Gateway:

De Google SignIn a las sesiones de Sync Gateway

Una vez instalado el proxy inverso, puede añadir código para gestionar la solicitud de inicio de sesión de Google y devolver las credenciales de sesión:

En este diagrama ocurren varias cosas:

Negro envía el ID de usuario de Google al servidor de aplicaciones.
Azul comprueba si existe un usuario en Sync Gateway con ese ID de usuario.
Naranja crea el usuario si aún no existe (normalmente, la primera vez que el usuario inicia sesión con Google en tu aplicación).
Verde crea una sesión, la respuesta contendrá las credenciales de sesión que se pueden pasar a la aplicación cliente iOS para las réplicas push/pull. Todos los SDKs de Couchbase Lite tienen un método para especificar las credenciales de sesión que se utilizarán en las réplicas push/pull.

En el /google_signin añada lo siguiente:

/** URL of the Sync Gateway instance running locally */
var stringURL = 'https://0.0.0.0:4985/simple-login';

/** Given the name of a user that exists in Sync Gateway, create a new session */
var sessionRequest = function (name, callback) {
return request({
  method: 'POST',
  url: stringURL + '/_session',
  json: true,
  body: {
    name: name
  }
}, callback);
};

var json = req.body;
var name = json.auth_provider + '-' + json.user_id.toString();
request
/** Check if the user already exists */
.get(stringURL + '/_user/' + name)
.on('response', function (userExistsResponse) {
  if (userExistsResponse.statusCode === 404) {
    /** If the user doesn't exist, create one with the Google user ID as the name */
    return request
      .put({
        url: stringURL + '/_user/' + name,
        json: true,
        body: {
          name: name,
          password: Math.random.toString(36).substr(2)
        }
      })
      .on('response', function (createUserResponse) {
        if (createUserResponse.statusCode === 201) {
          /** If the user was created successfully, create the session */
          sessionRequest(name, function (sessionError, sessionResponse, body) {
            res.send(body);
          });
        }
      });
  }
  /** The user already exists, simply create a new session */
  sessionRequest(name, function (sessionError, sessionResponse, body) {
    res.send(body);
  });
});

/** URL of the Sync Gateway instance running locally */

var stringURL = 'https://0.0.0.0:4985/simple-login';

/** Given the name of a user that exists in Sync Gateway, create a new session */

var sessionRequest = function (name, callback) {

return request({

method: 'POST',

url: stringURL + '/_session',

json: true,

body: {

name: name

}

}, callback);

};

var json = req.body;

var name = json.auth_provider + '-' + json.user_id.toString();

request

/** Check if the user already exists */

.get(stringURL + '/_user/' + name)

.on('response', function (userExistsResponse) {

if (userExistsResponse.statusCode === 404) {

/** If the user doesn't exist, create one with the Google user ID as the name */

return request

.put({

url: stringURL + '/_user/' + name,

json: true,

body: {

name: name,

password: Math.random.toString(36).substr(2)

}

})

.on('response', function (createUserResponse) {

if (createUserResponse.statusCode === 201) {

/** If the user was created successfully, create the session */

sessionRequest(name, function (sessionError, sessionResponse, body) {

res.send(body);

});

}

});

}

/** The user already exists, simply create a new session */

sessionRequest(name, function (sessionError, sessionResponse, body) {

res.send(body);

});

Reinicia la aplicación Node.js y ejecuta la siguiente petición curl para dar de alta un nuevo usuario:

$ curl -vX POST 
            -H 'Content-Type: application/json' 
            https://localhost:8000/google_signin 
            -d '{"user_id": "123", "auth_provider": "google"}'

// Response         
{
    "session_id":"8520c19159a4154abf5fb9b9003ff9677e035929",
    "expires":"2015-10-13T12:48:05.879325313+01:00",
    "cookie_name":"SyncGatewaySession"
}

$ curl -vX POST

-H 'Content-Type: application/json'

https://localhost:8000/google_signin

-d '{"user_id": "123", "auth_provider": "google"}'

// Response

{

"session_id":"8520c19159a4154abf5fb9b9003ff9677e035929",

"expires":"2015-10-13T12:48:05.879325313+01:00",

"cookie_name":"SyncGatewaySession"

}

En la siguiente sección, crearás una sencilla aplicación iOS con Swift 2 para utilizar la nueva funcionalidad de tu App Server.

Swift Time: Pantalla de inicio de sesión sencilla para iOS

Cambie a Xcode y cree un nuevo proyecto con la etiqueta Aplicación de vista única plantilla:

Usaremos Cocoapods para instalar dependencias en este proyecto. Cierra el proyecto Xcode y desde la línea de comandos ejecuta $ pod init para migrar su proyecto al uso de Cocoapods. Abra el archivo Podfile y añade las declaraciones:

pod 'Google/SignIn'
pod 'couchbase-lite-ios'

1 2	pod 'Google/SignIn' pod 'couchbase-lite-ios'

Ejecutar Instalación de la vaina $ y abra el SimpleLogin.xcworkspace que se ha generado. A continuación, añadirás una cabecera puente para acceder a los SDK de Google SignIn y CouchbaseLite que utilizan Objective-C desde tu código Swift. En el navegador de proyectos de Xcode, haz clic con el botón derecho en SimpleLogin y selecciona Nuevo archivo.... Elija la plantilla Header File y llámela encabezado-puente.h. Añada las siguientes sentencias import:

#import &lt;Google/SignIn.h&gt;
#import &lt;CouchbaseLite/CouchbaseLite.h&gt;

1 2	#import <Google/SignIn.h> #import <CouchbaseLite/CouchbaseLite.h>

Ahora tienes que decirle a Xcode que utilice este archivo. En la ventana SimpleLogin objetivo, seleccione el Ajustes de construcción y desplácese hasta la pestaña Cabecera puente Objective-C. Añade esta ruta de archivo:

SimpleLogin/bridging-header.h

Archivo de configuración de Google Sign-In

Antes de poder utilizar el SDK de inicio de sesión en tu aplicación, tendrás que crear un nuevo proyecto en Google Developer Console y generar un ID de cliente. Por suerte para nosotros, esto se puede hacer automáticamente con el siguiente enlace:

https://developers.google.com/mobile/add?platform=ios&cntapi=signin&cntapp=Simple%20Login&cntpkg=com.couchbase.SimpleLogin

En la página anterior, haga clic en el botón Elegir y configurar servicios y accederá a una nueva página en la que podrá activar Inicio de sesión en Google. A continuación, haga clic en Generar archivos de configuración y descarga el nuevo archivo plist.

Importar GoogleServer-Info.plist a su proyecto Xcode:

Añadir esquemas de URL a su proyecto

Google Sign-In requiere que se añadan dos esquemas de URL personalizados a su proyecto. Para añadir los esquemas personalizados:

Abra la configuración de su proyecto: haga doble clic en el nombre del proyecto en la vista en árbol de la izquierda. Seleccione su aplicación en el menú OBJETIVOS y, a continuación, seleccione Información y amplíe la pestaña Tipos de URL sección.
Haga clic en el botón + y añada un esquema de URL para su ID de cliente invertido. Para encontrar este valor, abra la ventana GoogleService-Info.plist y busque el campo REVERSED_CLIENT_ID clave. Copie el valor de esa tecla y péguelo en el campo Esquemas de URL en la página de configuración. Deje los demás campos en blanco.
Haga clic en el botón + y añada un segundo esquema de URL. Este es el mismo que el ID del paquete de tu aplicación. En este caso, debería ser com.couchbase.SimpleLogin.

Una vez completado, su configuración debe ser algo similar a lo siguiente (pero con los valores específicos de su aplicación):

Cómo integrar el inicio de sesión de Google en tu aplicación para iOS

Ahora que tu proyecto está configurado correctamente puedes empezar a usar el SDK para añadir el botón de Login en la UI y la lógica de la aplicación para recuperar la información del usuario. En AppDelegate.swiftdeclara que esta clase implementa el método GIDSignInDelegate y añada lo siguiente en el campo application:didFinishLaunchingConOpciones: método:

func application(application: UIApplication,
  didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -&gt; Bool {
    // Initialize sign-in
    var configureError: NSError?
    GGLContext.sharedInstance().configureWithError(&amp;configureError)
    assert(configureError == nil, "Error configuring Google services: (configureError)")

    GIDSignIn.sharedInstance().delegate = self

    return true
}

func application(application: UIApplication,

didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

// Initialize sign-in

var configureError: NSError?

GGLContext.sharedInstance().configureWithError(&configureError)

assert(configureError == nil, "Error configuring Google services: (configureError)")

GIDSignIn.sharedInstance().delegate = self

return true

}

A continuación, aplique el aplicación:openURL: del delegado de la aplicación. El método debe llamar al método handleURL método del GIDSignIn que gestionará correctamente la URL que reciba su aplicación al final del proceso de autenticación:

func application(application: UIApplication,
  openURL url: NSURL, sourceApplication: String?, annotation: AnyObject?) -&gt; Bool {
    return GIDSignIn.sharedInstance().handleURL(url,
        sourceApplication: sourceApplication,
        annotation: annotation)
}

func application(application: UIApplication,

openURL url: NSURL, sourceApplication: String?, annotation: AnyObject?) -> Bool {

return GIDSignIn.sharedInstance().handleURL(url,

sourceApplication: sourceApplication,

annotation: annotation)

}

En el delegado de la aplicación, implemente el método GIDSignInDelegate para gestionar el proceso de inicio de sesión mediante la definición de los siguientes métodos:

func signIn(signIn: GIDSignIn!, didSignInForUser user: GIDGoogleUser!,
  withError error: NSError!) {
    if (error == nil) {
      // Perform any operations on signed in user here.
      let userId = user.userID                  // For client-side use only!
      let idToken = user.authentication.idToken // Safe to send to the server
      let name = user.profile.name
      let email = user.profile.email
      // ...
    } else {
      println("(error.localizedDescription)")
    }
}

func signIn(signIn: GIDSignIn!, didSignInForUser user: GIDGoogleUser!,

withError error: NSError!) {

if (error == nil) {

// Perform any operations on signed in user here.

let userId = user.userID // For client-side use only!

let idToken = user.authentication.idToken // Safe to send to the server

let name = user.profile.name

let email = user.profile.email

// ...

} else {

println("(error.localizedDescription)")

}

Añadir el botón de inicio de sesión

A continuación, añadirás el botón de inicio de sesión de Google para que el usuario pueda iniciar el proceso de inicio de sesión. En el controlador de vista que gestiona la pantalla de inicio de sesión de tu aplicación, haz que la clase implemente el método GIDSignInUIDelegado protocolo.

En el controlador de vista, anule el método viewDidLoad para establecer el delegado de interfaz de usuario del objeto GIDSignIn y (opcionalmente) para iniciar sesión de forma silenciosa cuando sea posible.

override func viewDidLoad() {
  super.viewDidLoad()

  GIDSignIn.sharedInstance().uiDelegate = self

  // Uncomment to automatically sign in the user.
  //GIDSignIn.sharedInstance().signInSilently()

  // TODO(developer) Configure the sign-in button look/feel
  // ...
}

override func viewDidLoad() {

super.viewDidLoad()

GIDSignIn.sharedInstance().uiDelegate = self

// Uncomment to automatically sign in the user.

//GIDSignIn.sharedInstance().signInSilently()

// TODO(developer) Configure the sign-in button look/feel

// ...

}

Aplicar la GIDSignInUIDelegado protocolo:

// Implement these methods only if the GIDSignInUIDelegate is not a subclass of
// UIViewController.

// Stop the UIActivityIndicatorView animation that was started when the user
// pressed the Sign In button
func signInWillDispatch(signIn: GIDSignIn!, error: NSError!) {
  myActivityIndicator.stopAnimating()
}

// Present a view that prompts the user to sign in with Google
func signIn(signIn: GIDSignIn!,
    presentViewController viewController: UIViewController!) {
  self.presentViewController(viewController, animated: true, completion: nil)
}

// Dismiss the "Sign in with Google" view
func signIn(signIn: GIDSignIn!,
    dismissViewController viewController: UIViewController!) {
  self.dismissViewControllerAnimated(true, completion: nil)
}

// Implement these methods only if the GIDSignInUIDelegate is not a subclass of

// UIViewController.

// Stop the UIActivityIndicatorView animation that was started when the user

// pressed the Sign In button

func signInWillDispatch(signIn: GIDSignIn!, error: NSError!) {

myActivityIndicator.stopAnimating()

}

// Present a view that prompts the user to sign in with Google

func signIn(signIn: GIDSignIn!,

presentViewController viewController: UIViewController!) {

self.presentViewController(viewController, animated: true, completion: nil)

}

// Dismiss the "Sign in with Google" view

func signIn(signIn: GIDSignIn!,

dismissViewController viewController: UIViewController!) {

self.dismissViewControllerAnimated(true, completion: nil)

}

Añadir un GIDSignInButton a su guión gráfico, archivo XIB, o instanciarlo mediante programación. Para añadir el botón al guión gráfico o al archivo XIB, añada una vista y defina su clase personalizada como GIDSignInButton.

Ejecuta la aplicación y ahora deberías ver el botón con el estilo de Google y poder iniciar sesión:

Creación de una sesión con Sync Gateway

En AppDelegate.swiftencuentre el signIndidSignInForUserwithError y añada lo siguiente debajo del código existente:

// 1
let loginURL = NSURL(string: "https://localhost:8000/google_signin")!

// 2
let session = NSURLSession.sharedSession()
let request = NSMutableURLRequest(URL: loginURL)
request.addValue("application/json", forHTTPHeaderField: "Content-Type")
request.HTTPMethod = "POST"

// 3
var properties = [
    "user_id": userId,
    "auth_provider": "google"
]
let data = try! NSJSONSerialization.dataWithJSONObject(properties, options: NSJSONWritingOptions.PrettyPrinted)

// 4
let uploadTask = session.uploadTaskWithRequest(request, fromData: data, completionHandler: { (data, response, error) -&gt; Void in
    // 5
    let json = try! NSJSONSerialization.JSONObjectWithData(data!, options: NSJSONReadingOptions.AllowFragments) as! Dictionary&lt;String, AnyObject&gt;
    print("(json)")
    
    // TODO: pull/push replications with authenticated user
    
})
uploadTask.resume()

// 1

let loginURL = NSURL(string: "https://localhost:8000/google_signin")!

// 2

let session = NSURLSession.sharedSession()

let request = NSMutableURLRequest(URL: loginURL)

request.addValue("application/json", forHTTPHeaderField: "Content-Type")

request.HTTPMethod = "POST"

// 3

var properties = [

"user_id": userId,

"auth_provider": "google"

]

let data = try! NSJSONSerialization.dataWithJSONObject(properties, options: NSJSONWritingOptions.PrettyPrinted)

// 4

let uploadTask = session.uploadTaskWithRequest(request, fromData: data, completionHandler: { (data, response, error) -> Void in

// 5

let json = try! NSJSONSerialization.JSONObjectWithData(data!, options: NSJSONReadingOptions.AllowFragments) as! Dictionary<String, AnyObject>

print("(json)")

// TODO: pull/push replications with authenticated user

})

uploadTask.resume()

Esto es lo que ocurre arriba:

La URL de inicio de sesión en el App Server que se ejecuta localmente.
Crear una instancia de solicitud.
Serializa las propiedades que contienen el ID de usuario de Google como JSON para enviarlas en la solicitud.
Enviar solicitud POST.
Objeto de respuesta que contiene las credenciales de la sesión de Sync Gateway

NOTA: Antes de ejecutar la aplicación, asegúrese de desactivar la seguridad de App Transport, ya que App Server no utiliza HTTPS. Abra Info.plist y añade lo siguiente:

NSAppTransportSecurity

NSAllowsArbitraryLoads

NSAppTransportSecurity

NSAllowsArbitraryLoads

Construir y ejecutar. Observa la respuesta del App Server en el depurador de Xcode:

Por último, añadirás el código de Couchbase para iniciar una replicación pull con los detalles de la sesión. En AppDelegate.mañada el método startReplications:

func startReplications(sessionInfo: Dictionary&lt;String, String&gt;) {
    // 1
    let dateString = sessionInfo["expires"]!
    let dateFormatter = NSDateFormatter()
    dateFormatter.dateFormat = "yyyy-MM-dd'T'HH:mm:ss.SSSZ"
    let date = dateFormatter.dateFromString(dateString)!
    
    // 2
    let manager = CBLManager.sharedInstance();
    let database = try! manager.databaseNamed("simple-login")
    
    // 3
    let syncGatewayURL = NSURL(string: "https://localhost:8000/simple-login")!
    let pull = database.createPullReplication(syncGatewayURL)
    pull?.continuous = true
    
    // 4
    pull?.setCookieNamed(sessionInfo["cookie_name"]!, withValue: sessionInfo["session_id"]!, path: "/", expirationDate: date, secure: false)
    pull?.start()
}

func startReplications(sessionInfo: Dictionary<String, String>) {

// 1

let dateString = sessionInfo["expires"]!

let dateFormatter = NSDateFormatter()

dateFormatter.dateFormat = "yyyy-MM-dd'T'HH:mm:ss.SSSZ"

let date = dateFormatter.dateFromString(dateString)!

// 2

let manager = CBLManager.sharedInstance();

let database = try! manager.databaseNamed("simple-login")

// 3

let syncGatewayURL = NSURL(string: "https://localhost:8000/simple-login")!

let pull = database.createPullReplication(syncGatewayURL)

pull?.continuous = true

// 4

pull?.setCookieNamed(sessionInfo["cookie_name"]!, withValue: sessionInfo["session_id"]!, path: "/", expirationDate: date, secure: false)

pull?.start()

}

Llama a este método en el callback de la uploadTask que has añadido en el paso anterior.

¡Et voilà! Ahora tiene una replicación pull en ejecución para el usuario con nombre google-{userID}. Puedes probar que el acceso funciona añadiendo un documento con el siguiente comando (sustituye el ID de usuario de Google por el de un usuario ya conectado):

$ curl -vX POST 
        -H 'Content-Type: application/json' 
        https://localhost:4985/simple-login/ 
        -d '{"_id": "1234", "user_id": "google-102898171485172449137"}'

$ curl -vX POST

-H 'Content-Type: application/json'

https://localhost:4985/simple-login/

-d '{"_id": "1234", "user_id": "google-102898171485172449137"}'

Vaya a la pestaña Usuarios de la interfaz de administración en https://localhost:4985/_admin/db/simple-login/users y observe que el usuario google-102898171485172449137 ahora tiene acceso al canal 1234:

¿Qué hacer a partir de ahora?

¡Enhorabuena! Has aprendido a utilizar Google SignIn con Couchbase Mobile para crear una experiencia agradable y sincronizar documentos por el ID de usuario del usuario conectado.

No dudes en compartir tus opiniones, hallazgos o preguntas en los comentarios o en los foros. ¡Hasta pronto!

James Nocentini, Redactor técnico, Móvil, Couchbase

Comparte este artículo

Platform

Self-Managed

Services

Capabilities

Why Couchbase?

Migrate to Capella

By Use Case

By Industry

By Application Need

Popular Docs

By Developer Role

Quickstart

Resource Center

About

Partnerships

Our Services

Partners: Register a Deal

Ready to register a deal with Couchbase?

Marriott

Añadir Google Sign-In con Node.js a una aplicación Couchbase Mobile

Requisitos previos

Primeros pasos

Proxy inverso para Sync Gateway

De Google SignIn a las sesiones de Sync Gateway

Swift Time: Pantalla de inicio de sesión sencilla para iOS

Archivo de configuración de Google Sign-In

Añadir esquemas de URL a su proyecto

Cómo integrar el inicio de sesión de Google en tu aplicación para iOS

Añadir el botón de inicio de sesión

Creación de una sesión con Sync Gateway

¿Qué hacer a partir de ahora?

Recibe actualizaciones del blog de Couchbase en tu bandeja de entrada

Autor

Publicado por James Nocentini

Deja un comentario Cancelar respuesta

¿Listo para empezar con Couchbase Capella?

Empezar a construir

Utilizar Capella gratis

Póngase en contacto