Angular 8+ ready

[pahlers]

Description

The CspHtmlWebpackPlugin is a plugin made for Webpack, but doesn't integrate with the Angular build process anymore. Since Angular 8+ will generate the index.html outside the Webpack build process. You need to use the indexTransform parameter of @angular-builders/custom-webpack to do this.

I wrote the code to do this. This code is already being used in production. But I think that it would be nicer when this code is incorporated into this project, so maintaining and testing is more easier.

You can find an example project on https://gitlab.flusso.nl/public-projects/angular-csp-html-transform-example.

I like to help / code this solution, but would like a direction how to do this.

What type of issue is this? (place an x in one of the [ ])

• [ ] bug
• [x] enhancement (feature request)
• [ ] question
• [ ] documentation related
• [ ] testing related
• [ ] discussion

Requirements (place an x in each of the [ ])

• [x] I've read and understood the Contributing guidelines and have done my best effort to follow them.
• [x] I've read and agree to the Code of Conduct.
• [x] I've searched for any related issues and avoided creating a duplicate issue.

[melloware]

I am interested in helping you implement this in my fork: https://github.com/melloware/csp-webpack-plugin

I have added more functionality to this core plug-in. Open a ticket on my project and we can work together to get it implemented.

[pahlers]

@melloware Let see what we can do. I have my "hackware" used by a client. I did also added some more features. I will update my example code. Let's compare and make a plan! A-team tune starts

[melloware]

I like it!

[pahlers]

I added the following feature. All the code is already in the project.

Inline CSP, using the meta-tag, doesn't support sending violation reports to a server.

For that reason my example project is adding a way to generate server configuration files. And it supports adding the headers to allow CSP header during development. I hope this fast feedback loop helps the developer writing a better application.

My suggestion is to split the code in two parts.

1. A library that calculates, checks and generates the CSP based on the configuration.
2. Tools which uses the CSP to generate the server configuration, CSP meta-tag, include the headers during development, etc.

I would like to have a library because a big part of my tools can't use the webpack plugin. Like this ticket says the render of the index.html isn't done by webpack.

Also it allows others developers to write tools for Rollup, Parcell, etc.