Last week worked on authentication, does work properly ( Email sign-up, email sign-in, google oauth).
This week started to work with database
If I Sign-in to application ( Middleware prevent absolutely all pages from access if not authorized ) and / or sign out after that, everything works well.
Until... I go to /payments page and click on button - to add new payment:
After upload to database ( at the moment database accepts request from public access - from anyone, without restrictions), I get response:
And after when I tried to upload several payments to the database - I cannot log out from the application:
Console.error:
Server console error
```
Internal error: TypeError: e._formData.get is not a function
at ti (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:35:311006)
at t.decodeReply (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:35:314558)
at C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:286
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async rS (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:38:7978)
at async r4 (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:41:1256)
at async doRender (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1418:30)
at async cacheEntry.responseCache.get.routeKind (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1579:28)
at async DevServer.renderToResponseWithComponentsImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1487:28)
at async DevServer.renderPageComponent (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1911:24)
at async DevServer.renderToResponseImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1949:32)
at async DevServer.pipeImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:916:25)
at async NextNodeServer.handleCatchallRenderRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\next-server.js:272:17)
at async DevServer.handleRequestImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:812:17)
at async C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\dev\next-dev-server.js:339:20
at async Span.traceAsyncFn (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\trace\trace.js:154:20)
at async DevServer.handleRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\dev\next-dev-server.js:336:24)
at async invokeRender (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:173:21)
at async handleRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:350:24)
at async requestHandlerImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:374:13)
at async Server.requestListener (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\start-server.js:141:13)
digest: "3179946304"
POST /payments 500 in 25ms
```
And even If I try to clean all the localhost cookies, now im signed out of application, on try to sign in, i got the same error:
But If I delete in vscode .next whole folder and start the server again. Whole authentication proccess work without any error.
Until I start to interact with the appwrite cloud database again...
👍 Expected behavior
Working sign-in(email and with oauth providers), sign-out options without additional errors.
Also with appwrite cloud database functionality.
👎 Actual Behavior
Screenshots and problem provided in reproduction section.
Code Basis.
/app/sign-in/page.tsx
```typescript
"use client";
import {useEffect, useState} from "react";
import {toast} from "sonner";
import Link from "next/link";
import {Button} from "@/components/ui/button";
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/components/ui/card";
import {Input} from "@/components/ui/input";
import {Label} from "@/components/ui/label";
import {
createAdminClient,
createSessionClient,
signInWithEmail,
} from "@/lib/server/appwrite";
import {ID} from "node-appwrite";
import {cookies} from "next/headers";
import {redirect} from "next/navigation";
import {Loader2} from "lucide-react";
import {
signUpWithDiscord,
signUpWithGithub,
signUpWithGoogle,
signUpWithMicrosoft,
} from "@/lib/server/oauth";
import {Client, Account, OAuthProvider} from "appwrite";
import {Separator} from "@/components/ui/separator";
import ForgotPassword from "@/components/ForgotPassword";
import ProviderButton from "./ProviderButton";
// Define the type for the logged-in user, which might include other properties based on your backend
interface User {
name: string;
email: string;
[key: string]: any; // Add additional properties as needed
}
const LoginPage: React.FC = () => {
const [buttonLoading, setButtonLoading] = useState(false);
const [buttonGoogleLoading, setButtonGoogleLoading] =
useState(false);
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const handleLogin = async (e: any) => {
e.preventDefault();
setButtonLoading(true);
console.log(`Email: ${email}, password: ${password}`);
const session = await signInWithEmail(email, password)
.then(() => {
toast.success("Signed in succesffully!");
setButtonLoading(false);
})
.catch((err) => {
toast.error(`Error: ${err.message}`);
setButtonLoading(false);
});
console.log("Sign in session: ", session);
};
const hanleLoginGoogle = async () => {
await signUpWithGoogle();
};
const hanleLoginGithub = async () => {
await signUpWithGithub();
};
const handleLoginMicrosoft = async () => {
await signUpWithMicrosoft();
};
const handleLoginDiscord = async () => {
await signUpWithDiscord();
};
return (
Login
Enter your email below to login to your account
👟 Reproduction steps
I'm using latest nextjs version, typescript, tailwind and shadcn-ui components.
Dependencies
```json "dependencies": { "@radix-ui/react-avatar": "^1.1.0", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-dialog": "^1.1.1", "@radix-ui/react-dropdown-menu": "^2.1.1", "@radix-ui/react-label": "^2.1.0", "@radix-ui/react-select": "^2.1.1", "@radix-ui/react-separator": "^1.1.0", "@radix-ui/react-slot": "^1.1.0", "appwrite": "^14.0.1", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "lucide-react": "^0.429.0", "next": "14.2.6", "next-themes": "^0.3.0", "node-appwrite": "^13.0.0", "react": "^18", "react-dom": "^18", "recharts": "^2.12.7", "sonner": "^1.5.0", "tailwind-merge": "^2.5.2", "tailwindcss-animate": "^1.0.7" }, ```Last week worked on authentication, does work properly ( Email sign-up, email sign-in, google oauth). This week started to work with database
If I Sign-in to application ( Middleware prevent absolutely all pages from access if not authorized ) and / or sign out after that, everything works well. Until... I go to /payments page and click on button - to add new payment:
After upload to database ( at the moment database accepts request from public access - from anyone, without restrictions), I get response:
And after when I tried to upload several payments to the database - I cannot log out from the application:
Console.error:
Server console error
``` Internal error: TypeError: e._formData.get is not a function at ti (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:35:311006) at t.decodeReply (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:35:314558) at C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:286 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async rS (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:38:7978) at async r4 (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:41:1256) at async doRender (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1418:30) at async cacheEntry.responseCache.get.routeKind (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1579:28) at async DevServer.renderToResponseWithComponentsImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1487:28) at async DevServer.renderPageComponent (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1911:24) at async DevServer.renderToResponseImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:1949:32) at async DevServer.pipeImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:916:25) at async NextNodeServer.handleCatchallRenderRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\next-server.js:272:17) at async DevServer.handleRequestImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\base-server.js:812:17) at async C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\dev\next-dev-server.js:339:20 at async Span.traceAsyncFn (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\trace\trace.js:154:20) at async DevServer.handleRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\dev\next-dev-server.js:336:24) at async invokeRender (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:173:21) at async handleRequest (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:350:24) at async requestHandlerImpl (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\router-server.js:374:13) at async Server.requestListener (C:\Users\tomas\Documents\Code\appwrite\next-appwrite-transport-order\node_modules\next\dist\server\lib\start-server.js:141:13) digest: "3179946304" POST /payments 500 in 25ms ```And even If I try to clean all the localhost cookies, now im signed out of application, on try to sign in, i got the same error:
But If I delete in vscode
.next
whole folder and start the server again. Whole authentication proccess work without any error. Until I start to interact with the appwrite cloud database again...👍 Expected behavior
Working sign-in(email and with oauth providers), sign-out options without additional errors. Also with appwrite cloud database functionality.
👎 Actual Behavior
Screenshots and problem provided in reproduction section.
Code Basis.
/app/sign-in/page.tsx
```typescript "use client"; import {useEffect, useState} from "react"; import {toast} from "sonner"; import Link from "next/link"; import {Button} from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import {Input} from "@/components/ui/input"; import {Label} from "@/components/ui/label"; import { createAdminClient, createSessionClient, signInWithEmail, } from "@/lib/server/appwrite"; import {ID} from "node-appwrite"; import {cookies} from "next/headers"; import {redirect} from "next/navigation"; import {Loader2} from "lucide-react"; import { signUpWithDiscord, signUpWithGithub, signUpWithGoogle, signUpWithMicrosoft, } from "@/lib/server/oauth"; import {Client, Account, OAuthProvider} from "appwrite"; import {Separator} from "@/components/ui/separator"; import ForgotPassword from "@/components/ForgotPassword"; import ProviderButton from "./ProviderButton"; // Define the type for the logged-in user, which might include other properties based on your backend interface User { name: string; email: string; [key: string]: any; // Add additional properties as needed } const LoginPage: React.FC = () => { const [buttonLoading, setButtonLoading] = useState/app/sign-in/ProviderButton.tsx
```typescript import {Button} from "@/components/ui/button"; import {Loader2} from "lucide-react"; import React, {useState} from "react"; export default function ProviderButton({ title, handleLogin, }: { title: string; handleLogin: () => Promise/lib/server/appwrite.ts
```typescript // src/lib/server/appwrite.js "use server"; import {Client, Account, ID, OAuthProvider} from "node-appwrite"; import {cookies} from "next/headers"; import {redirect} from "next/navigation"; export async function createSessionClient() { const client = new Client() .setEndpoint(process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT as string) .setProject(process.env.NEXT_PUBLIC_APPWRITE_PROJECT as string); const session = cookies().get("__sessionIsh"); if (!session || !session.value) { throw new Error("No session"); } client.setSession(session.value); return { get account() { return new Account(client); }, }; } export async function createAdminClient() { console.log("Appwirte Endpoint: ", process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT); const client = new Client() .setEndpoint(process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT as string) .setProject(process.env.NEXT_PUBLIC_APPWRITE_PROJECT as string) .setKey(process.env.NEXT_APPWRITE_KEY as string); return { get account() { return new Account(client); }, }; } export async function getLoggedInUser() { try { const {account} = await createSessionClient(); return await account.get(); } catch (error) { return null; } } export async function getEnvProjectId() { return process.env.NEXT_PUBLIC_APPWRITE_PROJECT; } export async function signInWithEmail(email: string, password: string) { //"use server"; const {account} = await createAdminClient(); console.log("ADM account: ", account); const session = await account.createEmailPasswordSession(email, password); cookies().set("__sessionIsh", session.secret, { path: "/", httpOnly: true, sameSite: "lax", secure: true, }); redirect("/?status=ok"); } export async function signUpWithEmail( email: string, password: string, name: string ) { const {account} = await createAdminClient(); await account.create(ID.unique(), email, password, name); const session = await account.createEmailPasswordSession(email, password); cookies().set("__sessionIsh", session.secret, { path: "/", httpOnly: true, sameSite: "lax", secure: true, }); redirect("/?status=ok"); } export async function signOut() { const {account} = await createSessionClient(); cookies().delete("__sessionIsh"); await account.deleteSession("current"); redirect("/sign-in"); } export async function signUpWithGoogle() { const client = new Client() .setEndpoint(process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT as string) .setProject(process.env.NEXT_PUBLIC_APPWRITE_PROJECT as string); } ```/lib/server/oauth.ts
```typescript // src/lib/server/oauth.js "use server"; import {createAdminClient} from "@/lib/server/appwrite"; import {redirect} from "next/navigation"; import {headers} from "next/headers"; import {OAuthProvider} from "node-appwrite"; export async function signUpWithGithub() { const {account} = await createAdminClient(); const origin = headers().get("origin"); const redirectUrl = await account.createOAuth2Token( OAuthProvider.Github, `${origin}/api/oauth`, `${origin}/sign-up` ); return redirect(redirectUrl); } export async function signUpWithGoogle() { const {account} = await createAdminClient(); const origin = headers().get("origin"); console.log("Origin: ", origin); const redirectUrl = await account.createOAuth2Token( OAuthProvider.Google, `${origin}/api/oauth`, `${origin}/sign-in`, ["openid"] ); console.log("Redirect url: ", redirectUrl); return redirect(redirectUrl); } export async function signUpWithMicrosoft() { const {account} = await createAdminClient(); const origin = headers().get("origin"); console.log("Origin: ", origin); const redirectUrl = await account.createOAuth2Token( OAuthProvider.Microsoft, `${origin}/api/oauth`, `${origin}/sign-in`, ["openid"] ); console.log("Redirect url: ", redirectUrl); return redirect(redirectUrl); } export async function signUpWithDiscord() { const {account} = await createAdminClient(); const origin = headers().get("origin"); console.log("Origin: ", origin); const redirectUrl = await account.createOAuth2Token( OAuthProvider.Discord, `${origin}/api/oauth`, `${origin}/sign-in`, ["openid"] ); console.log("Redirect url: ", redirectUrl); return redirect(redirectUrl); } ```/app/api/oauth/route.ts
```typescript // src/app/oauth/route.js import {createAdminClient} from "@/lib/server/appwrite"; import {cookies} from "next/headers"; import {NextRequest, NextResponse} from "next/server"; export async function GET(request: NextRequest) { const userId = request.nextUrl.searchParams.get("userId") as string; const secret = request.nextUrl.searchParams.get("secret") as string; console.log("API USERID: ", userId); console.log("API SECRET: ", secret); const {account} = await createAdminClient(); const session = await account.createSession(userId, secret); cookies().set("__sessionIsh", session.secret, { path: "/", httpOnly: true, sameSite: "lax", secure: true, }); return NextResponse.redirect(`${request.nextUrl.origin}/?status=ok`); } ```🎲 Appwrite version
Appwrite Cloud
💻 Operating system
Windows
🧱 Your Environment
No response
👀 Have you spent some time to check if this issue has been raised before?
🏢 Have you read the Code of Conduct?