Accessing Google Calendar API without authorization via JavaScript

I’m trying to access a public calendar (from Google Calendar) that contains national holidays:

calendarId: 'pt_br.brazilian#[email protected]'

As the calendar is public, I thought I would be able to access it using only the API Key:

function OnLoadCallback() {
    var config = {
        client_id: '', //fake client id
        scope: ''
    gapi.client.setApiKey('fId345AM20HXXXXXXXXXXXXXXXXgT3f9kyp2REfkaw2'); //fake api key
    gapi.client.load('calendar', 'v3', function() {
        var today = new Date(),

        request = gapi.client.calendar.calendarList.get({
            calendarId: 'pt_br.brazilian#[email protected]',
            timeMin: (new Date(today.getFullYear(), today.getMonth(), today.getDay(), 0, 0, 0, 0)).toISOString(),
            timeMax: (new Date(today.getFullYear(), today.getMonth(), today.getDay(), 23, 59, 59, 999)).toISOString(),
            fields: 'items(creator(displayName,email),end,endTimeUnspecified,start,summary)'

        request.execute(function(response) {
            window.alert('length of items: ' + response.items.length);


However, I keep getting the following response, which is a 401 (unauthorized) error:

 "error": {
  "errors": [
    "domain": "global",
    "reason": "required",
    "message": "Login Required",
    "locationType": "header",
    "location": "Authorization"
  "code": 401,
  "message": "Login Required"

Can someone clarify whether what I’m trying to do is achievable or not?
And finally if it is possible – what do I have to change referring to my current code?

I was able to do the same thing using jQuery.

var mykey = 'your_api_key'; // typically like Gtg-rtZdsreUr_fLfhgPfgff
var calendarid = 'you_calendar_id'; // will look somewhat like [email protected]

    type: 'GET',
    url: encodeURI('' + calendarid+ '/events?key=' + mykey),
    dataType: 'json',
    success: function (response) {
        //do whatever you want with each
    error: function (response) {
        //tell that an error has occurred

However you need to be sure you have done the following:-

1) Register a project at
2) Generate a Simple API Access key
3) Ensure Calendar API is activated under services.


Using plain javascript I was able to tweek the above and also get it to work! This was really helpful as Google docs I found focus mainly on Auth side of things for users accessing and updating calendars. It was tougher to actually get down to where exactly (at what precise endpoint) did I need to make my call to. I’ve obviously put XXXXX’s where your calendarId and API Key need to go.

    //async function to handle data fetching
    async function getData () {
    //try catch block to handle promises and errors
    try {
        const calendarId = '[email protected]'
        //using await and fetch together as two standard ES6 client side features to extract the data
        let apiCall = await fetch('' + calendarId+ '/events?key=' + myKey)
        //response.json() is a method on the Response object that lets you extract a JSON object from the response
        //response.json() returns a promise resolved to a JSON object
        let apiResponse = await apiCall.json()
    } catch (error) {

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .
Read More:   Property 'XYZ' does not exist on type 'Readonly & Readonly'

Similar Posts