Q&A
「デプロイ前」は正常に動作していたのでしょうか。
application.jsについては、その前にやることがありそうに思いますが・・・
https://qiita.com/ngron/items/95846bd630a723e00038
そこに至るまでに行った手順を書かれた方が良いかと思います。
ファイルがなければ作る、でも良いかと思います。
※BootStrapはともかくRailsに詳しいわけではありません。
herokuでデプロイ後、bootstrapのjsが効かず、modalやalartの閉じるボタンが効かないです。（cssは効いています）
どこに原因があるのでしょうか？
環境
bootstrap 4.1.1
※プログラムはnode.js（フレックスはexpress 4.17.1）です。
試したこと
検索で同様の事象に関する記事がヒットしますが多くがrailsでの解決方法で
Node.jsで実装した際の解決方法が見つけることができませんでした。
・ローカルは問題なし
・デプロイエラーなし（herokuの管理画面で確認済み）
・試しにjsファイルをDLしてファイルアップしてみても変わらず
・念のためbootstrapを使わないパターンでハンバーガーメニューなどを組んでみましたが反応なし
・Heroku上で「rake assets:precompile」をしても、アセットファイルがないとのエラー
（jsのコンパイルが怪しいと思っているのですが、デプロイが初めなのと
コンパイル系の知識が不足していてうまく解消の糸口をつかめないでいます…）
html
1<head> 2 <meta charset="utf-8"> 3 <!-- viewport --> 4 <meta name="viewport" content="width=device-width, initial-scale=1"> 5 <!-- title --> 6 <title>サイト名.com</title> 7 <!-- css --> 8 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" 9 integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous"> 10 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.css" /> 11 <link href="./css/style.css" rel="stylesheet"> 12 <!-- script --> 13 <script src="http://code.jquery.com/jquery-3.3.1.min.js" 14 integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> 15 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" 16 integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" 17 crossorigin="anonymous"></script> 18 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" 19 integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" 20 crossorigin="anonymous"></script> 21 <script src="https://cdn.ckeditor.com/4.9.2/standard/ckeditor.js"></script> 22 <script type="text/javascript" src="/js/recipeApp.js"></script> 23</head>
ありがとうございます。
事象について調べたとき、node.jsで同様のケースなどが出てこなかったので
上記記事を参考にしておりました。application.jsもrailsでの話かもしれません。
すみません、本件には関連性がうすいかもしれないので紛らわしかったので削除いたします。
デプロイ前のローカル環境では問題なくに動いておりました。
>【急ぎ】
このような表現は「回答者避け」としてteratailでは理解されます。
それに、余計に本題と関係ない文言を追加してどうするんでしょう。
回答1件
0
ベストアンサー
13行目で jQuery を読み込む箇所にて、httpを指定しているのが原因と考えられます。
http を https に変更してください。
誤）
HTML
1 <script src="http://code.jquery.com/jquery-3.3.1.min.js"
正）
HTML
1 <script src="https://code.jquery.com/jquery-3.3.1.min.js"
heroku上のwebアプリへは https で接続しますが、
https で接続したページに http のコンテンツが含まれる場合、
ブラウザがコンテンツの読み込みをブロックすることがあります。
詳細は以下ページが参考になります。
また、コンテンツの読み込みがブロックされた場合、
ブラウザ開発ツールのコンソールに警告が表示されますので確認してみてください。
投稿2020/05/12 12:45
総合スコア134
ありがとうございます。正常に動きました！
しっかりと公式サイトのURLを使用すれば良かったのかもしれませんが
今回の件で新たに確認すべき内容の勉強になりました。m(_ _)m
色々試行錯誤をしていたので本当に助かりました。
あなたの回答
tips
プレビュー
