Next.js Discord

Discord Forum

Error [TypeError]: Expected an instance of Response to be returned

Answered
ihyd posted this in #help-forum
Open in Discord
ihydOP
async function verifyToken(token: string): Promise<Response> {
    const url = 'https://reflect.ihyd.xyz/api/verify';
    const headers = {
        'Content-Type': 'application/json',
        'Authorization': `Bearer ${token}`
    };
    const response = await fetch(url, { method: 'GET', headers });
    return response
}

export const middleware = async (req: NextRequest, res: NextResponse, next: NextResponse)  => {
    try {
        const authTokenCookie = req.cookies.get('authToken');
        const authToken = authTokenCookie?.value;
        const requestedPage = req.nextUrl.pathname;

        if (!authToken && authenticatedPages.includes(requestedPage)) {
            return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
        }

        if (authToken && authenticatedPages.includes(requestedPage)) {
            const isTokenValid = await verifyToken(authToken).then(response => response.ok);
            try {
            } catch (error) {
                if (error instanceof TypeError) {
                    console.error('Error verifying token:', error.message);
                } else {
                    console.error('Error verifying token:', error);
                }
                return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken');
            }

            if (!isTokenValid) {
                console.log('Invalid token');
                return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken');
            }
        }

        return NextResponse.next();
    } catch (error) {
        console.error('Error:', error);
        return NextResponse.next();
    }
}


I'm getting this error when I used my middleware, what am I doing wrong here?
Answered by Ray
const res = NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
res.cookies.delete('authToken')
return res
View full answer

20 Replies

@ihyd ts async function verifyToken(token: string): Promise<Response> { const url = 'https://reflect.ihyd.xyz/api/verify'; const headers = { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }; const response = await fetch(url, { method: 'GET', headers }); return response } export const middleware = async (req: NextRequest, res: NextResponse, next: NextResponse) => { try { const authTokenCookie = req.cookies.get('authToken'); const authToken = authTokenCookie?.value; const requestedPage = req.nextUrl.pathname; if (!authToken && authenticatedPages.includes(requestedPage)) { return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)); } if (authToken && authenticatedPages.includes(requestedPage)) { const isTokenValid = await verifyToken(authToken).then(response => response.ok); try { } catch (error) { if (error instanceof TypeError) { console.error('Error verifying token:', error.message); } else { console.error('Error verifying token:', error); } return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken'); } if (!isTokenValid) { console.log('Invalid token'); return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken'); } } return NextResponse.next(); } catch (error) { console.error('Error:', error); return NextResponse.next(); } } I'm getting this error when I used my middleware, what am I doing wrong here?
Ray
try changing this
export const middleware = async (req: NextRequest, res: NextResponse, next: NextResponse)  => {}

to
import { NextRequest, NextResponse } from 'next/server'

export const middleware = async (req: NextRequest)  => {}
ihydOP
i get this error
i narrowed it down to this
return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken');
the cookies.delete
if I remove that it works as intended, so how do I instruct it to delete the token if it's invalid?
@ihyd ts return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken');
Ray
const res = NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
res.cookies.delete('authToken')
return res
Answer
@ihyd ts return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl)).cookies.delete('authToken');
Ray
if you write this, this return a ResponseCookie instead of Response
thank you very much ^^
export const middleware = async (req: NextRequest) => {
  const authToken = req.cookies.get('authToken')?.value;
  const requestedPage = req.nextUrl.pathname;

  if (!authToken && authenticatedPages.includes(requestedPage)) {
    if (!authToken) {
      console.error('Auth token is null');
      return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
    }
  }

  if (authToken && authenticatedPages.includes(requestedPage)) {
    try {
      const isTokenValid = await validateAuthToken(authToken);
      if (!isTokenValid) {
        console.error('Token is invalid');
        const res = NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
        res.cookies.delete('authToken')
        return res
      }
    } catch (error) {
      console.error('Error validating token:', error);
      const res = NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
      res.cookies.delete('authToken')
      return res
    }
  }

  return NextResponse.next();
};


the updated code
is there anything that I should do differently?
I'm not very good with best practices and such
i'll mark the solution after that
@ihyd is there anything that I should do differently?
Ray
if (!authToken && authenticatedPages.includes(requestedPage)) {
      console.error('Auth token is null');
      return NextResponse.rewrite(new URL('/authentication?action=login', req.nextUrl));
  }
look good other than that
ihydOP
thank you :D
Ray
:lolsob: