我有一个身份验证流程react-native / apollo / graphql,我需要将令牌保存到graphql Bearer的setContext Apollo中。 Apollo客户端从头开始初始化,并且用户仅在身份验证屏幕后才获得令牌。这意味着我将在验证用户身份后初始化一个新的Apollo客户端。为此,我需要在App根组件中使中间件起作用,该组件将在用户获得令牌时启动。为此,我需要向中间件发送信号。您能否告诉我,这是在App中使用钩子const [token,setToken] = useState(false)创建状态并将其像道具一样发送到链条的好方法。当用户获得令牌=>令牌(true)=> getTokensMiddleware(令牌)=> setContext(令牌)
import React, { useState } from 'react'
import { ApolloProvider } from 'react-apollo'
import { ApolloProvider as ApolloHooksProvider } from 'react-apollo-hooks'
import { ApolloClient } from 'apollo-client'
import { ApolloLink } from 'apollo-link'
import { createHttpLink } from 'apollo-link-http'
import { setContext } from 'apollo-link-context'
import { InMemoryCache } from 'apollo-cache-inmemory'
import * as Keychain from 'react-native-keychain'
import AppNavigator from './AppNavigator'
const httpLink = createHttpLink({
uri: 'http://localhost:4000'
})
const authLink = setContext(async (req, { headers, ...context }) => {
console.log('context', context)
const tokens = await Keychain.getGenericPassword()
console.log('tokensSetContext', tokens)
const accessToken = tokens.username
console.log('accessTokenSetContext', accessToken)
return {
headers: {
...headers,
authorization: accessToken ? `Bearer ${accessToken}` : ''
},
...context
}
})
const client = new ApolloClient({
link: ApolloLink.from([authLink, httpLink]),
cache: new InMemoryCache(),
connectToDevTools: true
})
const App = () => {
const [tokens, setTokens] = useState(false)
return (
<ApolloProvider client={client}>
<ApolloHooksProvider client={client}>
<AppNavigator />
</ApolloHooksProvider>
</ApolloProvider>
)
}
export default App