1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Mixed Content(混在コンテンツ)エラーの解決方法

Last updated at Posted at 2020-10-10

railsでアプリケーションを開発。本番環境(heroku)にデプロイしたがなんか見た目が違う...となりました。
解決はしましたが、新しい発見があったため記録として残しておきます!

問題発生の経緯

デプロイをしたがビューが崩れている

アセットファイルをコンパイルしてない!

rails assets:precompile RAILS_ENV=productionを実行

再度デプロイ。「これで大丈夫なはず!」

直ってませんでした......。

原因

結論から言うとコンパイルの問題ではなく外部ページがHTTPのページだったことが原因でした。(コンソールにちゃんとThis request has been blocked; the content must be served over HTTPS.と書かれていましたが確認しておらず反省です。)
httpsで読み込まれているのに対して、httpのものを読み込もうとするとエラーになるとは知らず新しい発見でした!

解決策

httpsであれば問題ないとのことだったのでhttpで読み込まれていたパスをhttpsに変えてみたが対応していませんでした...
今回はリセットCSSを外部から読み込んで使おうと思っていたため、外部から読み込むのではなくreset.cssとしてファイルを作成することで解決しました。

参考記事

https://qiita.com/Kouch/items/5089fb36694c6e467a3a
https://www.transnet.ne.jp/2016/02/28/rails%e5%88%9d%e5%ad%a6%e8%80%85%e3%81%8c%e3%81%a4%e3%81%be%e3%81%9a%e3%81%8dcolnr%e3%80%8c%e3%82%a2%e3%82%bb%e3%83%83%e3%83%88%e3%83%91%e3%82%a4%e3%83%97%e3%83%a9%e3%82%a4%e3%83%b3/

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?