Интегрировать Javascript-код ActiveDirectory в React

Question

У меня есть этот код Javascript для обработки аутентификации ActiveDirectory.Мне нужно создать компонент React, который использует этот код, каков наилучший способ добиться этого в React?

var config = { url: 'ldap://compandomain.com:389',
           baseDN: 'dc=domainname,dc=com',
           username: 'user',
           password: 'pass' };

var ad = new ActiveDirectory(config);
var username = 'john.smith@domain.com';
var password = 'password';

ad.authenticate(username, password, function(err, auth) {
  if (err) {
    console.log('ERROR: '+JSON.stringify(err));
    return;
  }

  if (auth) {
    console.log('Authenticated!');
  }
  else {
    console.log('Authentication failed!');
  }
});

Компонент React выглядит следующим образом:

export default class ActiveDirectory extends React.Component {

  ..
  ......
  .........

  render() {
    return <div ..../>;
  }
}

Answer 1

вы должны иметь возможность обрабатывать эту аутентификацию в методе жизненного цикла componentDidMount.Вероятно, это должно выглядеть так.

import React from 'react';
import ActiveDirectory from 'activedirectory';

export default class ActiveDirectoryComponent extends React.Component {
  state = {
    authResponse: undefined
  };

  componentDidMount() {
    var config = {
      url: 'ldap://compandomain.com:389',
      baseDN: 'dc=domainname,dc=com',
      username: 'user',
      password: 'pass'
    };

    var ad = new ActiveDirectory(config);
    var username = 'john.smith@domain.com';
    var password = 'password';

    ad.authenticate(username, password, function (err, auth) {
      if (err) {
        this.setState({ authResponse: { error: JSON.stringify(err) } });
        return;
      }

      if (auth) {
        this.setState({ authResponse: auth });
      } else {
        console.log('Authentication failed!');
        this.setState({ authResponse: { authFailed: true } });
      }
    });
  }

  render() {
    if (!this.state.authResponse) {
      return <div>Authenticating....</div>;
    }
    if (this.state.authResponse.error) {
      return <div>{this.state.authResponse.error}</div>
    }
    if (this.state.authResponse.authFailed) {
      return <div>Authentication Failed</div>
    }
    return <div>.....</div>
  }
}