質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
SPA(Single-page Application)

SPA(Single-page Application)は、単一のWebページのみでコンテンツの切り替えができるWebアプリケーションもしくはWebサイトです。ブラウザでのページ遷移がないため、デスクトップアプリケーションのようなUXを提供します。

ログイン

ログインは、ユーザーがコンピューターシステムにアクセスするプロセスの事を呼びます。

Q&A

0回答

1665閲覧

SPAでログインありページを作る場合にログイン前にソースコードを見えるのは仕方ない?

lazex

総合スコア604

SPA(Single-page Application)

SPA(Single-page Application)は、単一のWebページのみでコンテンツの切り替えができるWebアプリケーションもしくはWebサイトです。ブラウザでのページ遷移がないため、デスクトップアプリケーションのようなUXを提供します。

ログイン

ログインは、ユーザーがコンピューターシステムにアクセスするプロセスの事を呼びます。

0グッド

2クリップ

投稿2020/09/29 03:04

React などで SPA のサイトを作り、そのサイトはすべてログイン必須(ログイン前に見えるのは基本ログイン画面のみ)という前提です。

これまで、ログイン前とログイン後で別のアプリとして作っていたのですが、本来は同じアプリなのに、別に作るのは無駄も多く 1 つのアプリとしてログイン前後もページ遷移なしにしたいと考えています。
機能的には Router で対応でき、世間でもそういうのが多いように思います。

しかし、その場合はログインする前でもログインにしか見えないソースコードが見えてしまうと思います。
API を通してデータの取得や更新を行うので、実際のデータを見たり更新処理はできませんが、どういう画面なのかがわかれば隠しているのにどういうサービスで何ができるのかがわかってしまうと思います。
また、 minify 済みとは言え、ソースコードを読めば POST するデータの構造や Header でどういうトークンを送っているなどの仕組みが見えてしまいます。

コードスプリッティングと遅延ロードを使えば、ログイン前のバンドルに含まれなくはできますが、分割されたモジュールごとにサーバサイドでアクセス制限の仕組みを作らない限りログイン後にロードするモジュールの URL にアクセスすれば見れてしまいます。
URL がわからないなら大丈夫と言えるかもしれませんが、実際には他人に見せたくないものを URL を複雑にするのではなく、認証したり IP 制限で対処することが多いように URL がわからないだけでは安心とは言えないと思います。

アクセス制限をかけれるならかけたいと思いますが、ビルド時に出力されるファイル名はランダムかハッシュ値で複雑になっていますし、それをビルドのたびにどれがログイン後にしか見えてはいけないものだと判断してサーバサイドのアクセス制限を書き換えて、というのは現実的に思えません。
正規表現などで自動判定も頑張ればできなくはないように思いますが、スマートなやり方には思えません。
一応、これまでの「別アプリとして作る」であればビルド時の出力フォルダが違うので単純にフォルダ単位のアクセス制限で済みました。

対処方法がないのか調べては見たのですが、このように 1 アプリとしている場合の例では特にアクセス制限を考慮しているものは見当たりませんでした。
世間の SPA のサイトは有名どころも含めログイン前でもソースコードが見えるような作りで問題なしとしているのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問