2016-05-19 12 views
0

Wir möchten mit jedem Google-Konto anmelden.
Wir haben die client_id, client_secret von Google-Entwicklern erstellt.wie Sie sich mit Google-Konto anmelden

Bitte sagen Sie mir, wie es geht.
Was wir unter

OAuth 2.0-Client-IDs Typ ist Webapplikation

Ich habe diesen Fehler geschrieben, dass Code getan: invalid_client Das OAuth-Client nicht gefunden wurde

enter image description here

bitte irgendeins, warum es kommt

var CLIENT_ID = '349212001841-t1qnhfhp7ail46dh5rn1t6vdc10op93l.apps.googleusercontent.com'; 
 
\t \t \t 
 
\t \t \t \t var SCOPES = [ 'https://www.googleapis.com/auth/gmail.readonly' ]; 
 
\t \t \t 
 
\t \t \t \t function checkAuth() { 
 
\t \t \t \t \t gapi.auth.authorize({ 
 
\t \t \t \t \t \t 'client_id' : CLIENT_ID, 
 
\t \t \t \t \t \t 'scope' : SCOPES.join(' '), 
 
\t \t \t \t \t \t 'immediate' : true 
 
\t \t \t \t \t }, handleAuthResult); 
 
\t \t \t \t } 
 
\t \t \t 
 
\t \t \t \t function handleAuthResult(authResult) { 
 
\t \t \t \t \t var authorizeDiv = document.getElementById('authorize-div'); 
 
\t \t \t \t \t if (authResult && !authResult.error) { 
 
\t \t \t \t \t \t authorizeDiv.style.display = 'none'; 
 
\t \t \t \t \t \t loadGmailApi(); 
 
\t \t \t \t \t } else { 
 
\t \t \t \t \t \t authorizeDiv.style.display = 'inline'; 
 
\t \t \t \t \t } 
 
\t \t \t \t } 
 
\t \t \t 
 
\t \t \t \t function handleAuthClick(event) { 
 
\t \t \t \t \t gapi.auth.authorize({ 
 
\t \t \t \t \t \t client_id : CLIENT_ID, 
 
\t \t \t \t \t \t scope : SCOPES, 
 
\t \t \t \t \t \t immediate : false 
 
\t \t \t \t \t }, handleAuthResult); 
 
\t \t \t \t \t return false; 
 
\t \t \t \t } 
 
\t \t \t 
 
\t \t \t \t function loadGmailApi() { 
 
\t \t \t \t \t gapi.client.load('gmail', 'v1', listLabels); 
 
\t \t \t \t } 
 
\t \t \t 
 
\t \t \t \t function listLabels() { 
 
\t \t \t \t \t var request = gapi.client.gmail.users.labels.list({ 
 
\t \t \t \t \t \t 'userId' : 'me' 
 
\t \t \t \t \t }); 
 
\t \t \t 
 
\t \t \t \t \t request.execute(function(resp) { 
 
\t \t \t \t \t \t var labels = resp.labels; 
 
\t \t \t \t \t \t appendPre('Labels:'); 
 
\t \t \t 
 
\t \t \t \t \t \t if (labels && labels.length > 0) { 
 
\t \t \t \t \t \t \t for (i = 0; i < labels.length; i++) { 
 
\t \t \t \t \t \t \t \t var label = labels[i]; 
 
\t \t \t \t \t \t \t \t appendPre(label.name) 
 
\t \t \t \t \t \t \t } 
 
\t \t \t \t \t \t } else { 
 
\t \t \t \t \t \t \t appendPre('No Labels found.'); 
 
\t \t \t \t \t \t } 
 
\t \t \t \t \t }); 
 
\t \t \t \t } 
 
\t \t \t 
 
\t \t \t function appendPre(message) { 
 
\t \t \t \t \t var pre = document.getElementById('output'); 
 
\t \t \t \t \t var textContent = document.createTextNode(message + '\n'); 
 
\t \t \t \t \t pre.appendChild(textContent); 
 
\t \t \t \t }
<!DOCTYPE HTML> 
 
<html> 
 
    \t <head> 
 
    \t \t <meta charset="UTF-8"> 
 
    \t \t <title>LoginSN</title> 
 
    \t \t <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> 
 
    \t \t <!-- 
 
    \t \t \t <link rel="shortcut icon" href="images/favicon.png"> 
 
    \t \t \t <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> 
 
    \t \t --> 
 
    \t \t <link href="jqueryMobile/jquery.mobile-1.4.5.css" rel="stylesheet"> 
 
    \t \t <link rel="stylesheet" href="css/main.css"> 
 
    \t \t <script>window.$ = window.jQuery = WLJQ;</script> 
 
    \t \t <script src="jqueryMobile/jquery.mobile-1.4.5.js"></script> 
 
    \t \t <script src="https://apis.google.com/js/client.js?onload=checkAuth"/></script> 
 
    \t \t 
 
    </head> 
 
\t \t 
 
    \t <body style="display: none;"> 
 
    \t 
 
    \t \t <div data-role="page" id="loginPage"> 
 
    \t \t \t <div data-role="content" style="padding: 15px"> 
 
    \t \t \t \t <h1 id="fb-welcome"></h1> 
 
\t \t \t \t \t <label for="text">User Name:</label><input type="text" name="text" id="unL"> 
 
\t \t \t \t \t <label for="text">Password:</label><input type="password" name="text" id="pwdL"> 
 
\t \t \t \t \t <a href="#dashboardPage" data-role="button" id="buttonLn">LOGIN</a> 
 
\t \t \t \t \t <a href="#registrationPage" data-role="button" id="buttonRe">REGISRASTION</a> 
 
\t \t \t \t \t <a href="#" data-role="button" id="buttonF" onclick="fblogin()">via Facebook Login</a> 
 
\t \t \t \t \t <!-- <a href="#" data-role="button" id="login" class="g-signin2" data-onsuccess="onSignIn">via Google Login</a> --> 
 
\t \t \t \t \t <!-- <a href="#" data-role="button" id="login" onclick="callGoogle()">via Google Login</a> --> 
 
\t \t \t \t \t 
 
\t \t \t \t \t <!-- <a href="#" data-role="button" id="login" onclick="login('google')">via Google Login</a> --> 
 
\t \t \t \t \t <div id="authorize-div" > 
 
\t \t \t \t \t <span>Authorize access to Gmail API</span> 
 
\t \t \t \t \t <a href="#" data-role="button" id="authorize-button" onclick="handleAuthClick(event)">via Google Login</a> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
    \t \t </div> 
 
      <div data-role="page" id="dashboardPage"> 
 
    \t \t \t <div data-role="content" style="padding: 15px"> 
 
    \t \t \t \t <a href="#" data-role="button" onclick='Logout();'>LogOut</a> 
 
    \t \t \t </div> 
 
    \t \t </div> 
 
    \t \t 
 
    \t \t <script src="js/initOptions.js"></script> 
 
    \t \t <script src="js/main.js"></script> 
 
    \t \t <script src="js/messages.js"></script> 
 
    \t \t 
 
    \t </body> 
 
</html>

+0

Ich bin nicht in der Lage, Google Login Pop in meiner Anwendung zu sehen –

+0

Sieht hier für ähnliche Frage: http://StackOverflow.com/Questions/17943745/ibm-Worklight-how-to-use-google-authentication-in- A-Hybrid-Anwendung –

+0

Idan ich änderte die Frage und den Code finden Sie es bitte. Ich habe Fehler, warum es kommt, lass es mich wissen –

Antwort

0

Ich glaube, Sie könnten das Javascript von Google Hinzufügen verpasst haben, <script src="https://apis.google.com/js/client.js?onload=checkAuth">

Basierend auf dem Codebeispiel von Google in ihre document:

