Kit / Kit/convertkit-react

reCaptcha Iframe loads without proper styling preventing users from verifying

Đang mở
#26 0 bình luận 0 reaction 0 người được giao Xem trên GitHub
Ngôn ngữ chính
JavaScript
Star
46
Fork
8
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

When ConvertKit decides to display a reCaptcha, the iFrame fails to load properly resulting in a cut-off input form (see screenshot below). Additionally, errors in the dev console (screenshot below) suggest the iFrame does not set the proper tags which may explain the display issue.

iframe display issue screenshot

iframe console errors

```
manifest.webmanifest:1 Manifest: Line: 1, column: 1, Syntax error.
three.cjs:50825 WARNING: Multiple instances of Three.js being imported.
5232 @ three.cjs:50825
[Report Only] Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

[Report Only] Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

[Report Only] Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

[Report Only] Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

[Report Only] Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

dd3ed6e5-5e75-41f8-be47-85df9032abf2:1 [Report Only] Refused to load the script 'https://cdn.convertkit.com/assets/gdpr-14b4f28cd9abaa6e8fd99b7f2c7490130cc95f58638b26b70239eb47ae592a61.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

dd3ed6e5-5e75-41f8-be47-85df9032abf2:1 [Report Only] Refused to load the script 'https://www.recaptcha.net/recaptcha/api.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

VM42:1 [Report Only] Refused to load the script 'https://app.convertkit.com/cdn-cgi/challenge-platform/scripts/invisible.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

(anonymous) @ VM42:1
about:blank:1 [Report Only] Refused to load the script 'https://app.convertkit.com/cdn-cgi/challenge-platform/h/g/scripts/jsd/b5e45436/invisible.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

api.js:1 [Report Only] Refused to load the script 'https://www.gstatic.com/recaptcha/releases/4q6CtudrwcI-LSEYlfoEbDXg/recaptcha__en.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

(anonymous) @ api.js:1
dd3ed6e5-5e75-41f8-be47-85df9032abf2:48 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-EM3PzB6rbUinZ6wSYCkYK+ljQIH/MrHDTXcp8HSD5Y0='), or a nonce ('nonce-...') is required to enable inline execution.

dd3ed6e5-5e75-41f8-be47-85df9032abf2:74 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-SgJWzQmk/nnYYjrwSSCNn6+qi9mr8lc5KWVRFRVGb6Y='), or a nonce ('nonce-...') is required to enable inline execution.

dd3ed6e5-5e75-41f8-be47-85df9032abf2:74 [Report Only] Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-1kpvLpadmwVAgBkWkRAB5Wu2FXuyLlgO4RpHWpES3cs='), or a nonce ('nonce-...') is required to enable inline execution.

handler @ dd3ed6e5-5e75-41f8-be47-85df9032abf2:74
invisible.js:1 [Report Only] Refused to create a worker from 'https://app.convertkit.com/cdn-cgi/challenge-platform/h/g/scripts/pica.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'worker-src' was not explicitly set, so 'script-src' is used as a fallback.

eE @ invisible.js:1
about:blank:1 [Report Only] Refused to create a worker from 'https://app.convertkit.com/cdn-cgi/challenge-platform/h/g/scripts/pica.js' because it violates the following Content Security Policy directive: "script-src 'none'". Note that 'worker-src' was not explicitly set, so 'script-src' is used as a fallback.

invisible.js:1 [Report Only] Refused to connect to 'https://app.convertkit.com/cdn-cgi/challenge-platform/h/g/cv/result/7bec4b676c0f664d' because it violates the following Content Security Policy directive: "connect-src 'none'".

eD @ invisible.js:1
```

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Hướng nghiên cứu

Tái hiện một biểu mẫu ConvertKit kích hoạt reCaptcha và kiểm tra kiểu dáng của iframe cũng như các lỗi được báo cáo trong console và Content Security Policy. Công việc hoàn tất khi người dùng có thể xem và hoàn thành toàn bộ biểu mẫu xác minh mà không gặp lỗi hiển thị đã được báo cáo.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
javascript, react
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
4/5
Thời gian dự kiến
3-5 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Cần làm rõ
Mức phù hợp với người mới
25/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.