0

I have started learning to code in react native. Have an idea of trying to create an application that (creates / updates / deletes) data from SharePoint lists.

My question is: How do I create a login page associated with Office365 / SharePoint? Want the application to start and check if the user is logged in then retrieve data from SP otherwise log in.

2

From my point, you should start with Azure AD application. Create a new app registration in Azure AD, give it permissions to SharePoint.
Then go ahead with react-native-azure-ad and build an app, which gets access token for SharePoint. With access token, you can easily call SharePoint REST API.

As far as I know, react native also supports OAuth implicit flow. Which means you can try to get an access token using adaljs.

0

Rest calls are not different from web REST calls.

First Import 'react-native-sp-auth' you can use npm install react-native-sp-auth

use the following code for login and pull data from SharePoint.

 myLoginButton =async()=>{
    const sp = new RNSharePointAuth(this.state.siteUrl);
    const { digest, token } = await sp.login(this.state.userName,this.state.password);
    if(token){
      await Alert.alert("Login Successfull");
      fetch(this.state.siteUrl + "/_api/Web/Lists/?$filter=Hidden eq false", {
        method: "GET",
        headers: {
            "Accept": "application/json;odata=verbose",
            "Cookie":token,
            "Content-Type": "application/json"
        }
      })
      .then((y) => y.json())
      .then((y) => { 
        var conStr ="List Names:";
        y.d.results.forEach(function(item){
          conStr += item.Title + ", ";
        })
        this.setState({status:conStr})})
      // await this.setState({status:token});
      // await Alert.alert(digest+ " " +token);
      // await console.log(digest,token)
    }
    // this.setState({status:"Livingston"});
  }

I used the following code in render()

<TouchableOpacity style={{ borderBottomWidth: 1, borderBottomColor: '#282828' }}
                onPress={() =>this.myLoginButton()} 
                >
              <Text style={{
                  color: '#282828',
                  fontSize: 14
              }}>
                Login
              </Text>
            </TouchableOpacity>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.