Django: render JavaScript import maps in templates
JavaScript’s import statement lets module scripts import objects from other scripts. For example, you can define a script as a module in HTML:
(All tags.)
JavaScript’s import statement lets module scripts import objects from other scripts. For example, you can define a script as a module in HTML:
Browser extensions can run JavaScript within the content of your tabs. This means they can trigger messages that appear in the devtools console. For example, one extension I use logs this warning on every tab:
json_script for pre-serialized JSON stringsDjango’s json_script template filter is a convenient and safe way to pass a larger amount of data to JavaScript. I covered it in my post last year How to Safely Pass Data to JavaScript in a Django Template.
It’s a good idea to ensure your project uses the same Node.js version in all environments. This way you can be sure that your code will work as expected, from development to production.
contrib.staticfilesSource maps are files that map your minified CSS or JavaScript back to the original code. They allow you to use your browser’s development tools to debug minified code as if it were the original. Also some error capture tools, such as Sentry, can use source maps to report errors for the original code.
When Lambda@Edge first came out, I added it to my blog’s CloudFront distribution in order to add security headers. Then, when Lambda@Edge added Python support, I converted my function from JavaScript to Python.
Here are three new security headers on the block:
Django templates are often used to pass data to JavaScript code. Unfortunately, if implemented incorrectly, this opens up the possibility of HTML injection, and thus XSS (Cross-Site Scripting) attacks.
I previously blogged about how I configured my CloudFront hosted website to score A+ on securityheaders.com. I worked around CloudFront’s lack of an “add headers” feature by adding a Lambda@Edge function in JavaScript.
In my blog post and DjangoCon Europe talk earlier this year How to Score A+ for Security Headers on Your Django Website, I covered that Feature-Policy was a “bonus header”. In a recent update, Scott Helme wrote that an A+ on SecurityHeaders.com now requires Feature-Policy. Also it no longer requires X-Xss-Protection (though it’s still a good idea).