Hi,
I am using embedded forms and I have noticed that the v2.js code does do inline script styling and as such breaks standard CSP policy.
You can test it with a simple HTML page
<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset=“UTF-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
<!-- Title -->
<title>Contact Us</title>
<!-- Security Headers -->
<meta http-equiv=“Content-Security-Policy” content="default-src ‘self’;
script-src ‘self’ https://js.hs-banner.com https://js.hsforms.net/forms/embed/v2.js https://js.hs-scripts.com https://js.hscollectedforms.net https://js.hs-analytics.net;
style-src ‘self’ https://fonts.googleapis.com https://js.hsforms.net/forms/embed/v2.js ;
style-src-elem ‘self’ https://fonts.googleapis.com https://js.hsforms.net/forms/embed/v2.js ;
object-src ‘none’;
base-uri ‘self’;
connect-src ‘self’ https://forms.hscollectedforms.net https://forms.hsforms.com/ https://hubspot-forms-static-embed.s3.amazonaws.com;
font-src ‘self’ https://fonts.gstatic.com;
frame-src ‘self’;
img-src ‘self’ https://track.hubspot.com https://forms.hsforms.com/ https://forms-na1.hsforms.com;
manifest-src ‘self’;
media-src ‘self’;
worker-src ‘none’;">
<meta http-equiv=“X-Content-Type-Options” content=“nosniff”>
<meta http-equiv=“X-XSS-Protection” content=“1; mode=block”>
<meta http-equiv=“Strict-Transport-Security” content=“max-age=31536000; includeSubDomains; preload”>
<meta http-equiv=“Referrer-Policy” content=“strict-origin-when-cross-origin”>
<title>Contact Us CSP issue</title>
</head>
<body>
<!-- Contact form structure -->
<h1>Simple embedded form</h1>
<div id=“hubspot-contactus-form-target”>
</div>
<script charset=“utf-8” type=“text/javascript” src=“https://js.hsforms.net/forms/embed/v2.js”></script>
<script type=“text/javascript” src=“hubspot-form.js”></script>
</body>
</html>
with JS
window.hbspt.forms.create({
region: “na1”,
portalId: “XXXXXXX”,
formId: “XXXXXXXX-XXXX-XXXX-XXXXX-XXXXXXXXX”,
target: “#hubspot-contactus-form-target”,
});
It works If I use the “unsafe-inline” in
style-src-elem ‘self’ ‘unsafe-inline’ https://fonts.googleapis.com https://js.hsforms.net/forms/embed/v2.js ;
But it opens a big security hole. What can I do to use an embedded form and still be secure?