Introducing Protected Pages

Rishi Raj Jain

LaunchFa.st comes with baked-in protected page(s) to help you prevent un-authenticated access to such pages. With the authentication methods such as Twitter OAuth 2.0, Google OAuth 2.0 and Credentials (email and password) built in with LaunchFa.st, such authenticated methods can be used by your users to get access to the protected pages in your application.

Here’s how easily you can create protected pages with LaunchFa.st:

Create a file, say protected.astro with the following code:

---
import { getSession } from '@/lib/utils/auth'

const session = getSession(Astro.cookies)

if (!session) return webResponse('Unauthorized', 403, {})
---

<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
  </head>
  <body class="font-display">
    <div class="relative mx-auto flex max-w-7xl flex-col px-8 sm:px-4 py-8">
      <h1 class="pb-6 text-3xl font-medium text-launchfast">Protected Content!</h1>
    </div>
  </body>
</html>

That’s it! The getSession in the LaunchFast Starter Kit takes care of decoding the session cookies and validating the user authentication status. If unauthorized, a 403 response is sent enforcing authentication based access to the content.

Worry not, with LaunchFa.st you get such a page protected.astro built for you with goodies on top.