Разрыв Аполлона при попытке добавить заголовки в ApolloClient - PullRequest
0 голосов
/ 08 января 2020

Я пытаюсь добавить auth token к каждому запросу Apollo, но я получаю следующую ошибку при попытке запустить мой проект. Я следовал рекомендуемой реализации здесь Apollo Auth . Я использую React, @ apollo / client "^ 3.0.0-beta.19", "@ apollo /act-hooks": "^ 3.1.3":

TypeError: Object(...) is not a functionindex_bundle.js line 902 > eval:52:77
    Policies webpack:///./node_modules/@apollo/client/cache/inmemory/policies.js?:52
    InMemoryCache webpack:///./node_modules/@apollo/client/cache/inmemory/inMemoryCache.js?:39
    <anonymous> webpack:///./src/index.js?:59
    js http://localhost:8080/index_bundle.js:6113
    __webpack_require__ http://localhost:8080/index_bundle.js:727
    fn http://localhost:8080/index_bundle.js:101
    <anonymous> webpack:///multi_(webpack)-dev-server/client?:3
    0 http://localhost:8080/index_bundle.js:6815
    __webpack_require__ http://localhost:8080/index_bundle.js:727
    <anonymous> http://localhost:8080/index_bundle.js:794
    <anonymous> http://localhost:8080/index_bundle.js:797

My index.js ( root моего проекта) здесь:

import React from 'react'
import ReactDOM from 'react-dom'
import 'bootstrap/dist/css/bootstrap.min.css'
import { BrowserRouter } from 'react-router-dom'
import Switch from './config/switch'
import { createBrowserHistory } from "history"
import { library } from '@fortawesome/fontawesome-svg-core'
import { fab } from '@fortawesome/free-brands-svg-icons'
import { faCheckSquare, faCoffee, faPhoneAlt, faChevronLeft, faChevronRight, faCaretDown, faCaretUp, faShare, faGripLines, faLock, faSave, faTimesCircle, faCalendar, faDivide, faShoppingCart, faMapPin, faFax, faSearch} from '@fortawesome/free-solid-svg-icons'
import { faFacebookF, faLinkedinIn, faTwitter, faYoutube } from '@fortawesome/free-brands-svg-icons' 
import { ApolloProvider } from '@apollo/react-hooks'
import { ApolloClient, createHttpLink, InMemoryCache } from '@apollo/client'
import { setContext } from 'apollo-link-context'
import ContextProvider from './config/provider'
import 'index.css'

library.add(fab, faCheckSquare, faCoffee, faPhoneAlt, faChevronLeft, faChevronRight, faCaretDown, faCaretUp, faShare, faGripLines, faLock, faSave, faTimesCircle, faCalendar, faDivide, faShoppingCart, faFacebookF, faLinkedinIn, faTwitter, faYoutube, faMapPin, faFax, faSearch)

const customHistory = createBrowserHistory()

const httpLink = createHttpLink({
  uri: `${process.env.API_URL}/graphql`
})

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

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

ReactDOM.render(
  <ApolloProvider client={client}>
    <ContextProvider>
      <BrowserRouter history={customHistory}>
        <Switch />
      </BrowserRouter>
    </ContextProvider>
  </ApolloProvider>
  , document.getElementById('index')
)
...