是否可以在下一个身份验证的弹出窗口中进行社交登录？或者只能重定向到提供商身份验证页面？
我这样问是因为我不想在重定向到提供程序页面后丢失所有应用程序状态。
我不想将内容保存在数据库或浏览器存储中。
export default NextAuth({
// Configure one or more authentication providers
providers: [
Providers.Facebook({
clientId: process.env.FACEBOOK_ID,
clientSecret: PROCESS.ENV.FACEBOOK_SECRET
}),
Providers.Google({
clientId: process.env.GOOGLE_ID,
clientSecret: process.env.GOOGLE_SECRET,
authorizationUrl: 'https://accounts.google.com/o/oauth2/v2/auth?prompt=consent&access_type=offline&response_type=code',
}),
Providers.Credentials({
name: "credentials",
async authorize(credentials, req) {
const user = { email: req.body.email }
return user
},
}),
// ...add more providers here
],
jwt: {
signingKey: process.env.SIGNINING_KEY,
},
callbacks: {
async signIn(user, account) {
const { name, email } = user;
const { provider } = account
try {
// …在这种情况下如何实现Provider.Credentialsfor呢？[...nextauth].js
流程“图”\nNext request ---> Next API (with Next-Auth) ---> Rails API (returning Token)
目前我有这些options：
providers: [\n CredentialsProvider({\n name: \'Email\',\n credentials: {\n email: { label: "Email", type: "email", placeholder: "meine.email@domain.com" },\n password: { label: "Passwort", type: "password" }\n },\n async authorize(credentials) {\n\n // The \'url\' is pointing to a Rails API endpoint which returns …我正在尝试制作一个登录页面。在我的 page.tsx 文件上，我收到两个错误之一，具体取决于我是否包含“使用客户端”；在我的代码的顶部。如果我没有“使用客户端”；我收到此错误：
Error: React Context is unavailable in Server Components
如果我确实使用“使用客户端”；我收到此错误：
Error: [next-auth]: useSession must be wrapped in a <SessionProvider />
这是我的layout.tsx 文件：
import Image from 'next/image'
import { SessionProvider } from "next-auth/react";
import { ReactNode } from "react";
import React from 'react';
import "./globals.css";
import Link from "next/link";
type Props = {
children: ReactNode;
session: any;
};
export default function Layout({ children, session }: Props) {
return (
<html lang="en">
<head />
<body>
<div className="mx-auto">
<div className="flex flex-row …我正在使用 Next.js 13 进行开发
，并且没有服务器端渲染 (SSR) 的经验。
我的问题是什么
我有一个基于 Express.js 的自定义后端 API。
该后端服务已经实现了身份验证功能，例如登录、注册、注销，甚至使用 Google 进行社交登录。
我打算继续使用现有的后端身份验证服务，而不是采用 Next.js 的next-auth身份验证系统。
我做出这个决定是有原因的：
Next.js 可用于全栈应用程序，但对我来说感觉更像是前端。
由于我的后端服务已经建立，我想重用它的身份验证功能。
当前逻辑在我的前端中，
cookie - 我正在从服务器获取（next.js）检索cookie以验证用户的登录状态。
到目前为止它工作得很好（作为初学者的角度）
我很好奇是否有其他方法可以使用我的后端 API 来类似地处理身份验证，而不依赖于next-auth.
我想探索替代解决方案并检查这种方法是否是有效的策略。
在前端
从服务器上获取数据的cookie有jwt，我解码以将用户名放在导航栏上
我正在使用 Next.js、NextAuth.js 和 Typescript 开发一些受保护的页面。我的以下代码_app.tsx取自 NextAuth.js 官方网站，但其中包含一个auth不存在Component的类型为 的属性var Component: NextComponentType<NextPageContext, any, {}>，因此 TS 显示了一个错误：
function MyApp({ Component, pageProps: { session, ...pageProps } }: AppProps) {
return (
<>
<SessionProvider session={session}>
{Component.auth ? (
<Auth>
<Component {...pageProps} />
</Auth>
) : (
<Component {...pageProps} />
)}
</SessionProvider>
</>
);
}
我不是 Typescript 专家，所以我的问题是如何auth使用 TS 添加/扩展该属性到组件？
我正在遵循此文档： https: //authjs.dev/reference/adapter/mongodb以使用 next-auth。这是相关代码：
import NextAuth from "next-auth"
import { MongoDBAdapter } from "@auth/mongodb-adapter"
import clientPromise from "../../../lib/mongodb"
...
export default NextAuth({
providers,
adapter: MongoDBAdapter(clientPromise),
})
我收到以下错误，这对我来说毫无意义：
Type 'Adapter' is not assignable to type 'Adapter | undefined'.
Type 'Adapter' is not assignable to type 'DefaultAdapter & { createVerificationToken: (verificationToken: VerificationToken) => Awaitable<VerificationToken | null | undefined>; useVerificationToken: (params: { ...; }) => Awaitable<...>; }'.
Type 'Adapter' is not assignable to type 'DefaultAdapter'.
Types of property 'createUser' are incompatible.
Type …我无法在 getServerSideProps 中使用 HTTPS 的 getSession() 。
\n这正常吗？我尝试了很多次。
\n如果使用 HTTPS 我会得到它。我无法在 getServerSideProps 中使用 getSession()
\n__Secure-next-auth.callback-url\n__Secure-next-auth.session-token\n__Host-next-auth.csrf-toke\n如果使用 HTTP 并且我可以在 getServerSideProps 中 getSession() 就可以了
\nnext-auth.callback-url\nnext-auth.session-token\nnext-auth.csrf-token\n如何在 getServerSideProps 中的 HTTPS getSession() 上修复它？
\n我在 http 或 https 上运行相同的代码进行测试
\n如果使用 http 运行，我可以获得 props.session\n 如果使用https运行，我无法获取 props.session
\nimport { getSession } from 'next-auth/client';\n\nexport default function Home(props) {\n console.log(props.session);\n return (\n <div>\n <h1>Server Side Rendering</h1>\n </div>\n );\n}\nexport async function getServerSideProps(context) {\n return {\n props: {\n session: await …我正在使用打字稿，我的 [...next-auth].tsx 文件如下所示：
import NextAuth, { Awaitable, Session, User } from "next-auth";
// import GithubProvider from "next-auth/providers/github";
import GoogleProvider from "next-auth/providers/google";
type ExtendedUserType = User & { username?: string; uid?: string };
export default NextAuth({
// Configure one or more authentication providers
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID,
clientSecret: process.env.GOOGLE_CLIENT_SECRET,
}),
// ...add more providers here
],
pages: {
signIn: "/auth/signin", // for custom sign in page
},
callbacks: {
async session({ session, token, user }): Awaitable<Session> {
(session.user as ExtendedUserType).username …我的 NextJS 13 应用程序未构建并返回类型错误，但它完全可以在开发环境中运行
\n该文件中显示类型错误
\nimport NextAuth, { AuthOptions } from "next-auth";\nimport GoogleProvider from "next-auth/providers/google"\n\nexport const authOptions: AuthOptions = {\n providers: [\n GoogleProvider({\n clientId: process.env.GOOGLE_ID as string,\n clientSecret: process.env.GOOGLE_SECRET as string,\n }),\n ],\n}\n\nconst handler = NextAuth(authOptions);\n\nexport { handler as GET, handler as POST}\n文件路径是 app/api/auth/[...nextauth]/route.ts
\n这是控制台 \xe2\xac\x87\xef\xb8\x8f 中显示的错误消息
\n.next/types/app/api/auth/[...nextauth]/route.ts:8:13\nType error: Type 'OmitWithTag<typeof import("D:/4 - Coding/Training/NextAuth/next-auth-new/app/api/auth/[...nextauth]/route"), "config" | "generateStaticParams" | "revalidate" | "dynamic" | "dynamicParams" | ... 9 more ... | "PATCH", "">' does not satisfy …我开始与剧作家进行端到端测试。大多数应用程序都需要进行身份验证。使用用户名/密码机制自动执行此操作非常简单。问题是我要测试的应用程序只有两种身份验证机制：Github OAuth 和电子邮件身份验证链接。具体来说，我在 NextJS 项目中使用 next-auth。
我不知道应该如何与 Playwright 进行端到端测试，我考虑过的选项是：
第一个选项更容易实现，但它不再是端到端测试。第二个选项看起来很难实现，我不知道是否值得推荐。我不知道是否有更智能或更标准化的方法来进行此操作。
next-auth ×10
next.js ×8
reactjs ×5
typescript ×2
e2e-testing ×1
express ×1
google-oauth ×1
javascript ×1
jwt ×1
next.js13 ×1
oauth ×1
playwright ×1