Fix CSP for disqus and Google Analytics

This commit should fix existing problems with Disqus and Google
Analytics enabled in the meta-yaml section of a note.

Before this commit they were blocked by the strict CSP. It's still
possible to disable the added directives using `addDisqus` and
`addGoogleAnalytics` in the `csp` config section.

They are enabled by default to prevent breaking changes.

Signed-off-by: Sheogorath <sheogorath@shivering-isles.com>

Author: SISheogorath

config.json.example

@@ -27,7 +27,9 @@
             "directives": {
             },
             "upgradeInsecureRequests": "auto"
-            "addDefaults": true
+            "addDefaults": true,
+            "addDisqus": true,
+            "addGoogleAnalytics": true
         },
         "db": {
             "username": "",

lib/config/default.js

@@ -18,6 +18,8 @@ module.exports = {
     directives: {
     },
     addDefaults: true,
+    addDisqus: true,
+    addGoogleAnalytics: true,
     upgradeInsecureRequests: 'auto',
     reportURI: undefined
   },

lib/csp.js

@@ -5,7 +5,7 @@ var CspStrategy = {}
 
 var defaultDirectives = {
   defaultSrc: ['\'self\''],
-  scriptSrc: ['\'self\'', 'vimeo.com', 'https://gist.github.com', 'www.slideshare.net', 'https://query.yahooapis.com', 'https://*.disqus.com', '\'unsafe-eval\''],
+  scriptSrc: ['\'self\'', 'vimeo.com', 'https://gist.github.com', 'www.slideshare.net', 'https://query.yahooapis.com', '\'unsafe-eval\''],
   // ^ TODO: Remove unsafe-eval - webpack script-loader issues https://github.com/hackmdio/hackmd/issues/594
   imgSrc: ['*'],
   styleSrc: ['\'self\'', '\'unsafe-inline\'', 'https://assets-cdn.github.com'], // unsafe-inline is required for some libs, plus used in views
@@ -22,11 +22,23 @@ var cdnDirectives = {
   fontSrc: ['https://cdnjs.cloudflare.com', 'https://fonts.gstatic.com']
 }
 
+var disqusDirectives = {
+  scriptSrc: ['https://*.disqus.com', 'https://*.disquscdn.com'],
+  styleSrc: ['https://*.disquscdn.com'],
+  fontSrc: ['https://*.disquscdn.com']
+}
+
+var googleAnalyticsDirectives = {
+  scriptSrc: ['https://www.google-analytics.com']
+}
+
 CspStrategy.computeDirectives = function () {
   var directives = {}
   mergeDirectives(directives, config.csp.directives)
   mergeDirectivesIf(config.csp.addDefaults, directives, defaultDirectives)
   mergeDirectivesIf(config.useCDN, directives, cdnDirectives)
+  mergeDirectivesIf(config.csp.addDisqus, directives, disqusDirectives)
+  mergeDirectivesIf(config.csp.addGoogleAnalytics, directives, googleAnalyticsDirectives)
   if (!areAllInlineScriptsAllowed(directives)) {
     addInlineScriptExceptions(directives)
   }

lib/response.js

@@ -226,7 +226,8 @@ function showPublishNote (req, res, next) {
         lastchangeuserprofile: note.lastchangeuser ? models.User.getProfile(note.lastchangeuser) : null,
         robots: meta.robots || false, // default allow robots
         GA: meta.GA,
-        disqus: meta.disqus
+        disqus: meta.disqus,
+        cspNonce: res.locals.nonce
       }
       return renderPublish(data, res)
     }).catch(function (err) {

public/views/shared/disqus.ejs

@@ -1,14 +1,13 @@
 <div id="disqus_thread"></div>
-<script>
+<script nonce="<%= cspNonce %>">
 var disqus_config = function () {
     this.page.identifier = window.location.pathname.split('/').slice(-1)[0];
 };
 (function() {
     var d = document, s = d.createElement('script');
-    s.src = '//<%= disqus %>.disqus.com/embed.js';
+    s.src = 'https://<%= disqus %>.disqus.com/embed.js';
     s.setAttribute('data-timestamp', +new Date());
     (d.head || d.body).appendChild(s);
 })();
 </script>
 <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
-                                    

public/views/shared/ga.ejs

@@ -1,5 +1,5 @@
 <% if(typeof GA !== 'undefined' && GA) { %>
-<script>
+<script nonce="<%= cspNonce %>">
 (function (i, s, o, g, r, a, m) {
     i['GoogleAnalyticsObject'] = r;
     i[r] = i[r] || function () {
@@ -10,9 +10,9 @@
     a.async = 1;
     a.src = g;
     m.parentNode.insertBefore(a, m)
-})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
+})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
 
 ga('create', '<%= GA %>', 'auto');
 ga('send', 'pageview');
 </script>
-<% } %>
+<% } %>