1. HOME
  2. ブログ
  3. IT技術
  4. 【第3回】Responder + Firestore でモダンかつサーバーレスなブログシステムを作ってみた【管理者ページ整備】

【第3回】Responder + Firestore でモダンかつサーバーレスなブログシステムを作ってみた【管理者ページ整備】

~第3回~モダンなフレームワークの使い方を学びながらブログシステムを構築

連載「Python Responder + Firestore で、モダンかつサーバーレスなブログシステムを作ってみる」第3回目です。

前回は、「Firebase のセットアップ」と「認証機能の基盤」を作成しました。

今回は、認証機能の整備ということで、「クッキー管理」と「ログアウト機能」を追加していきます。

こちらの記事もオススメ!

Cookie によるログイン管理

第2回目で作成したログイン機能はちゃんと機能していますが、とても不便な部分があります。

それは、「管理者ページに POST でしか入れない」ことです。

本来ならば、一度ログインすれば、GET でアクセスしても、ログインを介さずにアクセスできます。

そういった機能は、Cookie を使って構築していきましょう。

Cookie を使って GET でも管理者ページに入れるように

Responder では、Cookie の「セット」は resp.set_cookie() 、「取得」は req.cookies です。

したがって、以下の仕様にしたいと思います。

  1. ログイン成功時に Cookie をセット
  2. GET でのアクセス時に、Cookie にログインユーザがいれば、管理者ページを表示

コード

これで、ログインをしていれば、管理者ページに GET でログインできます。

Cookie の破棄

一定時間後に Cookie の自動破棄をする」仕様にしたい場合は、どうすればいいのでしょう?

そんな時は、 expires=**, max_age=** で変更します。

expires は「日付」、 max-age は「破棄までの秒数」を指定します。

今回は、5日間としました。

ログアウト機能

次に、ログアウト機能を「/logout」に作成します。

実装内容はとても単純で、Cookie を破棄すれば OK です。

実際に、ログイン後に「/logout」にアクセスしてみてください。

その後「/admin」にGETでアクセスしても、ログイン画面に戻されるはずです。

管理者ページを整える

最後に、管理者ページを軽く整えておきましょう。

管理者ページでは、「投稿の編集や追加」「プロフィールの編集」などができます。

注意

あなたの好みのデザインを使って構いません。

また、今回作ったデザインに仮データは入っていますが、これはいずれ消します

CSS 追記

さらに、CSSも追記します。

完成!

管理者ページを簡単にデザイン

サイドメニューのリンクは、後ほどコーディングしていきます。

もちろん、今はまだ動作しません。

第4回へつづく!

今回は、「認証機能の整備」と「管理者ページ整備」を行いました。

まだあんまりブログっぽくないですね…。

次回からは、いよいよ「ブログ記事とデータベース周りの整備」を行っていきます!

具体的には、「カテゴリの追加」「記事の追加」などを実装していきます。

お楽しみに!

(株)ライトコードは、WEB・アプリ・ゲーム開発に強い、「好きを仕事にするエンジニア集団」です。
Responder + Firestoreでの開発依頼・お見積もりはこちらまでお願いします。
また、ResponderやFirestoreを扱えるエンジニアを積極採用中です!詳しくはこちらをご覧ください。

※現在、多数のお問合せを頂いており、返信に、多少お時間を頂く場合がございます。

次回の記事はこちら

第1回はこちら

こちらの記事もオススメ!

ライトコードよりお知らせ

にゃんこ師匠にゃんこ師匠
システム開発のご相談やご依頼はこちら
ミツオカミツオカ
ライトコードの採用募集はこちら
にゃんこ師匠にゃんこ師匠
社長と一杯飲みながらお話してみたい方はこちら
ミツオカミツオカ
フリーランスエンジニア様の募集はこちら
にゃんこ師匠にゃんこ師匠
その他、お問い合わせはこちら
ミツオカミツオカ
   
お気軽にお問い合わせください!せっかくなので、別の記事もぜひ読んでいって下さいね!

一緒に働いてくれる仲間を募集しております!

ライトコードでは、仲間を募集しております!

当社のモットーは「好きなことを仕事にするエンジニア集団」「エンジニアによるエンジニアのための会社」。エンジニアであるあなたの「やってみたいこと」を全力で応援する会社です。

また、ライトコードは現在、急成長中!だからこそ、あなたにお任せしたいやりがいのあるお仕事は沢山あります。「コアメンバー」として活躍してくれる、あなたからのご応募をお待ちしております!

なお、ご応募の前に、「話しだけ聞いてみたい」「社内の雰囲気を知りたい」という方はこちらをご覧ください。

ライトコードでは一緒に働いていただける方を募集しております!

採用情報はこちら

書いた人はこんな人

ライトコードメディア編集部
ライトコードメディア編集部
「好きなことを仕事にするエンジニア集団」の(株)ライトコードのメディア編集部が書いている記事です。

関連記事

採用情報

\ あの有名サービスに参画!? /

バックエンドエンジニア

\ クリエイティブの最前線 /

フロントエンドエンジニア

\ 世界はお前の手の中に・・・ /

モバイルエンジニア

\ サービスの守り神! /

インフラエンジニア