Production environment sees req.cookies NEXTJS Middleware as undefined

Here is my latest middleware implementation:

export async function middleware(request: NextRequest) {
const token = request.headers.get('token')
console.log(token)
if (!token || token == undefined) {
return NextResponse.redirect(new URL('/login', request.url))
}
}

export const config = {
matcher: \['/admin/:path\*'\]
}

This is the response from the backend express:

  `res.cookie('token', response.token, { 
    maxAge: maxAges,
    httpOnly: false,
    secure: process.env.NODE_ENV === 'production',
    sameSite: 'none'
  })`

The method works fine locally. However, when trying to deploy with HTTPS for both frontend and backend, it does not work as expected.

Answer №1

Kindly review the feedback and recommendations provided below.

  • The code snippet `res.cookie` is used to create a cookie within the response object.
  • To ensure that the cookie is saved in the browser, the corresponding request must include credentials: "include". Otherwise, the browser will ignore the cookie.
  • The line `const token = request.headers.get('token')` is aimed at retrieving the header token. However, unless the cookie has been explicitly set by the code, it will not be accessible through this method.
  • If a cookie has been successfully stored in the browser as per step 2, it needs to be sent back to the server with each request including credentials: "include". Failure to do so will result in the cookies not being transmitted to the server.
  • If the cookies have been successfully sent to the server, they can be read using the following example:
  • request.cookies.get('token')

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for downloading a file using a Django function triggered by JavaScript instead of redirecting to the URL

Managing a page with multiple buttons that trigger various functions, such as sending an SMS (via API), emailing a file, or downloading a PDF. The button actions are powered by Ajax requests through JavaScript instead of using forms. I initially used Java ...

The canvas loadFromJson function fails to implement the font-family property

I have implemented the following code to display Google font and update the canvas: /* on change of font, load the preview and update the canvas */ $('#font').on('change', function () { $('.font_preview').show ...

Several mistakes occurred involving auth0, react, apollo, babel, and webpack

I seem to be facing some challenges while trying to integrate auth0 into my project. Every time I fix one issue, another one pops up and it's always the same trio of errors: -require is not a function -window is not defined -missing class properties ...

What is the best way to incorporate animation using Tailwind CSS within my Next.js project?

I have a challenge with placing three images in a circular path one after the other using Tailwind CSS for styling. I've identified the circular path and keyframe style for the images. How do I configure this style in my Tailwind config file and imple ...

There seems to be an issue with the Typescript version compatibility in the node_modules folder for the Angular Material table cell component

While working on my project with Angular, I encountered an issue. I attempted to downgrade my TypeScript version to 3.9.7 but the problem persists. Below are the dependencies listed in my package.json: "private": true, "dependencies&qu ...

What is the best way to iterate over JSON data from an endpoint that contains multiple nested arrays using the .map() method?

Seeking to showcase weather API data from: () import Image from "next/image" interface Hour { time_epoch: number time: string temp_c: number temp_f: number is_day: number wind_mph: number wind_kph: number wind_deg ...

Transform an array into an array of objects

I currently have a collection of words stored in a .json file Here is an example: [ "apple", "banana", "orange" ] My objective is to create an object for each word Similar to this structure: [ { word: "appl ...

Event response lacks necessary latlng data from Gmaps API

Currently, I am utilizing Angular UI Google Maps and facing an issue in retrieving the latlng when a map click event occurs. Although the map is responding, it is not providing the latlng information as expected. Below is the excerpt of my code: Controlle ...

The module was not found because the package path "./link" is not being exported from the package located in the node_modules

Just completed a merge of one branch with another in my Next.js app, which included major changes and conflict resolutions. Initially, everything appeared to be fine. However, after reinstalling the next-intl package, I encountered the following error: M ...

How can I trigger the rendering of a component by clicking a button in a separate component?

I am currently facing a challenge in rendering a component with an "Edit" button that is nested within the component. I attempted to use conditional rendering in my code, but unfortunately, I am struggling to make it work as expected. Does anyone have any ...

Can you pinpoint the origin of the circular reference that triggers the error when using JSON.stringify?

I am encountering an issue where passing an object to JSON.stringify is resulting in the error "Converting circular structure to JSON," but I cannot pinpoint the exact reason for this. The object is being passed via server-side node.js. app.get('/&a ...

Customizing your buttons in Wordpress with extra CSS styles upon clicking

I am in the process of developing a Wordpress website and I require a button for switching between mobile and desktop versions manually. Within my .css file, I have included: @media (pointer:coarse) {} This adds modifications for the mobile version ...

What is causing the table to not be displayed in this Javascript program when it is used in a

I am currently experimenting with incorporating an infinite loop before the prodNum and quantity prompts to consistently accept user input and display the output in a table. Although the program is functional when executed, it fails to showcase the table ...

Having trouble with TypeScript configuration of typeRoots and types functionality not functioning correctly

My Current Directory Structure Let me show you the layout of my files: root ├──typings/ # currently empty ├──package.json ├──package-lock.json ├──tsconfig.json └──main.ts This is what my tsconfig.json looks like: { ...

React State Update Triggered by Changing Hidden Input/Textarea Value - No User Input Required

To activate a function when the contents of a hidden input, textarea, or textfield change in React without requiring user input to trigger it, you will need to dynamically adjust the value of the hidden input and then have the function automatically exec ...

Is it possible to modify the local reference point of an object in three.js?

Is there a method to readjust the center point of an STL file once it has been relocated or turned? For example, if the original rotation of my object is set at (0,0,0), and then I rotate it to (20,70,90) degrees, is it possible to modify the local origi ...

What is the most efficient way to retrieve and update a Stencil component parameter without triggering a rerender of the component?

Within my Stencil component, there exists a not-Prop member variable known as private _zIndex. The value of this variable can be adjusted via a method call like Method() setZIndex( zIndex : number );, or it may change internally during the component's ...

Navigating to Angular component from Mapbox popup

I'm currently working on a mobile app with Ionic and Angular. The app features various Mapbox markers that open custom popups when clicked, each displaying unique content. I want the button within the popup to redirect users to a page with more inform ...

A guide on implementing Google reCAPTCHA in a Nuxt.js website

Trying to implement the recaptcha-module from nuxt-community in my Nuxt project but struggling with verifying if the user has passed the check. The documentation and example provided are not clear enough for me (https://github.com/nuxt-community/recaptch ...

Mongoose and the concept of floating point values

My latitude and longitude numbers are being converted to strings. However, my section integers remain as the correct data type of Number. How can I adjust my model to retrieve lat and lng as Float instead of String? I am storing latLng data in my database ...