How can i get the response headers on the client side?
liulib opened this issue · comments
Environment
Nuxt project info: 12:35:52
- Operating System:
Windows_NT - Node Version:
v16.17.1 - Nuxt Version:
3.0.0 - Nitro Version:
1.0.0 - Package Manager:
npm@8.15.0 - Builder:
vite - User Config:
experimental,app,modules,intlify,css,unocss,build - Runtime Modules:
@pinia/nuxt@0.4.3,@intlify/nuxt3@0.2.4,@unocss/nuxt@0.46.5 - Build Modules:
-
Reproduction
https://stackblitz.com/edit/nuxt-starter-zvb66h?file=pages/index.vue
Describe the bug
hey, sorry for the trouble. I'm new guy to the SSR.
I have tried both of these ways.
first :
in this way,headers awalys be empty object
client vue file
// not work
const url = 'http://www.vvvv.plus/api/article/getTopicList';
const res = await $fetch.raw(url, {
method: 'get',
});
// how can i get headers here ?
console.log(res.headers);
second
i can get headers in the server side, but i don't know how to pass it to the client side.
I have check those discussions, but i can't find the answer.
this doc just dispeared https://github.com/nuxt/framework/discussions/1062
this doc is so simple,i don't konw how to use it https://nuxt.com/docs/api/composables/use-request-headers#userequestheaders
server side ts file
export default defineEventHandler(async (event) => {
const response: any = await $fetch.raw(
'http://www.vvvv.plus/api/article/getTopicList',
{
method: 'get',
}
);
// we can get headers here
console.log(response.headers);
return response._data;
});
client vue file
const url = '/api/test';
const res = await useFetch(url);
// but here is empty
console.log(res.headers);
Additional context
No response
Logs
No response
