Play Framework won't run inline javascript

Question

I am trying to set up a simple application using the play framework 2.6 and scala and I can't seem to run inline javascript off my html templates. I keep getting the error:

Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-DdH/amfJizOgk2xZ+Xst5j13qHxPYrrrfT6x/TzfYiA='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

My scala code is:

package controllers
import javax.inject._
import play.api._
import play.api.mvc._
import play.twirl.api.Html
class HomeController @Inject()(cc: ControllerComponents) extends 
AbstractController(cc) {

def index() = Action { implicit request: Request[AnyContent] =>
  Ok(views.html.main("Hello World"))
}
}

And my html.main.html file looks like:

@(title: String)

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Security-Policy" content="default-src 'self'">
        <title>@title</title>
        <link rel="stylesheet" media="screen" 
href="@routes.Assets.versioned("stylesheets/main.css")">
        <link rel="shortcut icon" type="image/png" 
href="@routes.Assets.versioned("images/favicon.png")">

    </head>
    <body>
        <script type = "text/javascript">
            document.write("Check");
        </script>

        <script src = "@routes.Assets.versioned("javascripts/main.js")" type = 
"text/javascript"></script>
    </body>
</html>

So ideally it should print "Check" on the screen when I connect by the local host. I tried changing my application.conf file to be

play.filters.headers.contentSecurityPolicy = null

But that didn't work either. What else can I try?

This might sound crazy but try moving the inline script so it's the last javascript tag.. Then try an `alert("Check")` instead — airudah, Feb 14 '18 at 16:34
Doesn't look like this is specific to Play. Check out https://stackoverflow.com/questions/8502307/chrome-18-how-to-allow-inline-scripting-with-a-content-security-policy — Dylan, Feb 14 '18 at 18:32

score 3 · Accepted Answer · answered Feb 15 '18 at 09:11

3

The

play.filters.headers.contentSecurityPolicy = null

is correct, now remove

<meta http-equiv="Content-Security-Policy" content="default-src 'self'">

and then it must work as you expected

answered Feb 15 '18 at 09:11

Andriy Kuba

8,093
2
29
46

'play.filters.headers.contentSecurityPolicy = null' is not best practice. – John Jul 03 '19 at 20:01
@MHJ, of course, it is not. I just answer how it could work if you want it to work. The author can use it for fast prototyping or so. It has reason to be, either the Play authors must exclude the ability to set content security policy to null. – Andriy Kuba Jul 03 '19 at 20:31

score 2 · Answer 2 · edited Feb 14 '18 at 18:57

The best way to avoid this problem would be to use an extra javascript file which contains your code. but i had a similiar problem and solved it by setting a very long policy in my application.conf

play.filters.headers.contentSecurityPolicy = "default-src 'self';script-src 'self' https://my-site.com 'unsafe-inline';style-src 'self' https://my-site.com;font-src 'self' https://my-site.com;img-src 'self' https://my-site.com data:"

my-site.com is the hostname from where my app is served.

Play Framework won't run inline javascript

2 Answers2

Linked