【react】特定ページをSPA管理下から切り離したい

Question

reactでSPAを構築しておりますが、お問い合わせページのみreactから切り離しPHPで動作させたいです。
サブドメインにリダイレクトするのではなく、ドメインは同一です。

react.js でリバースプロキシのような動作を設定することは可能でしょうか？

SPAで動作させたいページ

• sample.com
• sample.com/info
• sample.com/about

PHPで動作させたいページ

• sample.com/about

Comments

[maisumakun]

サーバサイドはどのように実装していますか？

[t.tohda]

AWSの別のインスタンスにcontact.php として配置されています。
中身はmb_send_mailなどの関数を用いてメールを送信するスクリプトです。

これだけならajaxでやりとりすればいいのと思いますが、サードパーティーのAPIの制約でHTTPリクエストがないといけないので、今回のような質問になりました。

[maisumakun]

いや、そちらじゃなくてSPAの側です。

[t.tohda]

失礼しました。フレームワークにGatsbyjs を利用して、AWS Amplify にデプロイしております。

[hoshi-takanori]

React 側 (たぶん Gatsby も？) は Link タグが SPA 遷移で、a タグが SPA 外の普通のページ遷移になると思います。あとは、サーバー側が SPA のパスなら SPA 共通の index.html を返し、contact.php なら PHP が動くようにすればいいのでは。具体的な方法はサーバー次第ですが。

Answer 1

Reactのみの機能では達成できません。この場合Reactを配信しているサーバのコード、質問者様のおっしゃるphpのコードでReactのJavaScriptを配信していらっしゃるのでしたらそのコードでsample.com/aboutに来たときのみ違う表示をするようにしてください。nginxなどのリバースプロキシを利用している場合は設定ファイルでパスによって呼び出すプログラムを変える設定が存在するので調べてみると良いでしょう。