Allow passing csp_nonce_assign_key into router

README.md

@@ -97,6 +97,26 @@ defmodule MyPhoenixAppWeb.Router do
 end
 ```
 
+### Content Security Policy
+
+Content security policy nonces can be passed into the router to allow usage of strict content security policies throughout an application.
+
+This can be achieved by passing in a `csp_nonce_assign_key` to the `FunWithFlags.UI.Router` forward. Values for the nonces should be set in the conn assigns before reaching this router.
+
+The value of this can either be a single nonce assign key, or separate assign keys for script and style tags.
+
+For example:
+
+``` elixir
+forward "/", FunWithFlags.UI.Router, namespace: "feature-flags", csp_nonce_assign_key: :my_csp_nonce
+```
+
+Or:
+
+``` elixir
+forward "/", FunWithFlags.UI.Router, namespace: "feature-flags", csp_nonce_assign_key: %{style: :my_style_nonce, script: :my_script_nonce}
+```
+
 ## Caveats
 
 While the base `fun_with_flags` library is quite relaxed in terms of valid flag names, group names and actor identifers, this web dashboard extension applies some more restrictive rules.

lib/fun_with_flags/ui/router.ex

@@ -30,7 +30,10 @@ defmodule FunWithFlags.UI.Router do
 
   @doc false
   def call(conn, opts) do
-    conn = extract_namespace(conn, opts)
+    conn =
+      conn
+      |> extract_namespace(opts)
+      |> extract_csp_nonce_key(opts)
     super(conn, opts)
   end
 
@@ -286,6 +289,16 @@ defmodule FunWithFlags.UI.Router do
     Plug.Conn.assign(conn, :namespace, "/" <> ns)
   end
 
+  defp extract_csp_nonce_key(conn, opts) do
+    csp_nonce_assign_key =
+      case opts[:csp_nonce_assign_key] do
+        nil -> nil
+        key when is_atom(key) -> %{style: key, script: key}
+        %{} = keys -> Map.take(keys, [:style, :script])
+      end
+
+    Plug.Conn.put_private(conn, :csp_nonce_assign_key, csp_nonce_assign_key)
+  end
 
   defp assign_csrf_token(conn, _opts) do
     csrf_token = Plug.CSRFProtection.get_csrf_token()

lib/fun_with_flags/ui/templates.ex

@@ -82,4 +82,12 @@ defmodule FunWithFlags.UI.Templates do
     |> to_string()
     |> URI.encode()
   end
+
+  def csp_nonce(conn, type) do
+    assign_key = conn.private[:csp_nonce_assign_key][type]
+    case conn.assigns[assign_key] do
+      nil -> ""
+      nonce -> "nonce=\"#{nonce}\""
+    end
+  end
 end

lib/fun_with_flags/ui/templates/_head.html.eex

@@ -2,6 +2,6 @@
   <meta charset="utf-8">
   <title>FunWithFlags - <%= @title %></title>
 
-  <link rel="stylesheet" href="<%= path(@conn, "/assets/bootstrap.min.css") %>">
-  <link rel="stylesheet" href="<%= path(@conn, "/assets/style.css") %>">
+  <link <%= csp_nonce(@conn, :style) %> rel="stylesheet" href="<%= path(@conn, "/assets/bootstrap.min.css") %>">
+  <link <%= csp_nonce(@conn, :style) %> rel="stylesheet" href="<%= path(@conn, "/assets/style.css") %>">
 </head>

lib/fun_with_flags/ui/templates/details.html.eex

@@ -140,6 +140,6 @@
         </div>
       </div>
     </div>
-    <script type="text/javascript" src="<%= path(@conn, "/assets/details.js") %>"></script>
+    <script <%= csp_nonce(@conn, :script) %> type="text/javascript" src="<%= path(@conn, "/assets/details.js") %>"></script>
   </body>
 </html>

test/fun_with_flags/ui/router_test.exs

@@ -198,6 +198,39 @@ defmodule FunWithFlags.UI.RouterTest do
     end
   end
 
+  describe "CSP nonce assign key option" do
+    test "if csp_nonce_assign_key is set, the CSP nonce is rendered in the script and link tags" do
+      {:ok, true} = FunWithFlags.enable :coconut
+
+      csp_opts = [csp_nonce_assign_key: :pineapple]
+
+      conn =
+        conn(:get, "/flags/coconut")
+        |> Plug.Conn.assign(:pineapple, "mango")
+        |> Router.call(Router.init(csp_opts))
+
+      assert 200 = conn.status
+      assert String.contains?(conn.resp_body, ~s{<script nonce="mango"})
+      assert String.contains?(conn.resp_body, ~s{<link nonce="mango"})
+    end
+
+    test "if csp_nonce_assign_key is set with differing values, the CSP nonce is rendered in the script and link tags" do
+      {:ok, true} = FunWithFlags.enable :coconut
+
+      csp_opts = [csp_nonce_assign_key: %{script: :lemon, style: :melon}]
+
+      conn =
+        conn(:get, "/flags/coconut")
+        |> Plug.Conn.assign(:lemon, "peach")
+        |> Plug.Conn.assign(:melon, "apricot")
+        |> Router.call(Router.init(csp_opts))
+
+      assert 200 = conn.status
+      assert String.contains?(conn.resp_body, ~s{<script nonce="peach"})
+      assert String.contains?(conn.resp_body, ~s{<link nonce="apricot"})
+    end
+  end
+
 
   # For GET and DELETE
   #

test/fun_with_flags/ui/templates_test.exs

@@ -186,4 +186,20 @@ defmodule FunWithFlags.UI.TemplatesTest do
       assert String.contains?(out, ~s{The flag <strong>watermelon</strong> doesn't exist.})
     end
   end
+
+  describe "CSP nonce" do
+    test "it includes a CSP nonce if provided", %{conn: conn} do
+      flag = %Flag{name: :avocado, gates: []}
+
+      conn =
+        conn
+        |> Plug.Conn.put_private(:csp_nonce_assign_key, %{script: :script_nonce, style: :style_nonce})
+        |> Plug.Conn.assign(:script_nonce, "honeydew")
+        |> Plug.Conn.assign(:style_nonce, "watermelon")
+
+      out = Templates.details(conn: conn, flag: flag)
+      assert String.contains?(out, ~s{<script nonce="honeydew"})
+      assert String.contains?(out, ~s{<link nonce="watermelon"})
+    end
+  end
 end