Question

Nextjs 12, 13 with geo in middleware

Hi guys,

I couldn’t find information on how to get the geo in the middleware. For example, a user go on the website and I create a cookie location: Canada or location: city

For now I tried, but no success. It’s always USx:

export default async function middleware(req: NextRequest) {
const { nextUrl: url, geo } = req;

const city = geo?.latitude ?? 'USx';

const res = NextResponse.next();
const supabase = createMiddlewareSupabaseClient({ req, res });
res.cookies.set('city', city);

Submit an answer


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

KFSys
Site Moderator
Site Moderator badge
April 6, 2023

Hey @pob944,

I’ve not used NextJS however here is what I would do if I had to troubleshoot this and see why it doesn’t work :

  1. Make sure that the geo property is being set correctly in the nextUrl object. You can check this by logging the geo property to the console in your middleware function.

  2. Check that the user’s location can be determined using the geo property. You can do this by logging the latitude and longitude properties of the geo object to the console.

  3. If the user’s location cannot be determined, you can use a fallback location as a default value for the city variable. For example, you can set const city = geo?.city ?? 'Canada'; to set the city variable to “Canada” if the geo object does not contain a city property.

  4. Check that the cookie is being set correctly: Make sure that the cookie is being set correctly by logging the cookie value to the console or using a browser extension like “EditThisCookie” to inspect the cookie.

As said I’ve not used Nextjs however this should work either way:

export default async function middleware(req: NextRequest) {
  const { nextUrl: { geo } } = req;

  const city = geo?.city ?? 'Canada';

  const res = NextResponse.next();
  res.cookies.set('city', city);

  return { req, res };
}

Hope I help even a little bit!

KFSys
Site Moderator
Site Moderator badge
April 6, 2023

Hey @pob944,

  1. Make sure that the geo property is being set correctly in the nextUrl object. You can check this by logging the geo property to the console in your middleware function.

  2. Check that the user’s location can be determined using the geo property. You can do this by logging the latitude and longitude properties of the geo object to the console.

  3. If the user’s location cannot be determined, you can use a fallback location as a default value for the city variable. For example, you can set const city = geo?.city ?? 'Canada'; to set the city variable to “Canada” if the geo object does not contain a city property.

  4. Check that the cookie is being set correctly: Make sure that the cookie is being set correctly by logging the cookie value to the console or using a browser extension like “EditThisCookie” to inspect the cookie.

I’ve not used Nextjs however this should work eitherway :

export default async function middleware(req: NextRequest) {
  const { nextUrl: { geo } } = req;

  const city = geo?.city ?? 'Canada';

  const res = NextResponse.next();
  res.cookies.set('city', city);

  return { req, res };
}

Hope I help even a little bit!

KFSys
Site Moderator
Site Moderator badge
April 6, 2023

Hey @pob944,

  1. Make sure that the geo property is being set correctly in the nextUrl object. You can check this by logging the geo property to the console in your middleware function.

  2. Check that the user’s location can be determined using the geo property. You can do this by logging the latitude and longitude properties of the geo object to the console.

  3. If the user’s location cannot be determined, you can use a fallback location as a default value for the city variable. For example, you can set const city = geo?.city ?? 'Canada'; to set the city variable to “Canada” if the geo object does not contain a city property.

  4. Check that the cookie is being set correctly: Make sure that the cookie is being set correctly by logging the cookie value to the console or using a browser extension like “EditThisCookie” to inspect the cookie.

I’ve not used Nextjs however this should work eitherway :

export default async function middleware(req: NextRequest) {
  const { nextUrl: { geo } } = req;

  const city = geo?.city ?? 'Canada';

  const res = NextResponse.next();
  res.cookies.set('city', city);

  return { req, res };
}

Hope I help even a little bit!

Try DigitalOcean for free

Click below to sign up and get $200 of credit to try our products over 60 days!

Sign up

card icon
Get our biweekly newsletter

Sign up for Infrastructure as a Newsletter.

Sign up
card icon
Hollie's Hub for Good

Working on improving health and education, reducing inequality, and spurring economic growth? We’d like to help.

Learn more
card icon
Become a contributor

You get paid; we donate to tech nonprofits.

Learn more
Welcome to the developer cloud

DigitalOcean makes it simple to launch in the cloud and scale up as you grow – whether you’re running one virtual machine or ten thousand.

Learn more ->
DigitalOcean Cloud Control Panel