如何使用Axios拦截器与Next-Auth
如何使用Axios拦截器与Next-Auth
提问于 2022-02-20 15:21:23
我正在将我的CRA应用程序转换为Nextjs，并在Nextjs拦截器模式中遇到了一些问题。
它可以工作，但我不得不创建一个Axios实例并将其传递给每个api调用。
有更好的方法吗？
我现在拥有的是：
Profile.js
import { useSession } from 'next-auth/react'
function Profile(props) {
const { data: session } = useSession()
const [user, setUser] = useState()
useEffect(()=> {
const proc= async ()=> {
const user = await getUser(session?.user?.userId)
setUser(user)
}
proc()
},[])
return <div> Hello {user.userName}<div>
}getUser.js
export default async function getUser(userId) {
const axiosInstance = useAxios()
const url = apiBase + `/user/${userId}`
const { data } = await axiosInstance.get(url)
return data
}useAxios.js
import axios from 'axios'
import { useSession } from 'next-auth/react'
const getInstance = (token) => {
const axiosApiInstance = axios.create()
axiosApiInstance.interceptors.request.use(
(config) => {
if (token && !config.url.includes('authenticate')) {
config.headers.common = {
Authorization: `${token}`
}
}
return config
},
(error) => {
Promise.reject(error)
}
)
return axiosApiInstance
}
export default function useAxios() {
const session = useSession()
const token = session?.data?.token?.accessToken
return getInstance(token)
}回答 3
Stack Overflow用户
发布于 2022-02-20 16:05:19
如果其他人有这个问题，我就是这样解决的(使用getSession)：
贷记：https://github.com/nextauthjs/next-auth/discussions/3550#discussioncomment-1993281
import axios from 'axios'
import { getSession } from 'next-auth/react'
const ApiClient = () => {
const instance = axios.create()
instance.interceptors.request.use(async (request) => {
const session = await getSession()
if (session) {
request.headers.common = {
Authorization: `${session.token.accessToken}`
}
}
return request
})
instance.interceptors.response.use(
(response) => {
return response
},
(error) => {
console.log(`error`, error)
}
)
return instance
}
export default ApiClient()Stack Overflow用户
发布于 2022-11-02 18:21:15
实际上，在将用户扩展的详细信息包含到会话对象上有一种简洁的方法。
// /api/[...nextauth].ts
...
callbacks: {
session({ session, user, token }) {
// fetch user profile here. you could utilize contents of token and user
const profile = getUser(user.userId)
// once done above, you can now attach profile to session object
session.profile = profile;
return session;
}
},你可以把它用作：
const { data: session } = useSession()
// Should display profile details not included in session.user
console.log(session.profile)Stack Overflow用户
发布于 2022-10-31 10:12:47
我知道一种方法就是用
const session = await getSession()在不使用getSession()的情况下，还有其他方法可以这样做，因为这样做是在每次运行Axios请求时发出网络请求来获取会话吗？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71195813
复制相关文章
相似问题
腾讯云开发者
