シスアド：(開発環境-11)フロントエンド用の定数類の設定

次に、フロントエンド用の定数類を設定します。
フロントエンドでは、バックエンドとの通信に必要な情報を定数として定義しています。

編集箇所

フロントエンドについては、デプロイ先がローカルか否かを自動で判別し、定数を振り分けます。
以下のsrc¥router¥getUrl.tsを編集します。

1. `getHcaptchaSitekey`の編集

ここには、hCaptchaのsitekeyを設定します。
sitekeyは、hCaptchaのサイトで取得できます。

ts

// 例
// この例では、本番環境の場合は`aaaaaaa-ffff-ffff-ffff-000000000001`、ローカル環境の場合は`10000000-ffff-ffff-ffff-000000000001`を返します。
export const getHcaptchaSitekey = () =>
  isProduction
    ? "aaaaaaa-ffff-ffff-ffff-000000000001"
    : "10000000-ffff-ffff-ffff-000000000001";

2. `getBasedHost`の編集

続いて、getBasedHostを編集します。
ここには、バックエンドのホスト名を設定します。

ts

// 例
// この例では、本番環境の場合は`https://example.com`、ローカル環境の場合は`http://localhost:8080`を返します。
export const getBasedHost = () =>
  isProduction ? "https://example.com" : "http://localhost:8080";

基本的には、これで完了です。
isProductionはnodeの状態から参照するため、特に変更する必要はありません。