To get the Google Contacts with Javascript using Google Contacts Api
To Pull the google contacts we need to create a project in google developer consoleCreate a Google application in Google Developers Console for obtaining your Client id and Client secret
- Go to Google Google Developers Console and login with your google account.
- create one a project by clicking Create Project Button
- Go into the newly created project
- Click On the Menu icon and select the Api Manager Link
- Search for “Contacts API” and click on it
-
- Enable the “Contacts API” by hitting the “Enable API” button
-
-
Below is the code to pull the contacts from google relplace client id with newly created client id
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title>Google Contacts</title> | |
| </head> | |
| <body> | |
| Body ..... | |
| <div id="con"> </div> | |
| <button onclick="auth();">GET CONTACTS FEED</button> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> | |
| <script src="https://apis.google.com/js/client.js"></script> | |
| <script type="text/javascript"> | |
| function auth() { | |
| var config = { | |
| 'client_id': "client_id", | |
| 'scope': 'https://www.googleapis.com/auth/contacts.readonly' | |
| }; | |
| gapi.auth.authorize(config, function() { | |
| fetch(gapi.auth.getToken()); | |
| }); | |
| } | |
| function fetch(token) { | |
| $.ajax({ | |
| url: "https://www.google.com/m8/feeds/contacts/default/full?access_token=" + token.access_token + "&alt=json", | |
| dataType: "jsonp", | |
| success:function(data) { | |
| // display all your data in console | |
| // console.log(JSON.stringify(data)); | |
| // $("#con").html(data); | |
| var data=data; | |
| var entry=data.feed.entry; | |
| $( entry ).each(function( index,vaule ) { | |
| var phone=""; | |
| if(vaule.gd$phoneNumber){ | |
| phone=" Phone No:"+vaule.gd$phoneNumber[0].$t; | |
| } | |
| var cont="<div> <span>"+index+" </span>"+ vaule.title.$t+phone+"</div>"; | |
| $("#con").append(cont); | |
| }); | |
| } | |
| }); | |
| } | |
| </script> | |
| </body> | |
| </html> |
