Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Now we use GoogleAPI with Google+</p> <p>As on December 2013, here is the most updated website;</p> <p><a href="https://developers.google.com/+/">https://developers.google.com/+/</a></p> <p>Then for SignIn for Web</p> <p><a href="https://developers.google.com/+/web/signin/">https://developers.google.com/+/web/signin/</a></p> <p>Choosing a sign-in flow</p> <p>->Client-side flow</p> <p>-><strong>Initiate the sign-in flow with JavaScript</strong> (<em>I believe this is the latest technology</em>)</p> <p><a href="https://developers.google.com/+/web/signin/javascript-flow">https://developers.google.com/+/web/signin/javascript-flow</a></p> <blockquote> <p>Initiating the Google+ Sign-In flow with JavaScript</p> <p>You can start the Google+ Sign-In flow by using the <strong>gapi.auth.signIn()</strong> method. This method gives you a lot of flexibility to decide how and when to prompt the user to authorize your app and sign-in.</p> </blockquote> <p><a href="https://developers.google.com/+/web/api/javascript#gapiauthsigninparameters">https://developers.google.com/+/web/api/javascript#gapiauthsigninparameters</a></p> <blockquote> <p><strong>gapi.auth.signIn(parameters)</strong></p> <p>Initiates the client-side Google+ Sign-In OAuth 2.0 flow. Similar to gapi.auth.authorize() except that this method supports the advanced Google+ Sign-In features, including over-the-air installs of Android apps. This method is a JavaScript alternative to using the Google+ Sign-In button widget.</p> </blockquote> <p><a href="https://developers.google.com/+/web/signin/javascript-flow">https://developers.google.com/+/web/signin/javascript-flow</a></p> <ul> <li><strong>Try it</strong> Page to trigger the sign-in flow with <strong>gapi.auth.signIn()</strong></li> </ul> <p><a href="https://google-developers.appspot.com/+/demos/signin_demo_render">https://google-developers.appspot.com/+/demos/signin_demo_render</a> (SourceCode)</p> <p>You will try this and for your own, follow</p> <p>Step 1: Create a client ID and client secret </p> <p>Ignore the following step,</p> <p>Actually, you need clientID only and replace the one in the source code of <strong>Try it</strong> above.</p> <p>Add scope <a href="https://www.googleapis.com/auth/userinfo.email">https://www.googleapis.com/auth/userinfo.email</a></p> <pre><code>var options = { 'callback': loginFinished, 'approvalprompt': 'force', 'clientid': 'YOURID.apps.googleusercontent.com', 'scope': 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email', 'requestvisibleactions': 'http://schemas.google.com/CommentActivity http://schemas.google.com/ReviewActivity', 'cookiepolicy': 'single_host_origin' }; </code></pre> <p>Add </p> <pre><code>gapi.client.load('oauth2', 'v2', function() { gapi.client.oauth2.userinfo.get() .execute(function(resp) { // Shows user email console.log(resp.email); }); }); </code></pre> <p>Here is the full working and concise code based on the above:</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;title&gt;Google+ Sign-in button demo: rendering with JavaScript&lt;/title&gt; &lt;style type="text/css"&gt; html, body { margin: 0; padding:0;} #signin-button { padding: 5px; } #oauth2-results pre { margin: 0; padding:0; width: 600px;} .hide { display: none;} .show { display: block;} &lt;/style&gt; &lt;script src="https://apis.google.com/js/client:platform.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; var loginFinished = function(authResult) { if (authResult) { console.log(authResult); } gapi.client.load('oauth2', 'v2', function() { gapi.client.oauth2.userinfo.get() .execute(function(resp) { // Shows user email console.log(resp.email); }); }); }; var options = { 'callback': loginFinished, 'approvalprompt': 'force', 'clientid': 'YOURID.apps.googleusercontent.com', 'scope': 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email', 'requestvisibleactions': 'http://schemas.google.com/CommentActivity http://schemas.google.com/ReviewActivity', 'cookiepolicy': 'single_host_origin' }; var renderBtn = function() { gapi.signin.render('renderMe', options); } &lt;/script&gt; &lt;/head&gt; &lt;body onload ="renderBtn()"&gt; &lt;div id="renderMe"&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <h2>No HTML output, but console. so open browser's Developers Console tools to view the result.</h2>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload