¿Cómo autenticarse con Google a través de OAuth 2.0 en una ventana emergente?

Perdón por una gran edición. Estoy empezando de nuevo ya que no estoy diciendo mi pregunta correctamente.¿Cómo autenticarse con Google a través de OAuth 2.0 en una ventana emergente?

Estoy tratando de escribir una aplicación del lado del cliente en HTML5. No quiero que se aloje en un sitio web. Ni siquiera estoy seguro de que esto sea posible, soy bastante nuevo en este tipo de aplicaciones.

De todos modos, quiero acceder a los servicios de Google, que requieren autenticación como OAuth. Siendo que es javascript, parece que OAuth2 es lo que necesito.

Estoy tratando de abrir la autenticación de Google en una ventana emergente (tengo esta parte), dejar que el usuario permita el acceso, y luego pasar el flujo a mi aplicación que luego puede consultar los servicios de Google. El problema es 1. le pide al usuario que copie/pegue un token en la aplicación cada vez que uso response_type=code, pero si uso response_type=token, necesito que vuelva a dirigirme a una URL válida que, dado que no está alojada en un servidor web, existe es ninguno

Entonces, ¿cómo puedo usar OAuth y permitir que el usuario conceda acceso sin problemas?

Fuente

2011-10-30 esac

Comprobar esta respuesta http://stackoverflow.com/a/38094113/1153703 –

podrá tener una URL de redireccionamiento definido para Google a redireccionar después se realiza la autenticación. Si no puede alojar sus páginas en ningún sitio web, puede hospedarlo en el host local.

En cuanto a obtener el token de acceso desde la ventana emergente a la ventana principal principal, puede configurar un temporizador en la ventana principal que sigue comprobando la ubicación del documento de la ventana emergente. Una vez que la ubicación del documento coincide con la URL de redireccionamiento, puede analizar el token de acceso, que estará en la propia URL.

escribí un tutorial sobre exactamente el mismo problema (utilizando host local) de ayer y aquí está el enlace: http://www.gethugames.in/2012/04/authentication-and-authorization-for-google-apis-in-javascript-popup-window-tutorial.html

Esperamos que encuentre útil.

Fuente

2012-04-25 06:23:34 saiy2k

Leí su tutorial, y me pregunto si es posible obtener el token de la manera que sugiere, y una vez que el token se almacena en la ventana principal, use php para hacer llamadas a la API. La razón por la que lo quisiera de esta manera es que estoy usando la biblioteca google-api-php-client. GRACIAS – IberoMedia

Creo que habrá funciones en la biblioteca google-api-php para autorizar y obtener el token de acceso. ¿Por qué no puedes usarlos? http://code.google.com/p/google-api-php-client/wiki/OAuth2 – saiy2k

Porque intento implementar una serie de formularios o un proceso. Si el token de acceso o el token de actualización no están disponibles, el usuario debe autorizar el acceso al calendario y a las hojas de cálculo, b/c en cada etapa del proceso o después del envío de un formulario (proceso de formulario multiparte) hay una grabación del tiempo transcurrido y forma datos en el calendario y la hoja de cálculo. El problema con el uso de la biblioteca php es que luego se abre en la misma página, y no tengo manera de devolver la POST desde el primer formulario de proceso de lanzamiento. – IberoMedia

Para evitar un posible click jacking, la autenticación de Google obliga a acceder a la página completa. No creo que puedas controlar eso.

EDITAR después del comentario, aquí es un código extraído de la Google OAuth2 page que lo hace:

<body> 
    <a href="javascript:poptastic('https://accounts.google.com/o/oauth2/auth?scope=https://www.google.com/m8/feeds&client_id=21302922996.apps.googleusercontent.com&redirect_uri=https://www.example.com/back&response_type=token');">Try 
    out that example URL now</a> 
<script> 
    function poptastic(url) { 
     var newWindow = window.open(url, 'name', 'height=600,width=450'); 
     if (window.focus) { 
     newWindow.focus(); 
     } 
    } 

</script> 
</body>

Fuente

2011-10-30 19:26:35 Mic

no estoy seguro de que esto es cierto. En su propio sitio web de ejemplo en http://code.google.com/apis/accounts/docs/OAuth2.html#ClientLibraries, hay un enlace que dice "Pruebe ahora una URL de ejemplo" que, si se hace clic en, la abre en un nuevo ventana emergente. – esac

He actualizado la respuesta. Traté de insertarlo en un iframe que podría ser la razón de redirigir la página. Gracias por la información. – Mic

Lo siento, ya pude obtener esa parte. Se abre la ventana, pero quiere que copie/pegue un token de autenticación en la aplicación cliente que no quiero ... Quiero que el usuario haga clic en 'permitir' y luego simplemente continúe. Esta es la parte que no puedo entender. – esac

He escrito una mini biblioteca JS para la tarea, tómela y vea si le funciona.

https://github.com/timdream/wordcloud/blob/master/go2.js

estoy desarrollando recientemente otro proyecto que se basan en el mismo guión, así que estoy aislando éste en an independent library project ... comprobar el progreso sigue (si hay).

Fuente

2012-10-11 06:17:58 timdream

Por cierto, http://timc.idv.tw/wordcloud/ * es * la aplicación web exactamente del lado del cliente que se autentica con Google de la manera que usted exactamente quería. – timdream

Creo que puede utilizar google api (gapi) para Oauth en Javascript. Aquí está la documentación: Authentication using the Google APIs Client Library for JavaScript

Usted no va a requerir al usuario copiar/pegar todos los códigos y que no será necesario proporcionar un URI de redirección

Todo lo que necesita hacer es: Ir a su proyecto en Google Developers Console y genere lo siguiente: 1. Genere un nuevo ID de cliente y elija las opciones 'Aplicación instalada' y 'Otro'. 2.Generar una API de clave pública

código de ejemplo de la documentación anterior:

// Set the required information 
var clientId = 'YOUR CLIENT ID'; 
var apiKey = 'YOUR API KEY'; 
var scopes = 'https://www.googleapis.com/auth/plus.me'; 

// call the checkAuth method to begin authorization 
function handleClientLoad() { 
    gapi.client.setApiKey(apiKey); // api key goes here 
    window.setTimeout(checkAuth,1); 
} 

// checkAuth calls the gapi authorize method with required parameters 
function checkAuth() { 
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult); // scope and client id go here 
} 

// check that there is no error and makeApi call 
function handleAuthResult(authResult) { 
    var authorizeButton = document.getElementById('authorize-button'); 
    if (authResult && !authResult.error) { 
    makeApiCall(); 
    } 
} 

// API call can be made like this: 
function makeApiCall() { 
    gapi.client.load('plus', 'v1', function() { 
    var request = gapi.client.plus.people.get({ 
     'userId': 'me' 
    }); 
    request.execute(function(resp) { 
     var heading = document.createElement('h4'); 
     var image = document.createElement('img'); 
     image.src = resp.image.url; 
     heading.appendChild(image); 
     heading.appendChild(document.createTextNode(resp.displayName)); 

     document.getElementById('content').appendChild(heading); 
    }); 
    }); 
}

Fuente

2014-08-09 11:59:49 mlfan

¿Cómo autenticarse con Google a través de OAuth 2.0 en una ventana emergente?

Respuesta

Cuestiones relacionadas