Apollo-client: null is not an object (evaluating 'blob.data')

Created on 18 Apr 2019  ·  5Comments  ·  Source: apollographql/apollo-client

Intended outcome:

`import {ApolloClient} from 'apollo-client'
import {InMemoryCache} from 'apollo-cache-inmemory'
import {RestLink} from 'apollo-link-rest'
import {AUTH_TOKEN, ENDPOINT_URL, REFRESH_TOKEN, VALIDATION_COMPLETE} from '../../appConstants'
import {from} from 'apollo-link'
import {setContext} from 'apollo-link-context'
import {AsyncStorage} from 'react-native'
import ApolloLinkTimeout from 'apollo-link-timeout'
import {FetchPolicy} from 'apollo-client/core/watchQueryOptions'
import ErrorHandler, {onError} from 'apollo-link-error'
import {runRefreshToken} from './login'
import {promiseToObservable} from './promiseToObservable'
import {replace} from '../../NavigationService'
import i18n from 'i18n-js'

const timeoutLink = new ApolloLinkTimeout(30000) // 30 second timeout

const authMiddleware = setContext(async (_, {headers}) => {
const token = await AsyncStorage.getItem(AUTH_TOKEN)
return {
headers: {
...headers,
authorization: token ? Bearer ${token} : ''
},
}
})

const restLink = new RestLink({
uri: ENDPOINT_URL,
headers: {
'accept': 'application/json',
}
})

const networkErrorLink = onError((errorResponse: ErrorHandler.ErrorResponse) => {
const {
networkError,
forward,
operation
} = errorResponse

if ('statusCode' in networkError && 'response' in networkError) {
    const {
        statusCode,
        response: {
            url
        }
    } = networkError
    if (url.includes('token/refresh')) {
        AsyncStorage.multiRemove([AUTH_TOKEN, REFRESH_TOKEN, VALIDATION_COMPLETE])
            .then(() => apolloClient.resetStore())
            .then(() => replace('SignIn'))
            .catch()
    } else if (statusCode && statusCode === 401) {
        return promiseToObservable(AsyncStorage.getItem(REFRESH_TOKEN)
            .then(refreshToken => runRefreshToken(refreshToken))
            .then(response => {
                const {
                    data: {
                        refreshToken: {
                            access
                        }
                    }
                } = response
                return AsyncStorage.setItem(AUTH_TOKEN, access)
            })
            .then(() => AsyncStorage.getItem(AUTH_TOKEN))
            .then(authToken => {
                const oldHeaders = operation.getContext().headers
                operation.setContext({
                    headers: {
                        ...oldHeaders,
                        authorization: authToken
                    }
                })
            })
            .catch())
            .flatMap(() => forward(operation))
    } else if (statusCode && statusCode >= 400 && statusCode < 600) {
        return promiseToObservable( Promise.reject({message: i18n.t('ERROR_500')}))
    }
}
return forward(operation)

})

const timeoutHttpLink = timeoutLink.concat(restLink)

export const apolloClient = new ApolloClient({
link: from([networkErrorLink, authMiddleware, timeoutHttpLink]),
cache: new InMemoryCache(),
defaultOptions: {
watchQuery: {
fetchPolicy: 'network-only',
errorPolicy: 'ignore',
},
query: {
fetchPolicy: 'network-only',
errorPolicy: 'all',
},
mutate: {
errorPolicy: 'all'
}
},
connectToDevTools: false
})

export function runQuery(query: string, variables: any = null, fetchPolicy: FetchPolicy = 'network-only') {

return (apolloClient.query({
        query: query,
        variables: variables,
        fetchPolicy: fetchPolicy
    }).then(response => {
        if (__DEV__) {
            console.log(response.data)
        }
        apolloClient.cache.writeData({data: response.data})
        return Promise.resolve(response)
    }).catch((error) => {
        if (__DEV__) {
            console.log(error)
        }
        return Promise.reject(error)
    })
)

}
`

Actual outcome:

Hi Apollo team! We use the 'react-apollo' library in our react-native project. iOS works well but on Android if there isn't any network connection and we try to run some query or mutation we get this error. This issue reproduces on Android 8 and Android 9.
https://ibb.co/1rXgrn7

How to reproduce the issue:

If there isn't any network connection on Android this error happens.

Versions

System:
OS: macOS Mojave 10.14.4
Binaries:
Node: 8.12.0 - /usr/local/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Browsers:
Chrome: 73.0.3683.103
Safari: 12.1
npmPackages:
apollo-boost: ^0.3.1 => 0.3.1
apollo-link-context: ^1.0.17 => 1.0.17
apollo-link-rest: ^0.7.2 => 0.7.2
apollo-link-timeout: ^1.2.1 => 1.2.1
react-apollo: ^2.5.4 => 2.5.4

Most helpful comment

Still no solutions and reasons why that's happening?

All 5 comments

any updates???

Still no solutions and reasons why that's happening?

Are you using reactotron? Maybe see this. https://github.com/infinitered/reactotron/issues/786

react native version: 0.59.9; apollo-*: latest version!

The error still exists!

I'm using react-native 0.59.10 and just updated my reactotron-react-native to the latest version (3.6.4 right now) and solved the issue.

Was this page helpful?
0 / 5 - 0 ratings