内容安全策略不允许提交表单

Question

我需要帮助。我有一个表单要提交给另一个 url，但是当我尝试提交它时，它拒绝提交，我正在检查我的控制台。

在 Chrome 上，我看到以下错误

resources2.aspx?HCCID=75694719&culture=en-US&mlcv=3006&template=5:7 Refused to load the image 'https://s4.mylivechat.com/livechat2/images/sprite.png' because it violates the following Content Security Policy directive: "img-src 'self' data:".

Refused to send form data to 'https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx' because it violates the following Content Security Policy directive: "form-action 'self'".

在 Mozilla Firefox 上，我看到以下内容：

Content Security Policy: The page’s settings blocked the loading of a resource at https://s4.mylivechat.com/livechat2/images/sprite.png (“img-src http://smehelp.themarketplace.ng data:”)

Content Security Policy: The page’s settings blocked the loading of a resource at http://smehelp.themarketplace.ng/purchase/summary (“form-action 'self'”).

在网上查找解决方案，我已将以下内容添加到我的页眉中

        <meta http-equiv="Content-Security-Policy" content="form-action 'self'">

但问题依然存在。

这导致我无法提交表格。早些时候，表单是用来提交的，但我今天刚试了一下，发现这个错误。

我运行 Google Chrome 版本 55.0.2883.95（64 位） MAC OS.

对于尽快解决此问题的任何建议，我将不胜感激。

谢谢

Answer 1

您在响应中传递了 Content-Security-Policy 值 header:

base-uri 'none'; default-src 'self' https://s4.mylivechat.com; child-src 'none'; connect-src 'self'; font-src 'self' https://fonts.googleapis.com https://maxcdn.bootstrapcdn.com https://fonts.gstatic.com; form-action 'self'; frame-ancestors 'none'; img-src 'self' data:; media-src 'self'; object-src 'none'; script-src 'self' https://www.youtube.com https://maps.google.com https://www.google-analytics.com https://mylivechat.com https://s4.mylivechat.com https://maps.googleapis.com 'unsafe-inline' 'unsafe-eval'; style-src 'self' https://fonts.googleapis.com https://s4.mylivechat.com https://maxcdn.bootstrapcdn.com 'unsafe-inline'

您添加到页面元数据中的内容安全策略将被忽略，因为它存在于响应中 header。

您将需要对您在回复中发送的 CSP 添加以下内容（粗体）header。

base-uri 'none'; default-src 'self' https://s4.mylivechat.com; child-src 'none'; connect-src 'self'; font-src 'self' https://fonts.googleapis.com https://maxcdn.bootstrapcdn.com https://fonts.gstatic.com; form-action 'self' https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx; frame-ancestors 'none'; img-src 'self' data: https://s4.mylivechat.com; media-src 'self'; object-src 'none'; script-src 'self' https://www.youtube.com https://maps.google.com https://www.google-analytics.com https://mylivechat.com https://s4.mylivechat.com https://maps.googleapis.com 'unsafe-inline' 'unsafe-eval'; style-src 'self' https://fonts.googleapis.com https://s4.mylivechat.com https://maxcdn.bootstrapcdn.com 'unsafe-inline';

将 https://s4.mylivechat.com 添加到 img-src
将 https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx 添加到 form-action
从您的 HTML 代码中删除 <meta http-equiv="Content-Security-Policy" content="form-action 'self'">

Answer 2

如果你看这里是因为你想将表格发送到同一个 URL（这应该可以用 form-action 'self'）或你的 [=11= 中列出的另一个 URL ] 规则，但之后重定向，以下可能是原因 https://github.com/w3c/webappsec-csp/issues/8 (including a long discussion). One reason is: https://cheatsheetseries.owasp.org/cheatsheets/Unvalidated_Redirects_and_Forwards_Cheat_Sheet.html

之所以在CSP报告中看不到重定向的目标url（这真是令人困惑）是一个安全问题，请参阅https://w3c.github.io/webappsec-csp/#create-violation-for-request，否则可以分析表单端点的行为。

tl:dr; Chrome 和 Safari 不允许在提交表单后重定向，除非目的地 URL 列在 form-action CSP 规则中，即使它是不包含原始表单数据的 GET 重定向.

内容安全策略不允许提交表单

Content Security Policy not allowing form submission

javascript

forms

jquery

google-chrome

content-security-policy