nuxt跨域请求其他api

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({devtools: { enabled: true },css: [//共享css处理,不是重点可以看看,@:是当前文件根目录'@/assets/css/global.css'],//跨域处理nitro: {devProxy: {'/go1-api':{target: 'http://localhost:8088', //跨域处理的ip地址prependPath:true,changeOrigin:true //origin: 跨域处理关键}}}
})

fetch处理

import {ref,reactive,onMounted} from "vue"
const goData1 =ref()
//fetch处理
fetch('/go1-api').then(async res=>{return res.json()
}).then(async data => goData1.value = await data[0].message)
.catch(err=>console.log(err.message))

nuxt设置标头

useHead({title: ""
})

nuxt使用usFetch()请求自己的server中的api

//server/api/index.ts
export default defineEventHandler((event)=>{return {status: 200,message: "this is nuxt3 api"}
})

<script setup>
import {ref,reactive,onMounted} from "vue"const myServerMsg1 = ref()
const {data} = await useFetch('/api') //data.value中才是数据
myServerMsg1.value = await data.value.message</script>
<template><div>{{ myServerMsg1 }}</div>
</template><style scoped>
</style>