Posts Tagged ‘node’

And finally it happened!!!
CSP in landed to production in webmaker.org and goggles.webmaker.org. It is a huge win for me and hopefully for webmaker as well. Here are the landed commits: CSP webmaker & CSP goggles. It is in report only mode right now. Everyone can test and see that CSP is there: just go to webmaker.org, open web console and if there is any not known script is trying to access webmaker.
In the nearest future, CSP v1.1 will be more stable and will support all browsers, at that time webmaker team will move to a new version. Also, newrelic got updated recently and new update brought inline scripts to the webmaker project that can not be moved. Because of that, I added 'unsafe-inline' policy to CSP. Hopefully, in the future it will be removed and CSP will do its jobs better.

For Goggles component there was a problem that I found and talked a little bit in my previous blog post, when user pressed “Active X Ray” button, inline script were produced and placed in index.html file, which is a violation to CSP. To solve this problem, I got some help from Jon and the suggestion was to add click handler event to that button, in order to save the href=”link”, so user can add that button to the bookmark and at the same, when user clicking the button the X-Ray view opens. Here is the commit (it was a part of my CSP for goggles) & implementation:

$("#bookmarklet-link").on("click", function(event) {
  event.preventDefault();
  var script = document.createElement('script');
  script.src = '/webxray.js';
  script.className = 'webxray';
  script.setAttribute('data-lang',localeInfo);
  script.setAttribute('data-baseuri', hostname + "/"+localeInfo);
  document.body.appendChild(script);
});

Implementing this ‘click’ handler helped to remove the inline script from goggles.

Also, I started to work on removing ‘new Function()’ from popcorn.webmaker.org. Basically, what should be done it instead of making a script string and then eval it, I need to make a popcorn instance manually, step by step. I’m still working on that.

The other bugs I just finished are:

For my next release I’m planning to finish several bugs:

  • Land CSP for Thimble (it’s under review)
  • Finish with popcorn ‘new Function()’
  • Just started to work on GA events for Goggles
  • Also, I just asked if I can pick up a bug, where we need to do autocompletion for location element in the Event component with the CSP in mind – hopefully I will get it.

See you later.

Advertisements

Welcome to Friday and the last day before the study break.

This week was really exhausted one, all the midterms and assignment deadline made it even more nervous. Anyways, my work in Open Source World holds me in excited mood. 🙂

For this release I completed a lot of new for me kind of bugs and also made a great progress with the final CSP implementation into Webmaker and components. A little bit later in this post about it.

The other thing is that I found some really useful articles related to the Content Security Policy:

  • Compatibility table for support of Content Security Policy in desktop and mobile browsers -> look here
  • Content Security Policy on Mozilla Hacks -> look here and Mozilla Wiki -> here
  • A lot more on CSP v1.1 (new version 🙂 ) standard on w3 -> look here

Another great news!

Content Security Policy has just recently updated to version 1.1 (February 11th, 2014), which has some new features, which will be really useful to use for my future implementation it to the mozilla components.

  • nonce — random sequence of symbols that you send through header;
  • If there is an unsafe-inline and nonce, then nonce turns off unsafe-inline;
  • only those inline scripts work which have attribute nonce with the same value as in the header
    var hood = require("hood");
    //declaring new attribute in header
    module.exports.addCSP = function(options) {
      return hood.csp({
        headers: [
          "Content-Security-Policy"
        ],
        policy: {
          'default-src': [
            "'self'"
          ],
          'script-src': [
            "'self'",
            "https://example.com",
            "nonce-eef8264c4994bf6409c51ac7c9614446" //'nonce' has value with random symbols
          ]
        }
      });
    };
    
    //Testing
    <script type="text/javascript">
      alert("BLOCKED, because no 'nonce' attribute");
    </script>
    
    <script nonce="22168992a8d57a5d3a64ca73bb9fc669">
      alert("BLOCKED, because 'nonce' value doesn't equal to one written in the Policy");
    </script>
    
         //'nonce' is equal to one in the header
    <script nonce="eef8264c4994bf6409c51ac7c9614446">       
      alert("VALID, because 'nonce' attribute is equal to one in the Policy");
    </script>
    
    <!-- VALID, because there is a 'script-src' with 'https://example.com' -->
    <script src="https://example.com/allowed-because-of-src.js"></script>
    
    <!-- BLOCKED, because 'nonce' attribute is different -->
    <script nonce="22168992a8d57a5d3a64ca73bb9fc669" src="https://otherdomain.com/invalid.js"></script>
    
    <!-- VALID, because 'nonce' attribute is the valid, even then the otherdomain.com is not in script-src -->
    <script nonce="eef8264c4994bf6409c51ac7c9614446" src="https://otherdomain.com/valid.js"></script>
     
  • Specifying policy with metatag
  • Javascript API for getting and checking policies
  • DOM event about policy violation
  • New attributes: form-action, plugin-types
  • I will talk to Jon and Dave about these new features and how they can benefit.

Also I am thinking of implementing report-uri attribute to mozilla’s CSP, so that we will be getting all the information related to the policies violation and for easy check on the policy rules

Here is a small example of report-uri implementation

//inside CSP header declare report-uri
module.exports.addCSP = function(options) {
  return hood.csp({
    headers: [
      "Content-Security-Policy"
    ],
    policy: {
      'default-src': [
        "'self'"
      ],
      'script-src': [
        "'self'"
      ],
      'report-uri': [  //report-uri attribute
        "/pathToFile/csp.jsx"  //path to report json file
      ]
    }
  });
};

And here is hoe the report-uri file looks like

{
    "csp-report": {
        "document-uri": "https://example.ca/pathToReport/",
        "referrer": "http://www.example.ca/",
        "violated-directive": "script-src 
                                'unsafe-inline' 
                                'unsafe-eval' 
                                blob: 
                                chrome-extension: 
                                *.example.ca 
                                *.example.net 
                                *.example.st",
        "original-policy": " all policies specified here ",
        "blocked-uri": " blocked urls will be here "
    }
}

Pretty neat thing this CSP 🙂

The only one thing stops this implementation is this bug -> Mozilla CSP report-uri bug which is kind a problem. I would contact jbuck to get some info on that.

Lets get back to my bugs for this release. So I moved as close as possible to implement CSP on webmaker. Due to Jon Buckley’s vacation (hope is doing great 🙂 ), some of my bugs are on review stage, but this is not a problem at all, I have a lot of stuff to do for my next release. These are the bugs I fixed for this release:

  • Moving inline script to separate file -> bug 973120 Fixed and Landed,PR here
  • Remove inline script for quick-linking to a tag -> bug 973116 Fixed and Landed,PR here
  • Move google analytics snippet into a separate JS file -> bug 973119 Fixed and Landed,PR here
  • Move JS error tracking snippet -> bug 973112 On review and PR here
  • Starting point on CSP for Xray Goggles, adding ‘hood’ module, adding CSP to middleware.js and implementing it in app.’s commits -> here
  • Also I filed a bug for Xray Goggles -> here, which is related to future CSP as well. The bug is still not confirmed, but anyways, I am suggesting to find other related issues in Goggles, how we did with Webmaker, to make the whole CSP Implementation much more easier and straight forward.

This is pretty much it for this release.
Have a great weekend!