<html> 
<head> 
<script type="text/javascript"> 
    // Your Client ID can be retrieved from your project in the Google 
    // Developer Console, https://console.developers.google.com 
    var CLIENT_ID = '<YOUR_CLIENT_ID>'; 

    var SCOPES = ['https://www.googleapis.com/auth/gmail.readonly']; 

    /** 
    * Check if current user has authorized this application. 
    */ 
    function checkAuth() { 
    gapi.auth.authorize(
     { 
     'client_id': CLIENT_ID, 
     'scope': SCOPES.join(' '), 
     'immediate': true 
     }, handleAuthResult); 
    } 

    /** 
    * Handle response from authorization server. 
    * 
    * @param {Object} authResult Authorization result. 
    */ 
    function handleAuthResult(authResult) { 
    var authorizeDiv = document.getElementById('authorize-div'); 
    if (authResult && !authResult.error) { 
     // Hide auth UI, then load client library. 
     authorizeDiv.style.display = 'none'; 
     loadGmailApi(); 
    } else { 
     // Show auth UI, allowing the user to initiate authorization by 
     // clicking authorize button. 
     authorizeDiv.style.display = 'inline'; 
    } 
    } 

    /** 
    * Initiate auth flow in response to user clicking authorize button. 
    * 
    * @param {Event} event Button click event. 
    */ 
    function handleAuthClick(event) { 
    gapi.auth.authorize(
     {client_id: CLIENT_ID, scope: SCOPES, immediate: false}, 
     handleAuthResult); 
    return false; 
    } 

    /** 
    * Load Gmail API client library. List labels once client library 
    * is loaded. 
    */ 
    function loadGmailApi() { 
    gapi.client.load('gmail', 'v1', listLabels); 
    } 

    /** 
    * Print all Labels in the authorized user's inbox. If no labels 
    * are found an appropriate message is printed. 
    */ 
    function listLabels() { 
    var request = gapi.client.gmail.users.labels.list({ 
     'userId': 'me' 
    }); 

    request.execute(function(resp) { 
     var labels = resp.labels; 
     appendPre('Labels:'); 

     if (labels && labels.length > 0) { 
     for (i = 0; i < labels.length; i++) { 
      var label = labels[i]; 
      appendPre(label.name) 
     } 
     } else { 
     appendPre('No Labels found.'); 
     } 
    }); 
    } 

    /** 
    * Append a pre element to the body containing the given message 
    * as its text node. 
    * 
    * @param {string} message Text to be placed in pre element. 
    */ 
    function appendPre(message) { 
    var pre = document.getElementById('output'); 
    var textContent = document.createTextNode(message + '\n'); 
    pre.appendChild(textContent); 
    } 

</script> 
<script src="https://apis.google.com/js/client.js?onload=checkAuth"> 
</script> 
</head> 
<body> 
<div id="authorize-div" style="display: none"> 
    <span>Authorize access to Gmail API</span> 
    <!--Button for the user to click to initiate auth sequence --> 
    <button id="authorize-button" onclick="handleAuthClick(event)"> 
    Authorize 
    </button> 
</div> 
<pre id="output"></pre> 
</body> 
</html> 

bitte, dass hinzufügen und Ich denke, das sollte funktionieren. Aktualisieren Sie uns, wenn es Fortschritte gibt.

+0

Vielen Dank Rebot für Antwort geben. Ich habe Zweifel in Developer Console zum Erstellen von Client-ID, d. h. welcher Typ sollte es wie Android oder Webapp nehmen. Weil wir diese App für die hybride mobile Anwendung in worklight 7.1 entwickeln. –

+0

Rebot ich habe es diesen Fehler Fehler: invalid_client. Der OAuth-Client wurde nicht gefunden. Wenn Sie auf die Schaltfläche klicken, öffnet sich ein Fenster und zeigt wie oben bei error.i angefügten Screenshots die Frage –

+0

invalid_client. Der OAuth-Client wurde nicht gefunden Fehler tritt auf. Kein Fehler im Fehlerprotokoll, nur der hier angegebene Seitenladefehler. Ich versuche, alle Möglichkeiten zu lösen mit diesem Link http://stackoverflow.com/questions/17166848/invalid-client-in-google-oauth2 –

0

Es sieht so aus, als hätten Sie <> um die Client-ID. Du willst diese nicht.

+0

Tony, tut mir leid, ich verstehe es nicht. –

+0

@kranti, in Ihrem ersten Bild sehe ich client_id = <34921 ..., es sollte nicht <. es sollte client_id = 34921 sein ... –