Question

我是React Native的新手。请宽容。因此，我正在研究React Native身份验证模块。这是我的代码逐步执行的操作。您不能告诉我如何在标头中传递令牌。

步骤1：登录表单>文本输入，用户插入“电子邮件”和“密码”

步骤2：由于以下Apollo查询，我在{data.login}中获得了令牌存储

query LogIn($email: String!,$password: String!) {
      login(email: $email, password: $password) 
}

// This gave me this output:
  "data": {
"login": TOKEN
}

第3步：如何将{data.login}存储在localStorage中？我应该在哪里使用：localStorage（'key'，{data.login}）？我只能显示它

<Query pollInterval={500} query={GET_Session} variables={{ email: this.state.email, password: this.state.password }}  >
          {({ loading, error, data }) => {
              if (loading) return(<View style={styles.activity}>
                <ActivityIndicator size="large" color="#0000ff" />
               </View>);
              if (error) return(<Text>`Error! ${error.message}`</Text>);
              return (<View >
                        <Text > {data.login} </Text>
                      </View>

第4步：我的客户：这就是为什么我要将此data.login存储在localStorage变量中的原因

const httpLink = createHttpLink({
  uri: 'http://APP.com/graphql',
});

const authLink = setContext((_, { headers }) => {
  // get the authentication token from local storage if it exists
  const token = localStorage.getItem('key');
  // return the headers to the context so httpLink can read them
  return {
    headers: {
      ...headers,
      authorization: token ? `Bearer ${token}` : "",
    }
  }
});

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache()
});

如何在授权标头中传递令牌React Native应用和GraphQL

0 个答案: