Nuxt Middlewares

up:: Nuxt ⚐

• Middlewares with Nuxt 3 — Course part 8 - YouTube
• middleware/ · Nuxt Directory Structure

Summary

Middlewares allow functions to run in between route changes.

In the file name, you can specify where you want to run this. Either global with <name>.global.js. Or with specifying it in definePageMeta.

Authentification example

middleware/auth.global.js

export default defineNuxtRouteMiddleware((to, from) => {
	const isLoggedIn = false;
	console.log (to);
	// To is the destination
	if (isLoggedIn) {
		// redirect to the page we want to go to
		return navigateTo(to.fullPath);
	}
	// redirect to a login page
	return navigateTo('/login')
})