959278 - Add CSP to popcorn.webmaker.org

Status: RESOLVED INCOMPLETE

(Webmaker Graveyard :: Popcorn Maker, defect)

Description

[Jon Buckley [:jbuck]]

We need to implement Content Security Policy (CSP) on popcorn.webmaker.org. First, I'd recommend reading about CSP on MDN: https://developer.mozilla.org/en-US/docs/Security/CSP

Once you've got the background, you'll need to start implementing it. You can look at the policy for the make-valet:

* https://github.com/mozilla/make-valet/commit/3afa949101e8ca737ed9cafdd30ec52a32d52de2
* https://github.com/mozilla/make-valet/commit/a383215f897812568357c77dfa389b83b00243e4
* https://github.com/mozilla/make-valet/commit/26e03a90ac9688e2bfaffdadee320ed8eb3da8c6

Generally speaking, you'll need to:
* set the server to use CSP in report-only mode using the node module "hood" (see the code for how)
* move inline <script> tags into linked <script> tags
* make sure that no library is using eval, new Function(), etc
* whitelist allowed domains for other content types
* test very thoroughly

Comment 1

[Matthew Schranz [:mjschranz]]

(In reply to Jon Buckley [:jbuck] from comment #0)
> * make sure that no library is using eval, new Function(), etc

Is https://github.com/mozilla/popcorn.webmaker.org/blob/master/public/src/core/popcorn-wrapper.js#L420 allowed?

Comment 2

[Jon Buckley [:jbuck]]

You can allow it in CSP as unsafe-eval ( https://developer.mozilla.org/en-US/docs/Security/CSP/CSP_policy_directives#Keywords ) but as the policy is named, it's not safe, and we should avoid using it if we can. Another challenge for this patch!

Comment 3

[Jon Buckley [:jbuck]]

Attachment: https://github.com/mozilla/popcorn.webmaker.org/pull/434

First crack at adding CSP to popcorn. Lots of blockers to fix up first!

Comment 4

[Alexander [:admix]]

Can you assign this one to me please as well?! Trying to be involved with all components.

Comment 5

[Jon Buckley [:jbuck]]

Comment on attachment 8367030 [details] [review]
https://github.com/mozilla/popcorn.webmaker.org/pull/434

I have a better idea; want to review my code? :)

Comment 6

[Alexander [:admix]]

I'm not sure why, but I can't change the flag (I think I don't have permissions). Anyways, I think for now it's r-, because 2 more blocks should be fixed, for the proper implementation. The other thing is, that the browser console gives warnings on "not using the report-uri" policy.

Comment 7

[Alexander [:admix]]

Comment on attachment 8367030 [details] [review]
https://github.com/mozilla/popcorn.webmaker.org/pull/434

Looks like almost everything is fine. Except, when you are adding new objects to the project (google map, wikipedia), new scripts load:

"https://en.wikipedia.org" - wikipedia (all languages needed)
"https://mts0.googleapis.com" - google map api

Also, if we can format CSP with in the same way it formatted in other components, to other format like this one. So that they look consistent everywhere. (the same for events-webmaker:) )

Comment 8

[Chris DeCairos (:cade)]

Popcorn Maker is no longer under active development.

https://learning.mozilla.org/blog/product-update-for-appmaker-and-popcorn-maker