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

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

新規登録して質問してみよう
ただいま回答率
85.47%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

SPA(Single-page Application)

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

Firebase Authentication

Firebase Authenticationは、Firebaseを利用したユーザーの認証機能です。バックエンドサービス、SDK、アプリでのユーザー認証に使用できるUIライブラリが用意されています。

セキュリティー

このタグは、コンピューターシステムの安全性やデータの機密性に関連したトピックの為に使われます。

Q&A

0回答

522閲覧

Nuxt.js(SPA)+静的ウェブサイトホスティングサービス利用時の認証後ページの秘匿について

shooo0615

総合スコア6

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

SPA(Single-page Application)

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

Firebase Authentication

Firebase Authenticationは、Firebaseを利用したユーザーの認証機能です。バックエンドサービス、SDK、アプリでのユーザー認証に使用できるUIライブラリが用意されています。

セキュリティー

このタグは、コンピューターシステムの安全性やデータの機密性に関連したトピックの為に使われます。

0グッド

1クリップ

投稿2022/04/30 03:41

Nuxt.js(SPA)静的ウェブサイトホスティングサービス 上に
JSON Web Token形式の認証を利用した
会員専用ページのウェブサイト運営を検討しています。

会員の場合は、ウェブサイトの内容を閲覧することができ、
会員以外の場合は、ログインページ以外のウェブサイトの内容を閲覧できないようにしたいです。

試しに会員専用ページを実装してみて、ビルドし、デプロイしました。

デプロイされたページを閲覧すると、
会員専用ページの内容が秘匿できているように感じていますが、
サーバサイド側のプログラムが実行されているわけではないので、
本当に秘匿できているかどうかがわからず、質問させていただきました。

詳細な状況

静的ウェブサイトホスティングサービスは、Firebase Hosting
認証機能には、Firebase Authenticationを利用しています。

middlewareで認証情報を確認して、ログインできている場合は、会員専用ページを表示します。

参考URL:Nuxt(SPA)+Firebaseでログイン処理を実装する

会員後のページの内容を Cloud Firestoreなど に設置する方法も考えられますが、
Firebase Hosting と Firebase Authentication だけで会員後のページ内容を
秘匿できるのかを知りたいです。

試したこと

yarn build をして dist 配下にあるファイルを Firebase Hosting でホストしました。
問題なく動作しているのですが、
ホスティング部分では、サーバサイドでプログラムが動いているわけではないので、
会員専用ページの内容が秘匿されているのかどうか気になっています。

ビルドして生成された _nuxt/*****.jsの中身を見たのですが、
日本語(ログイン後のコンテンツ)が記載されていなかったので、
会員専用ページの内容が秘匿できているように感じましたが……。
(では、どのようにクライアントサイドでページが生成されているのかも気になっています。)

また、Nuxt.js(SPA)では、秘匿が難しいのであれば、
Nuxt.js(SSR)を利用することも検討しようと思いますが、
Nuxt.js(SSR)では秘匿できるのでしょうか?
今回の要件に合う形式で、簡単にできるやり方があればご教示いただけると嬉しいです。

よろしくお願いします。

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

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

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

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

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

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.47%

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

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

質問する

関連した質問