\n```\n\n**Server middleware:**\n```typescript\n// server/middleware/auth.ts\nexport default defineEventHandler((event) => {\n const auth = getHeader(event, \"authorization\")\n if (!auth) throw createError({ statusCode: 401 })\n})\n```\n\n**Key:** Nuxt for Vue SSR."}}]}

Vue.js: How do you implement server-side rendering?

🟢Vue.js⚡ middle

How do you implement server-side rendering?

Nuxt 3 — Vue SSR framework.

Setup:

bash

1npx nuxi init my-app
2cd my-app
3npm run dev

Data fetching:

vue

1<script setup>
2const { data } = await useFetch("/api/users")
3const { data } = await useAsyncData("users", () => $fetch("/api/users"))
4</script>

Server middleware:

typescript

1// server/middleware/auth.ts
2export default defineEventHandler((event) => {
3  const auth = getHeader(event, "authorization")
4  if (!auth) throw createError({ statusCode: 401 })
5})

Key: Nuxt for Vue SSR.

Больше вопросов по Vue.js

What is the difference between v-slot and slot props?What is the difference between computed and methods?

Назад к категории Vue.js