Auth0 Home Blog Docs

Access_token issued for my mobile (React Native) app is not accepted by API



I have an ASP.NET Core 2.2 API, a web app built in React and now building a React Native mobile app.

Everything is working nicely on the web app. I’m also able to obtain an access_token and an id_token from the React Native mobile app but when I call the API using the access_token obtained, my API is rejecting it with 401 error.

Is there anything special I need to configure on Auth0 portal for my mobile app to work? In addition to my web app, I created a separate mobile app on the portal and I’m using its clientId to make my calls. As I said, I’m able to call Auth0 and obtain my tokens just fine but my API is not accepting the access_token.

I simply followed the article here for React Native but here’s what my code looks like in my mobile app:

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Button } from 'react-native';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import Auth0 from 'react-native-auth0';
import jwt_decode from 'jwt-decode';

// Actions
import * as myActions from '../../actions/my-actions';

// Utils
import { saveAccessToken } from '../../utils/authentication/authentication-utils';

const auth0 = new Auth0({ domain: '', clientId: 'client_id_assigned_to_my_mobile_app' });

class Login extends Component {

    constructor(props) {

        this._onLogin = this._onLogin.bind(this);
        this._onLogout = this._onLogout.bind(this);

    _onLogin = () => {
                scope: 'openid profile',
                audience: 'identifier_for_my_api'
            .then(credentials => {
                // Store access token

                // Set authenticated user indicator
                // Decode the id JWT token
                const decoded = jwt_decode(credentials.idToken);
            .catch(error => console.log(error));

    _onLogout = () => {

        if (Platform.OS === 'android') {
            // Remove token
        } else {
            .then(success => {
                // Remove token
            .catch(error => console.log(error));
    render() {
        return (
            <View style={styles.container}>
                <Text>Let's log you in...</Text>
                <Button onPress={this._onLogin} title="Log In" />

function mapStateToProps(state) {
    return {

function mapDispatchToProps(dispatch) {
    return {
        actions: bindActionCreators(myActions, dispatch)

export default connect(mapStateToProps, mapDispatchToProps)(Login);

const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#F5FCFF'
    header: {
      fontSize: 20,
      textAlign: 'center',
      margin: 10


Hi @imsam67

That code snippet looks fine.

There can be a couple of reasons why your API is rejecting your requests:

  1. check that you are sending the access_token correctly, this is dependant on how the API is built but the standard is to send the access_token in the Authorization header with the bearer format (e.g. Authorization: Bearer <access_token>)
  2. check that your API is correctly validating the access_token (e.g. if using the standard Authorization header method, make sure to strip out the Bearer portion of the header)