Reputation: 912
I am making my first chrome extension. My idea is to call Google Sheets API to append a row in a google spreadsheet from my extension. I am referring this link for the same and successfully tried the API to append row in my desired sheet.
Now I am trying to do the same from my chrome extension code files. How do you use the same sample code for your extension as our extension will not allow inline js. Any sample or basic boilerplate would help.
Many thanks in advance.
Upvotes: 12
Views: 8960
Reputation: 430
I'm assuming your problem is to fetch a valid API key (because it was the tricky part for me). If you have other problem, just comment below and I'll give a more detailed example.
I managed to do it using the Identity API, documented here. With it, you can get identity data from the user logged in the browser, including a token. All I needed to do was:
//manifest.json
//...
"permissions": [
"identity",
//...
],
//...
"key": "__Really_long_gibberish_token_string__",
"oauth2": {
"client_id": "__some_token_string__.apps.googleusercontent.com",
"scopes": [ "https://www.googleapis.com/auth/spreadsheets.readonly" ]
}
Everything is linked to a google project, so, details about key and clientId generation can be found here. And created a function to retrieve the token:
// This function is inside a component which ends up bundled in my worker.js; I didn't tried it in content scripts, nor popups.
async function fetchGoogleToken() {
const tokenObj = await chrome.identity.getAuthToken({interactive: true})
return tokenObj.token
}
The interactive: true
option is wonderful. If the user isn't logged in the browser, it will show a login form and authorization permission confirmation window for you.
This is the token I sent to the API.
Upvotes: 1
Reputation: 41
https://github.com/malik55khan/speardsheet-reader/
Demo: https://www.loom.com/share/d7d432c513a44b05a615fa0bd170fb23
Create a client-auth key in google console and select chrome extension. after that push the project id and save it. then you will get client_id. Next step create a api key.
add a new project. - select google cloud or Spreadsheet - Enable API.
Hope it will be more helpful.
Upvotes: 3
Reputation: 3287
You are receiving that error because of the inline JavaScript.
Chrome Extensions do not allow any inline scripting. Read Here.
Inline JavaScript will not be executed
Inline JavaScript will not be executed. This restriction bans both inline blocks and inline event handlers (e.g. ).
So any JavaScript must come from its own .js file.
It is common to use popup.html and all JavaScript for that page in popup.js.
Same goes for options.html and options.js.
Helpful Links:
Chrome Extension and Google Sheets
Tutorial for using OAuth
Upvotes: 8