Redirect Demonstration
Learn how Astro handles redirects
How Astro Redirects Work
Server-side Redirects (SSR)
Use Astro.redirect() to redirect users before the page renders.
---
// Check authentication
const user = await getUser(Astro.request);
if (!user) {
return Astro.redirect('/login');
}
// Check permissions
if (!user.hasAccess) {
return Astro.redirect('/unauthorized');
}
---
<h1>Protected Content</h1>Configured Redirects (astro.config.mjs)
Set up permanent redirects in your Astro configuration for URL migrations.
// astro.config.mjs
export default defineConfig({
redirects: {
'/old-blog': '/blog',
'/products/[id]': '/shop/[id]',
'/legacy-path': {
status: 301,
destination: '/new-path'
}
}
});Common Redirect Use Cases
Authentication & Authorization
- Redirect unauthenticated users to login
- Redirect after successful login
- Role-based page access control
URL Management
- Legacy URL migrations
- SEO-friendly URL restructuring
- Canonical URL enforcement
Current Request Information
URL:
https://scalable-frontend.pages.dev/apps/router/redirect-demo Query Params:
none Try Custom Redirect
HTTP Redirect Status Codes
Temporary Redirects
302 Found (default)
307 Temporary Redirect
Permanent Redirects
301 Moved Permanently
308 Permanent Redirect