apollo auth(send token to server)

들어가기
insta-web과 마찬가지로 app에서도 server에 req를 보낼때, token을
같이 보내야 server에서 설정한 loggendInuser에 가로막히지 않는다.
app에서 server쪽으로 req를 보낼때, token을 깉이 보내는 방법을 알아보자.

https://www.apollographql.com/docs/react/networking/authentication/#header

1. apollo.js

import {
  makeVar,
  ApolloClient,
  InMemoryCache,
  createHttpLink,
} from '@apollo/client' ******************************************
import { setContext } from '@apollo/client/link/context'  *****************
import { offsetLimitPagination } from '@apollo/client/utilities'
import AsyncStorage from '@react-native-async-storage/async-storage'

export const isLoggedInVar = makeVar(false)
export const tokenVar = makeVar('')
export const TOKEN = 'token'

export const logUserIn = async (token) => {
  await AsyncStorage.setItem(TOKEN, token)
  isLoggedInVar(true)
  tokenVar(token)
}
export const logUserOut = async () => {
  await AsyncStorage.removeItem(TOKEN)
  isLoggedInVar(false)
  tokenVar(null)
}

///1. httpLink를 만든다.!!(import 빼먹지 말것)
const httpLink = createHttpLink({
  uri: 'http://10.0.2.2:4000/graphql',
})


///2. authLink를 만든다.
///setContext import되는 부분 유의할것.!!!
/// token은 tokenVar를 실행하면 된다.
const authLink = setContext((_, { headers }) => {
  return {
    headers: {
      ...headers,
      token: tokenVar(),
    },
  }
})

export const cache = new InMemoryCache({
  typePolicies: {
    Query: {
      fields: {
        seeFeed: offsetLimitPagination(),
      },
    },
  },
})

///3. link에 authLink.concat으로 httpLink를 묶어줌!!!!
export const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache,
})