phonegap / connect-phonegap

Stream a PhoneGap app to any device.
Apache License 2.0
61 stars 63 forks source link

Content-Security-Policy replacement mangles React generated index.html with CSP in place #217

Open oliversturm opened 4 years ago

oliversturm commented 4 years ago

PhoneGap CLI, node & npm versions

PhoneGap 9.0.0, Node 10.16.3, npm 6.9.0

Expected Behaviour

A valid index.html is generated and included in appzip

Actual Behaviour

The index.html in appzip is broken

Steps to Reproduce

Use this file as the source index.html. The file was generated by building a React project. As you can see, it includes a <meta http-equiv="Content-Security-Policy" ... /> tag.

With this index.html in a PhoneGap project, run phonegap serve and retrieve the appzip (e.g. wget http://localhost:5000/__api__/appzip). Unpack the zip file and check the included index.html. It will be broken - the initial JavaScript snippet has overwritten parts of the head block and a few other elements, and its starting script tag is missing. Here's what I received.

I have debugged the problem and I found that there is something wrong in this execution path. I suspect that the regular expression in cspRegex is incorrect and matches too much - perhaps it should be replaced with this: /<meta.+Content-Security-Policy.+content.+"(.+)".*?>/i

I have not tested this idea, but the code block in question is definitely the culprit since I can work around the problem by removing the CSP meta tag from my source file. Here's an index.html that differs only in that this tag is missing, and the transformed file is correct in this case.