8

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.

Shyam Kansagra
  • 812
  • 12
  • 23

2 Answers2

6

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

Jay A. Little
  • 3,063
  • 2
  • 9
  • 29
  • Thank you for your answer. I knew I should write onclick etc in js only...but the thing is, I dont know how to do that 'async' and 'defer' keywords. And how do I use onload for a script src in my js? – Shyam Kansagra Jan 19 '18 at 09:29
  • I am trying to write `` in js so that there wont be any inline js in html file. How do I convert this to js so that I can remove this tag from html. – Shyam Kansagra Jan 19 '18 at 09:42
  • This is just to fix your content security policy error. I'm not sure you actually want to use `https://apis.google.com/js/api.js` like this to access Google Sheets. I'll add some links to my answer to help with your follow-up question. – Jay A. Little Jan 19 '18 at 09:53
  • Hmm, I am not sure whether `https://apis.google.com/js/api.js` is right way or not, but I found that on this [link](https://developers.google.com/sheets/api/reference/rest/v4/spreadsheets.values/append) and using the same. – Shyam Kansagra Jan 19 '18 at 09:59
  • I see where you get it from. Sorry I can't be more helpful, I suggest posting a new question, asking specifically for how to use this same method as demonstrated from that site but inside of a Chrome Extension, understanding now that you cannot have inline JS like they show. – Jay A. Little Jan 19 '18 at 10:17
  • Oh okay. I'll post a new question. Meanwhile the links you shared are also helpful. Thank you so much :) – Shyam Kansagra Jan 19 '18 at 10:21
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/163477/discussion-between-shyam-kansagra-and-jay-a-little). – Shyam Kansagra Jan 19 '18 at 10:29
3

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.

MALIK KHAN
  • 41
  • 1