ローカルで動くPERNアプリをHerokuにデプロイしたものの動かないときに解決できた方法

１．問題

背景：Postgresql + Express + React + Node.jsでCRUD アプリを作成。

症状：ローカルでは動くが、Herokuにデプロイはできるものの、最初に行われるはずの「Postgresqlに入っているデータを読み込んで表示」ができない。

見つかったエラー：code H12, "fetch failed loading", no pg

２．原因

Herokuではフロントとポスグレの間はssl接続をしないといけないのに、その設定をしていなかった。

３．具体的な解決方法

サーバー側、DATABASE＿URLを設定するところでSSL接続を以下のように設定しました。イイダリョウさんの投稿を参考にしました。感謝です。

const pool = new Pool({
   connectionString : process.env.NODE_ENV === "production" ? proConfig : devConfig,//この下、SSLの設定を追加した。
   ssl:{
       sslmode: 'require',
       rejectUnauthorized: false
   }
})

４．解決に至るまでの経緯

最初、terminalで　heroku logs　と打ってログを出す。

するとまず目に留まったのがエラーコード。

at=error code=H12 desc="Request timeout" method=GET path="/xxx" host=xxxxxx.com request_id=xxxxxxx fwd="xxx.xx.xx.x" dyno=web.1 connect=1ms service=30002ms status=503 bytes=0 protocol=https

で、なにしろerrorと書いてあるのでこちらの線で調べましたが、Herokuのポスグレのリージョンがアメリカになってるのは関係ある？！とかいろいろ想像力を働かせましたが、fetchに時間がかかるというのも、ローカルでサクッとできている限りおかしいと思い、ブラウザーの開発者コンソールを見ると、

fetch failed loadingとある。

そうか。そもそもfetchできてない？

では、コード自体でデプロイの準備を間違ったかなぁと調べて、まぁpackage.jsonの中、enginesをengineと書いてあったとかミスは見つかりましたがそれを直したところで、やはりロードしれくれない。

基本に戻ろうと、もう一度ログを落ち着いて読むと、 ​

no pg_hba.conf entry for host "xxx.xx.xxx.xx", user "xxxxxxx", database "xxxxxxx", SSL off

とある。え？no pg??? ポスグレがない？
これだわ、原因は！ということで（これ、見てなかった💦）

no pg_hba.conf entry for host heroku

でググりましたところ、stackoverflowで、SSL接続が必要ということが分かり、その設定方法も、コードの中で設定する方法、ターミナル上でconfigを編集する方法、など、複数紹介されていました。

ターミナルで直接できるなら楽だわ、と思ったものの、いやいや安易に決めてはいけないともう一度調べると、上に掲げたイイダリョウさんの詳細な検討を記した投稿が見つかり、これまた上に示した設定をコード内で行ってgit push heroku main すると、、、見事解決しました！ありがたや～。

ちなみに、あとで、調べてみると、Herokuの公式サイトにあるHeroku Postgresql ＆SSLというセクションでも、

Most clients will connect over SSL by default, but on occasion it is necessary to set the sslmode=require parameter on a Postgres connection. Please add this parameter in code rather than editing the config var directly. Please check you are enforcing use of SSL especially if you are using Java or Node.js clients.　（たいていのクライアントではデフォルトでSSL接続をするけれど、ポスグレの接続についてsslmode=requireというパラメータを設定しないといけないこともあります。そのときは、直接 config varを編集するんじゃなくて、コードにこのパラメータを足してください。JavaやNode.jsのクライアントを使っているときはSSLを使うようにしているか確認してください。）

とありました。そのものずばり、しかも、コードで足してよ！とまで書いてました。安易に飛びつかず、もうひとググりしようかというまで成長したのはこれまで痛い目にあったから。まぁ、すなおに自分をほめてやりたいです。

ログを読み、無い知恵を絞り、また、あちこちググりまくって、多くの方々の投稿に助けられたので、今後どなたかの参考になるかもと思いまとめました。