我正在构建一个用户可以登录的应用程序，我希望用户能够连接其他帐户并能够使用它们登录，我已经使用 https://www.npmjs.com/package/react-native-fbsdk-next 到目前为止一切顺利，对于谷歌我想我会处理它，但我需要使用 instagram 来完成。
长话短说，谁能告诉我如何让我的用户能够使用 instagram 登录。先感谢您。
回答1
您可以使用为此目的开发的 https://www.npmjs.com/package/react-native-instagram-login。请注意，您需要先https://developers.facebook.com/docs/instagram-basic-display-api/getting-started，才能使用此功能。
维护人员制作了一个简短的https://developers.facebook.com/docs/instagram-basic-display-api/getting-started。
总而言之，https://github.com/hungdev/react-native-instagram-login/blob/master/Example/App.js，为了完整起见，我将其包含在此处。
import React, { Component } from 'react';
import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
import InstagramLogin from 'react-native-instagram-login';
import CookieManager from '@react-native-community/cookies';
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
token: '',
};
}
setIgToken = (data) => {
this.setState({ token: data })
}
onClear() {
CookieManager.clearAll(true)
.then((res) => {
this.setState({ token: null })
});
}
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<TouchableOpacity
style={styles.btn}
onPress={() => this.instagramLogin.show()}>
<Text style={{ color: 'white', textAlign: 'center' }}>Login now</Text>
</TouchableOpacity>
<TouchableOpacity
style={[styles.btn, { marginTop: 10, backgroundColor: 'green' }]}
onPress={() => this.onClear()}>
<Text style={{ color: 'white', textAlign: 'center' }}>Logout</Text>
</TouchableOpacity>
<Text style={{ margin: 10 }}>Token: {this.state.token}</Text>
{this.state.failure && (
<View>
<Text style={{ margin: 10 }}>
failure: {JSON.stringify(this.state.failure)}
</Text>
</View>
)}
<InstagramLogin
ref={ref => (this.instagramLogin = ref)}
appId='your-app-id'
appSecret='your-app-secret'
redirectUrl='your-redirect-Url'
scopes={['user_profile', 'user_media']}
onLoginSuccess={this.setIgToken}
onLoginFailure={(data) => console.log(data)}
/>
</View>
);
}
}
const styles = StyleSheet.create({
btn: {
borderRadius: 5,
backgroundColor: 'orange',
height: 30,
width: 100,
justifyContent: 'center',
alignItems: 'center',
}
});