CODEWITHSUNDEEP
javascriptgoogle-chromegithubgoogle-chrome-extension
psgs
psgs

Reputation: 93

Chrome add-on triggers Content Security Policy violation

Chrome add-on triggers Content Security Policy violation

Recently, I have started developing a chrome add-on that will inject a button into GitHub user profiles. The add-on is designed to inject a KeyBase button on GitHub user profiles that correspond with KeyBase user profiles as shown in the image.

KeyBase Button Example

My main code is written in JavaScript, can be found at the following link:

https://gist.github.com/psgs/10516497

My manifest.json file is also as follows:

https://gist.github.com/psgs/10516524

When the code is run as part of the chrome add-on, the following error is spammed in the JavaScript console, and when pressed, the KeyBase button won't link the user to the user's KeyBase profile.

JavaScript Console Error

Any insight as to why these errors are occuring would be much appreciated!!

More information can also be found at the GitHub Issues page for the KeyBase Button repository.

Upvotes: 0

Views: 197

Answers (1)

Ivan Nevostruev
Ivan Nevostruev

Reputation: 28713

I've tried to run your code and I couldn't reproduce errors from your screenshot. Basically button is injected ok, but when I press it I'm getting:

XMLHttpRequest cannot load https://www.keybase.io/psgs. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://github.com' is therefore not allowed access. psgs:1 AJAX Error github-a1fec3e73d87f3550c635e371c8519308940f4b4.js:1

Here is what I think is happening:

  • When button is clicked event is captured by GitHub javascript code and get converted to some kind of Ajax request.
  • This request doesn't work because www.keybase.io doesn't allow requests from different origin.

You can try to add your our click handler to the button, which will stop event bubbling up to GitHub handler like this:

button
    .attr('href', 'https://www.keybase.io/' + username)
    .html('<span class="octicon octicon-key"></span>Keybase')
    .click(function() {window.location = 'https://www.keybase.io/' + username})

Anyway it's not quite clear what are you trying to achieve.

Upvotes: 1

Related Questions