-
投稿者投稿
-
2021年9月6日 5:41 PM #86352
日頃より、SnowMonkeyを使わせていただいております。
維持管理・開発に携ってくださる方々に感謝を申し上げます。以下、2点におきまして解決の糸口が見出せずにおりまして、ご助言いただけましたら助かります。
どうぞよろしくお願いいたします。
—————————————————————-【お使いの Snow Monkey のバージョン】15.6.2
【お使いの Snow Monkey Blocks のバージョン】12.3.1
【お使いの Snow Monkey Editor のバージョン】 6.0.0
【お使いのブラウザ】Chrome , Safari
【当該サイトのURL】https://joyopa.com/opa-event/### 実現したいこと
[Safari]ブラウザ上において
- reCAPCHAエラー表示を解決したい
- 外部js読み込み時に固まらずに読み込めるようにしたい
### 発生している問題
1. SnowMonkeyForm上でreCAPCHAを設定すると、Safariでのみエラーが表示され、読み込みにも時間がかかる。reCAPCHAのサイトキーとシークレットキーを消すとエラー表示はなくなる。
これまで、reCAPCHAの設定でキーを貼り付けるだけで稼働しエラーが出たことがなかったことと、特に今回設定で何か手を加えることもしていない為原因がわからない。
(以下、エラーの貼り付けが長くなり恐縮です)<エラー内容>
■The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored.■[Error] TypeError: null is not an object (evaluating '(document.body||document.getElementsByTagName("head")[0]).lastChild.src') (anonymous関数) (commons.js:87:972180) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:55557) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:47615) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:43462) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:1425410) __webpack_require__ (content.js:1:736) checkDeferredModules (content.js:1:565) (anonymous関数) (content.js:1:2012) (anonymous関数) (content.js:1:2015) appendChild (anonymous関数) (recaptcha__ja.js:352:209) (anonymous関数) (recaptcha__ja.js:250:238) (anonymous関数) (recaptcha__ja.js:10:414) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) (anonymous関数) (recaptcha__ja.js:139:451) Promise (anonymous関数) (recaptcha__ja.js:139:351) (anonymous関数) (recaptcha__ja.js:236:337) (anonymous関数) (recaptcha__ja.js:10:357) (anonymous関数) (recaptcha__ja.js:74:132) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) (anonymous関数) (recaptcha__ja.js:139:451) Promise (anonymous関数) (recaptcha__ja.js:139:351) (anonymous関数) (recaptcha__ja.js:236:337) (anonymous関数) (recaptcha__ja.js:74) (anonymous関数) (recaptcha__ja.js:33:298) E6 (recaptcha__ja.js:510:501) B (recaptcha__ja.js:286:384)■②The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored.■TypeError: null is not an object (evaluating '(document.body||document.getElementsByTagName("head")[0]).lastChild.src') (anonymous関数) (commons.js:87:972180) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:55557) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:47615) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:43462) __webpack_require__ (content.js:1:736) (anonymous関数) (commons.js:87:1425410) __webpack_require__ (content.js:1:736) checkDeferredModules (content.js:1:565) (anonymous関数) (content.js:1:2012) (anonymous関数) (content.js:1:2015) appendChild (anonymous関数) (recaptcha__ja.js:352:209) (anonymous関数) (recaptcha__ja.js:432:283) (anonymous関数) (recaptcha__ja.js:510:321) (anonymous関数) (recaptcha__ja.js:139:469) (anonymous関数) (recaptcha__ja.js:510:185) (anonymous関数) (recaptcha__ja.js:32:350) (anonymous関数) (anonymous関数) (recaptcha__ja.js:224:260) (anonymous関数) (recaptcha__ja.js:24:293) (anonymous関数) (recaptcha__ja.js:330:342) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) (anonymous関数) (recaptcha__ja.js:139:451) Promise (anonymous関数) (recaptcha__ja.js:139:351) (anonymous関数) (recaptcha__ja.js:236:337) (anonymous関数) (recaptcha__ja.js:330:209) (anonymous関数) (recaptcha__ja.js:224:284) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) (anonymous関数) (recaptcha__ja.js:139:451) Promise (anonymous関数) (recaptcha__ja.js:139:351) (anonymous関数) (recaptcha__ja.js:236:337) f (recaptcha__ja.js:223:446) (anonymous関数) (recaptcha__ja.js:150:340) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) (anonymous関数) (recaptcha__ja.js:139:451) Promise (anonymous関数) (recaptcha__ja.js:139:351) (anonymous関数) (recaptcha__ja.js:236:337) (anonymous関数) (recaptcha__ja.js:150:277) (anonymous関数) (recaptcha__ja.js:45:442) (anonymous関数) (recaptcha__ja.js:111:308) (anonymous関数) (recaptcha__ja.js:377:262) q (recaptcha__ja.js:139:300) promiseReactionJob
2. 幾何学模様が背景で動くparticles.jsを導入すると、上記同様Safariでのみカクカクと固まりながら動く(エラー表示なし)
(関係があると思われるコードを記載いたします)子テーマのfunction.phpに記載したコード
<?php add_action( 'wp_enqueue_scripts', function() { wp_enqueue_script( 'particles.js', 'https://cdnjs.cloudflare.com/ajax/libs/particlesjs/2.2.3/particles.js', [ 'jquery' ], false, true ); wp_enqueue_script( get_stylesheet(), get_theme_file_uri( '/app.js' ), [ get_template() ], false, true ); } );
同階層に設置したapp.jsのコード
jQuery(function($){ var particles = Particles.init({ selector: '.background', sizeVariations: 10, color: ['#fde408', '#2F9D9B', '#3B983D'], connectParticles: true }); });
固定ページの最下層に記載したカスタムhtml
<canvas class="background"></canvas>
### 試したこと
- ・reCAPCHAの貼り付けキーを間違えていないか確認する。
・エラー内容にContent Security Policyの記載があった為、関連事項を調べ、下記サイトを参考にHTTPセキュリティヘッダーを設置したが、エラー改善は見られなかった。
参考サイト:https://tonahazana.com/wp-http-security-headers#toc8
・キーを設定する以外に何か抜けている操作がありましたらご教授願います。 - ・jsの読み込み方は、フォーラムの外部JSの読み込み方を参考に記載し直す。
・particles.jsを使用した場合Safariで重くなる現象があるか調べる(見当たらず)
・cdnではなくフォルダからjsファイルを読み込む仕様を試す(現象は変わらず)
・Chromeでは重くなることもなくエラーもなくjsが稼働し、Safari上でもエラーがないことから手詰まりになっており、SnowMonkeyテーマと相性の悪い何かがもしあるのであれば改善したい。
————————————
どうぞよろしくお願いいたします。
♥ 0Who liked: No user2021年9月7日 10:13 AM #86384あとで同じ問題に遭遇した人が検索しやすいように、1トピック1課題で投稿するようにお願いしています。お手数おかけいたしますが、
2. 幾何学模様が背景で動くparticles.jsを導入すると、上記同様Safariでのみカクカクと固まりながら動く(エラー表示なし)
は別トピックで再投稿をお願いします。
♥ 0Who liked: No user2021年9月7日 10:35 AM #86389了解いたしました。
再度掲載しなおします。
♥ 0Who liked: No user -
投稿者投稿
- トピック「[Safari]reCAPCHAエラー表示と外部js読み込み時の速度改善について」には新しい返信をつけることはできません。