Search code examples
javascriptapigoogle-chrome-extensiongoogle-sheets-apiapi-key

The request is missing a valid API key - Google Sheets


This is the background.js script of my Chrome Extension. I am trying to get a value from a spreadsheet using Sheets APIs. The sheet can be read by anyone, so I thought I wouldn't need any OAuth2 permissions/scopes and sign-in.

     if (message.action == 'clicked') {
            if (!connected){
                var user = message.user;
                var range = 'Teachers!A:A';
                let fetch_url = `https://sheets.googleapis.com/v4/spreadsheets/${spreadsheetId}/values/${range}`;
                fetch(fetch_url)
                    .then(res => res.json())
                    .then(res => {
                        console.log(res);
                    })
                };
            }

When I try to fetch, I receive this error:

error: {code: 403, message: 'The request is missing a valid API key.', status: 'PERMISSION_DENIED'}

What is wrong with my logic? Can't I avoid having to sign in people?


Solution

  • I needed to go to the Google Cloud Console and create an API key (and it is better to restrict it to the Sheets API for security).

    I took that key and saved it as a variable and included it in the fetch URL like this:

    let fetch_url = `https://sheets.googleapis.com/v4/spreadsheets/${spreadsheetId}/values/${range}?key=${API_KEY}`;
    

    Worked!