Friday 1 April 2016

Google Calendar Integration in ASP.NET

Google Calendar (v3) Integration in ASP.NET: Create / edit / delete events

How to programmatically create / edit / delete events in the Google calendar (v3) of a Gmail user.

Click the link to Download GoogleCalendarTest


Introduction
This article describes how to programmatically create / edit / delete events in the Google calendar (v3) of a Gmail user. The developer needs to create a project on Google API Console and use the credentials (ClientID, ClientSecret, and Redirect URL) to sync events on any Gmail user registered with the project.

Click the link to   Download GoogleCalendarTest

Using the Code
My intention is to let the user walk through the code so that he may be able to sync events of a web application (event management system, reservation system, etc.) with a user's Google Calendar.

IDE

  • Visual Studio (I have used 2013)

Description of Files

First, I will give a brief description of the files used in this project.

App_Code
  • GoogleCalendarAppointmentModel.cs - This file is used to keep the contents that need to be sent on Google Calendar
  • GoogleCalendarManager.cs - This file contains all the functions to interact with Google Calendar i.e., read / write events, access the calendar, etc.
  • GoogleTokenModel.cs - This file's contents are used to get the response from the Google Calendar API, i.e., the AccessToken (will be required for identification, will expire after a certain period of time), Refresh Token (will not expire and is used to get a new AccessToken).
Default.aspx -The main page where you can register, revoke, create / edit / delete events from Google Calendar

Click the link to   Download GoogleCalendarTest


Creating Project on Google API Console
  • Goto https://console.developers.google.com and create a new project or click API Manager
  • Click the Gmail API under Google Apps APIs and click on the calendar API under Click Enable API
  • Click the Credentials under API & Auth 
    • Click Add Credentials and click oAuth 2.0 clientID 
    • select Configure consent screen
    • Provide product name, logo (optional) and Home page URL (optional). and click save.
    • Choose web application as Application type and provide the URL of your project (e.g. http://localhost:58392/GoogleCalandarDemo/Default.aspx this is the page where google will send the token and other credentials to access google calendar) and click create
    • Click on your project name under OAuth 2.0 client ID (web client 1 is the default name
    • Click Download JSON and save the file (I have added MyGoogleStorage folder in App_Data and placed this file inside. It contains the credentials for the project).
    • The MyGoogleStorage folder will be used for creating a temporary and a permanent file having Access token credential 
      • A temporary file will be created when redirected to google calendar
      • A new file Google.Apis.Auth.OAuth2.Responses.TokenResponse-m will be created upon successful registration

View the images below if you find anything confusing with the text.




Before running the code, make sure that
  1. You have downloaded JSON client_secrets from https://console.developers.google.com and included it in MyGoogleStorage folder 
  2. You have added calendar v3 from package manage console by writing Install-Package Google.Apis.Calendar.v3
Walkthrough the code (you will have to follow the sequence as this code was moved from calendar v2 to v3)
  1. You need to type the address (in my case http://localhost:26033/default.aspx) again to get to the screen to register (just a glitch left)
  2. Click the Register with google calendar button and allow the manage calendar rights
  3. You have successfully registered the application with you google calendar but you need to get to the create event screen now. You need to click the button again to do that
  4. Put the values on the create event screen and click Create / Update event
  5. You will see the Event Created successfully message. You need to click the Google Calendar button to view the event on your google calendar
You need to follow the above sequence for 1st time registration. For next time after login, you will be redirected to create /  update event screen and things will go smooth

Click the link to  Download GoogleCalendarTest


To start over
If you ever want to check the code from start (when the user is not registered), you need to revoke the rights from https://security.google.com/settings/security/permissions and remove the newly created file (Google.Apis.Auth.OAuth2.Responses.TokenResponse-) from your MyGoogleStorage folder
The XML file only serves the purpose to mimic the behavior of db. You need to pay attention to how to register a client with google calendar and after that how to upload the event on the registered client's calendar
Hope this is all. I'll revise the code and remove the minor issues (for which you need to follow the sequence)

Click the link to  Download GoogleCalendarTest

Reference : https://www.codeproject.com/Articles/565032/Google-Calendar-Integration-in-ASP-NET-Create-ed

Have any queries comment here :)

26 comments:

  1. Working fine................

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. Nice Work.
    Is it possible to create event and notify a group of people with calendar details and remainder support.
    please provide your feed back..

    ReplyDelete
    Replies
    1. Yes it is possible.Google API already have this facility we have to implement method in C# to sync with google calendar.

      Delete
    2. Please provide a sample example...

      Delete
    3. Can we implement this feature using javascript?

      Delete
    4. Please refer this https://developers.google.com/google-apps/calendar/quickstart/js#prerequisites

      Delete
  4. Well done abi.Your explanation is keen and neat

    ReplyDelete
  5. Hi,

    I have done google calendar integration in asp.net web application using google calendar API. How to identify which account(gmail id) is sync to google calendar?
    I want to display that email id if it is already sync?


    Regards,
    Suchita Jingare

    ReplyDelete
    Replies
    1. Hi Suchita

      Your question is little bit confusing,If your using private calendar and display it using iframe means u can find which user is sync with that calendar by its SRC for example

      iframe src="https://calendar.google.com/calendar/embed?src=abinashtom%40gmail.com&ctz=Asia/Calcutta" style="border: 0" width="800" height="600" frameborder="0" scrolling="no"

      in the above code SRC=abinashtom%40gmail.com is the email id sync with that calendar

      If you are using public calendar then refer this
      https://developers.google.com/google-apps/calendar/concepts/sharing

      Thanks and Regards ,

      Abinash A

      Delete
  6. An exception of type 'Google.GoogleApiException' occurred in Google.Apis.dll but was not handled in user code

    Additional information: Google.Apis.Requests.RequestError

    Not Found [404]

    ReplyDelete
  7. Any users can add events to google calendar Its own, Not on the google calendar email selected from code "abinashtom@gmail.com" ?

    ReplyDelete
    Replies
    1. It's based on calendar type if you create it as public any one who have the link can access/.If it is private you can give permission to the selected user's you like.

      Delete
  8. This is a complete copy taken from below link. This work is done two years ago in 2014 already
    https://www.codeproject.com/Articles/565032/Google-Calendar-Integration-in-ASP-NET-Create-ed

    ReplyDelete
    Replies
    1. Thanks .It's already mentioned in the page its self.

      Delete