在哪里设置Sentry的setUser在Next.js应用程序？
提问于 2022-03-31 13:17:42
我一直在尝试将用户数据设置到Sentry的全局范围内，因此每次出现错误或事件时，用户信息都会传递给它。
我的应用程序是用Next.js构建的，所以我很自然地添加了配置，就像在Sentry的Next.js文档中一样。
我还不知道在哪里添加Sentry.setUser({id: user.Id})方法才能在全局范围内设置用户。
到目前为止，我已经将它添加到Sentry的_error.js文件中，在getInitialProps方法中：
import NextErrorComponent from 'next/error';
import * as Sentry from '@sentry/nextjs';
import { getUser } from '../lib/session';
const MyError = ({ statusCode, hasGetInitialPropsRun, err }) => {
if (!hasGetInitialPropsRun && err) {
Sentry.captureException(err);
}
return <NextErrorComponent statusCode={statusCode} />;
};
MyError.getInitialProps = async (context) => {
const errorInitialProps = await NextErrorComponent.getInitialProps(context);
const { req, res, err, asPath } = context;
errorInitialProps.hasGetInitialPropsRun = true;
const user = await getUser(req, res);
// Set user information
if (user) {
console.log('Setting user');
Sentry.setUser({ id: user.Id });
}
else {
console.log('Removing user');
Sentry.configureScope(scope => scope.setUser(null));
}
if (res?.statusCode === 404) {
return errorInitialProps;
}
if (err) {
Sentry.captureException(err);
await Sentry.flush(2000);
return errorInitialProps;
}
Sentry.captureException(
new Error(`_error.js getInitialProps missing data at path: ${asPath}`),
);
await Sentry.flush(2000);
return errorInitialProps;
};
export default MyError;但是，当尝试记录错误时，用户信息不会显示在Sentry中，只有默认的用户ip：
我也尝试过在成功登录后设置用户，但仍然没有..
我们很感谢你的帮助！！
回答 3
Stack Overflow用户
回答已采纳
发布于 2022-08-12 15:41:28
不确定这是否是正确的方法，但上述解决方案对我无效。所以我试着在_app.tsx里面打电话给_app.tsx。
import { useEffect } from "react";
import { setUser } from "@sentry/nextjs";
import { UserProvider, useUser } from "@auth0/nextjs-auth0";
import type { AppProps } from "next/app";
function SentryUserManager() {
const { user } = useUser();
useEffect(() => {
if (user) {
setUser({
email: user.email ?? undefined,
username: user.name ?? undefined,
});
} else {
setUser(null);
}
}, [user]);
return null;
}
export default function MyApp({ Component, pageProps }: AppProps) {
return (
<UserProvider>
<Component {...pageProps} />
<SentryUserManager />
</UserProvider>
);
}仍然不知道为什么这对我和其他解决方案无效，但认为这是值得分享的。
Stack Overflow用户
发布于 2022-04-11 17:25:45
我建议使用回调处理程序来设置Sentry用户上下文。
import { handleAuth, handleLogin, handleCallback } from "@auth0/nextjs-auth0";
import * as Sentry from "@sentry/nextjs";
import { NextApiHandler } from "next";
const afterCallback = (_req, _res, session, _state) => {
Sentry.setUser({
id: session.user.sub,
email: session.user.email,
username: session.user.nickname,
name: session.user.name,
avatar: session.user.picture,
});
return session;
};
const handler: NextApiHandler = handleAuth({
async login(req, res) {
await handleLogin(req, res, {
returnTo: "/dashboard",
});
},
async callback(req, res) {
try {
await handleCallback(req, res, { afterCallback });
} catch (error) {
res.status(error.status || 500).end(error.message);
}
},
});
export default Sentry.withSentry(handler);Stack Overflow用户
发布于 2022-04-01 03:07:30
您可以在成功登录后立即在Sentry中设置用户
const handleLogin = {
try {
const res = await axios.post("/login", {"john@example.com", "password"})
if (res && res?.data) {
// Do other stuff
Sentry.setUser({ email: "john@example.com" });
}
}
}此外，您还可以在注销时清除用户。
const handleLogout = {
// Do othe stuff
Sentry.configureScope(scope => scope.setUser(null));
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71699244
复制相关文章
腾讯云开发者
