Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

cannot get context.session.$publicData with passportAuth and app router #4213

Open
toofusan opened this issue Sep 8, 2023 · 0 comments
Open

cannot get context.session.$publicData with passportAuth and app router #4213

toofusan opened this issue Sep 8, 2023 · 0 comments
Labels
kind/bug Something isn't working status/triage

Comments

@toofusan
Copy link

toofusan commented Sep 8, 2023

What is the problem?

I'm trying to migrate from page to app.
Our application uses passport -google-oauth20 to authenticate users. But even though users have signed in, they can't be authenticated by useAuthenticatedBlitzContext, and redirect to login page.
It seems that there is no session data in BlitzContext.

Session has been created.(in Client Component, useSession returns session data correctly)

How can I do about this?

Paste all your error logs here:

It seems that there is no error logs in both client and server.

Paste all relevant code snippets here:

app/blitz-client.ts

"use client"

import { AuthClientPlugin } from "@blitzjs/auth"
import { setupBlitzClient } from "@blitzjs/next"
import { BlitzRpcPlugin } from "@blitzjs/rpc"

export const authConfig = {
  cookiePrefix: "my-cookie",
}

export const { withBlitz, BlitzProvider, useSession, useAuthenticatedSession } = setupBlitzClient({
  plugins: [AuthClientPlugin(authConfig), BlitzRpcPlugin({})],
})

/app/blitz-server.ts

import { setupBlitzServer } from "@blitzjs/next"
import { AuthServerPlugin, PrismaStorage } from "@blitzjs/auth"
import { simpleRolesIsAuthorized } from "@blitzjs/auth"
import { BlitzLogger } from "blitz"
import db from "db"
import { authConfig } from "./blitz-client"
import { RpcServerPlugin } from "@blitzjs/rpc"

export const { gSSP, gSP, useAuthenticatedBlitzContext, getBlitzContext, api, invoke } =
  setupBlitzServer({
    plugins: [
      AuthServerPlugin({
        ...authConfig,
        storage: PrismaStorage(db),
        isAuthorized: simpleRolesIsAuthorized,
      }),
      RpcServerPlugin({}),
    ],
    logger: BlitzLogger({}),
  })

/app/layout.tsx

"use client"

import React from "react"

import { BlitzProvider } from "app/blitz-client"
import "./globals.css"

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="ja" className="dark scroll-smooth">
      <head>
        <title>Karabina</title>
      </head>

      <body className="dark:bg-black dark:text-gray-850">
        <BlitzProvider>{children}</BlitzProvider>
      </body>
    </html>
  )
}

/app/page.tsx

import Link from "next/link"

export default function Page() {
  <Link href="/api/auth/google?scope=email" passHref legacyBehavior>Sign in with Google</Link>
}

/src/pages/api/auth/[...auth].ts

import { passportAuth } from "@blitzjs/auth"
import { api } from "app/blitz-server"
import db from "db"
import { Strategy as GoogleStrategy } from "passport-google-oauth20"
import * as process from "process"

export default api(
  passportAuth({
    successRedirectUrl: "/",
    errorRedirectUrl: "/",
    secureProxy: true,
    strategies: [
      {
        strategy: new GoogleStrategy(
          {
            clientID: process.env.GOOGLE_CLIENT_ID,
            clientSecret: process.env.GOOGLE_CLIENT_SECRET,
            callbackURL: process.env.GOOGLE_CALLBACK,
            scope: ["email"],
          },
          async function (accessToken, refreshToken, profile, done) {
            const email = profile.emails && profile.emails[0]?.value

            if (!email) {
              return done(new Error("Google response doesn't have email."))
            }

            const userIdp = await db.userIdp.upsert({
              where: {
                provider_providerId: { provider: profile.provider, providerId: profile.id },
              },
              create: {
                provider: profile.provider,
                providerId: profile.id,
              },
              update: { providerId: profile.id },
            })

            const user = await db.user.upsert({
              where: { userIdpId: userIdp.id },
              create: {
                email,
                name: email,
                userIdpId: userIdp.id,
              },
              update: { email },
            })

            const publicData = {
              userId: user.id,
              roles: [user.role],
              source: userIdp.provider,
            }
            done(undefined, { publicData })
          }
        ),
      },
    ],
  })
)

/app/secure/page.tsx

import { getBlitzContext, useAuthenticatedBlitzContext } from "app/blitz-server"

export default async function Page() {
  const ctx = await getBlitzContext()
  console.log(ctx.session.$publicData) // => { userId: null }

  await useAuthenticatedBlitzContext({
    redirectTo: "/auth/login",
    role: ["USER"],
    redirectAuthenticatedTo: "/",
  })

  return <div>Secured Content</div>
}

What are detailed steps to reproduce this?

  1. click the Sign in with Google in / with no authentication
  2. authenticate and permit to access in Google website
  3. redirect back to / from Google website
  4. go to /secure
  5. redirect to /auth/login by useAuthenticatedBlitzContext <= this is the problem.

Run blitz -v and paste the output here:

> blitz -v
Blitz version: 2.0.0-beta.20 (global)
Blitz version: 2.0.0-beta.32 (local)
macOS Monterey | darwin-arm64 | Node: v16.16.0


 Package manager: npm

  System:
    OS: macOS 12.5.1
    CPU: (8) arm64 Apple M1
    Memory: 84.44 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.16.0 - ~/.anyenv/envs/nodenv/versions/16.16.0/bin/node
    Yarn: 3.6.2 - ~/.volta/bin/yarn
    npm: 8.15.1 - ~/.anyenv/envs/nodenv/versions/16.16.0/bin/npm
  npmPackages:
    @blitzjs/auth: 2.0.0-beta.32 => 2.0.0-beta.32
    @blitzjs/next: 2.0.0-beta.32 => 2.0.0-beta.32
    @blitzjs/rpc: 2.0.0-beta.32 => 2.0.0-beta.32
    @prisma/client: ^5.2.0 => 5.2.0
    blitz: 2.0.0-beta.32 => 2.0.0-beta.32
    next: 13.4.19 => 13.4.19
    prisma: ^5.2.0 => 5.2.0
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    typescript: ^4.8.4 => 4.9.5

Please include below any other applicable logs and screenshots that show your problem:

No response
@toofusan toofusan added kind/bug Something isn't working status/triage labels Sep 8, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
kind/bug Something isn't working status/triage
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@toofusan