CODEWITHSUNDEEP
javascriptgoogle-calendar-apigoogle-api-js-client
Subba Reddy
Subba Reddy

Reputation: 21

Uncaught ReferenceError: gapi is not defined at makeApiCall?

please click here to see the error message, while i am integrating the google calendar using javascript i'm getting this error

 function makeApiCall(){   
   
 gapi.client.load('calendar', 'v3', function () { 
        
                 var request = gapi.client.calendar.events.insert
                 console.log(request);
                 ({
                    'calendarId': '', 
                    "resource": resource    
                });  
     
 });
}

Upvotes: 2

Views: 702

Answers (2)

Linda Lawton - DaImTo
Linda Lawton - DaImTo

Reputation: 117116

Unless you have forgotten to post a section of your code you have probably forgotten to register the library, as well as authorizing the user.

<script src="https://apis.google.com/js/client:platform.js"></script>

full example using Google sign-in

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Hello cal v3 </title>
    <!-- Create a client id on Google developer console. Web credentials https://youtu.be/pBVAyU4pZOU  -->
    <meta name="google-signin-client_id"
          content="YourClientId">
    <meta name="google-signin-scope" content="https://www.googleapis.com/auth/calendar">
</head>
<body>

<h1>Hello cal v3 </h1>

<!-- The Sign-in button. This will run `getFileAsync()` on success. -->
<p class="g-signin2" data-onsuccess="makeacall"></p>

<!-- The API response will be printed here. -->
<textarea cols="80" rows="20" id="query-output"></textarea>

<script>

    // Query the API and print the results to the page.
    async function makeacall() {

        try {
            await gapi.client.load('calendar', 'v3');
            const response = gapi.client.calendar.events.insert({
                calendarId: 'XXX', 
                resource: resource
            });
         displayResults(response)
            
        } catch (e) {
            console.error('Error getting files', e)
        }
    }

 function displayResults(response) {
    var formattedJson = JSON.stringify(response.result, null, 2);
    document.getElementById('query-output').value = formattedJson;
}


</script>

<!-- Load the JavaScript API client and Sign-in library.   -->
<script src="https://apis.google.com/js/client:platform.js"></script>

Redirect uri mismatch JavaScript origin error

Make sure that you have configured your web client properly on Google developer console and added the proper javascript origin. Simple solution for redirect_uri_mismatch error with JavaScript

Upvotes: 2

Mohammad Ali Rony
Mohammad Ali Rony

Reputation: 4915

you need to init gapi on page load

gapi.auth2.init({
   client_id: 'xxxxxxxxxxx'
});

Upvotes: 0

Related Questions