React Native GraphQL查询头中的变量在第一次渲染时未设置

92dk7w1h  于 2023-10-22  发布在  React
关注(0)|答案(1)|浏览(113)

我在react native项目中使用graphQL。我在查询的上下文对象中传递头(cookie/authorization),在useMutationuseQuery中。[Problem is only on iOS App]
应用程序的基本系统是用户注册配置文件,并在初始注册时验证属性finishedAccountSetup: false是否为false。因此,当他们第一次登录时,活动导航堆栈是设置导航堆栈。当他们填写信息时,它称为updateuser突变。这种变化要求头部传入查询。因此,一旦用户到达最后一个屏幕来设置并提交信息,即使jwt不是未定义的,也不会传递jwt的突变,似乎是未定义的。jwt是从redux store中获取的,也试图作为导航参数传递,我猜如果在render useMutation的最开始发现jwt是未定义的,当它没有完成从store中获取时。但是通过参数传递它应该在一开始就在那里。但它在那里也不起作用。
第二种情况是,如果帐户被标记为从数据库设置并首次尝试登录,当用户成功登录导航堆栈时,将更改为主导航堆栈,用户重定向到主页。其中有useQuery突变,jwt以相同的方式传递。但是jwt一旦登录就不会通过。但如果我杀死应用程序的会话,并重新打开应用程序,它的工作正常。它传递jwt和查询返回结果。一旦应用程序被杀死并重新打开查询,jwt就可以在所有屏幕上工作。但是在登录并进入主屏幕后的第一次,即使变量没有未定义,它也没有传递jwt
问题是只能在iOS设备上看到而不是在Android上。它在Android上运行良好。
使用突变:变量jwt在第一次渲染时从未定义,尝试使用console.log(jwt)检查此变量

const { jwt, pushToken } = useSelector((state: RootState) => state.auth);

  const [updateUser, updateUserData] = useMutation(UPDATE_USER_MUTATION, {
     context: {
       headers: {
         cookie: `jwt=${jwt}`,
         authorization: jwt ? `Bearer ${jwt}` : '',
       },
     },
  });

useQuery:在主页中使用此查询,当用户第一次从iOS设备登录时,jwt不会传递到标头。变量jwt在第一次渲染时从未被定义,尝试用console.log(jwt)检查。但是,如果用户杀死应用程序会话并重新打开应用程序,那么查询就可以完美地工作。但是,当登录导航状态时,更改并转移到主堆栈导航器,并且在第一次呈现时,即使jwt没有未定义,它也不会作为头传递。

const { jwt, user, pushToken } = useSelector(
    (state: RootState) => state.auth
  );

  const {
    data: my_info,
    error: my_infoError,
    loading: my_infoLoading,
    refetch: my_infoRefetch,
  } = useQuery(GET_ME, {
        context: {
           headers: {
              cookie: `jwt=${jwt}`,
              authorization: jwt ? `Bearer ${jwt}` : '',
            },
        },
  });

可能的原因是什么?有没有办法在几秒钟后注册useQueryuseMutation的第一次渲染?我尝试了refetch查询几秒钟后使用useEffect,但不工作。
我现在不确定,当查询被react引擎注册时,它发现jwt是未定义的?或者不设置context对象。有没有办法找出这个问题,或者有没有解决办法?
谢谢你

webghufk

webghufk1#

我使用下面的脚本和app.js文件,并获得了jwt使用console.log()在服务器端的日志。发现,这是设置jwt两次在ios像'jwt="jwt_value",jwt="jwt_value"',而在android它只有一个'jwt="jwt_value"',所以我只是使用基本的JavaScript来解决这个问题,.split('jwt=').pop()获得最后的jwt令牌。现在它工作得很好。

import fs from 'fs';
 import util from 'util';

 const log_file = fs.createWriteStream(__dirname + '/debug.log', {
   flags: 'w',
 });
 const log_stdout = process.stdout;
 const log_stderr = process.stderr;

 console.log = function (d: any) {
     log_file.write(util.format(d) + '\n');
     log_stdout.write(util.format(d) + '\n');
     log_stderr.write(util.format(d) + '\n');
 };

 const access = fs.createWriteStream(__dirname + '/stdout.log', {
   flags: 'w',
 });
 process.stdout.write = process.stderr.write = access.write.bind(access);

 process.on('uncaughtException', function (err) {
    console.error(err && err.stack ? err.stack : err);
 });

这是在服务器端记录错误的代码.谢谢

相关问题