0

I am trying to integrate Active Directory ADAL plugin within my Reactjs app but I am getting error 401 (Unauthorized) when fetching results.

I was following React ADAL package steps till I found a SO question which helped me a lot, but still I am getting a CORS error while fetching Dynamics CRM data.

When I click on the protected route I am redirected to https://login.microsoftonline.com/<someid>/oauth2/authorize?response_type=id_token&client_id=... and then I am redirected back to the page.

This is part of my MyComponent component:

import React, { Component } from 'react';
import { adalApiFetch } from '../../../adalConfig';

class MyComponent extends Component {
    constructor(props) {
        super(props);

        this.state = { APIResponse: '' };
        this.getLeads = this.getLeads.bind(this);
    }

    componentDidMount() {
        this.getLeads();
    }

    getLeads() {
        let result;

        adalApiFetch(fetch, 'https://myorg.api.crm.dynamics/api/', options)
        .then(response => response.json())
        .then(data => {
            this.setState(Object.assign(this.state, { APIResponse: data }));
            console.log(data); 
        }).catch(error => console.error('SERVER ERROR:', error));

    }

    render() {
        return (
            <div>
                <h2>My Component</h2>
            </div>
        );
    }
}

export default MyComponent;

I am getting this 401 (Unauthorized) error on the DevTools:

Server error:

SERVER ERROR: SyntaxError: Unexpected end of JSON input

Edit 1:

This is my adalConfig.js code:

import { AuthenticationContext, adalFetch, withAdalLogin } from 'react-adal';

export const adalConfig = {
    tenant: 'tenantid',
    clientId: 'apiid',
    endpoints: {
        api: 'apiid'
    },
    cacheLocation: 'localStorage',
};

export const authContext = new AuthenticationContext(adalConfig);

export const adalApiFetch = (fetch, url, options) => adalFetch(authContext, adalConfig.endpoints.api, fetch, url, options);

export const withAdalLoginApi = withAdalLogin(authContext, adalConfig.endpoints.api);

Any ideas on what is wrong here? Thanks in advance.

Martin Fernandez
  • 368
  • 5
  • 16

0 Answers0