hungdev / react-native-instagram-login

a react native instagram login component (support android & ios). Pull requests are welcome!
https://www.npmjs.com/package/react-native-instagram-login
184 stars 103 forks source link

I cannot change Instagram Login account after login #37

Closed turtlebe closed 5 years ago

turtlebe commented 5 years ago

Hi, Thank you for your effort with this package. It helped me much with my work for instagram login. But I have found an issue on webview. The webview in the modal works fine at the first login. But after login successfully, if I try to use another account to login, webview doesn't show the Instagram Login page. So I cannot change to another account. As I checked the code there was a code block to change key which is responsible for refreshing webview. But it doesn't work properly. This is the code. ... .... ... const { url } = webViewState const { key } = this.state if (webViewState.title === 'Instagram' && webViewState.url === 'https://www.instagram.com/') { this.setState({ key: key + 1 }) } ... ... ... I think the issue is related to title and webViewState.url. As I checked the title and url when load instagram page, the title was 'Login Instagram' and the url was "https://api.instagram.com/oauth/authorize/?client_id=XXXXX&redirect_uri=XXXXX&response_type=token". So the key hadn't changed. I hope you please check the code and if this is a bug, please fix asap. Thank you and regards. insta1 insta2

hungdev commented 5 years ago

@jinguohao1991 To login with another account, you must clear cookies before login another account. Please read: https://github.com/hungdev/react-native-instagram-login#logout

hungdev commented 5 years ago

@jinguohao1991 Feel free to let me know if you cant resolve your problem.

turtlebe commented 5 years ago

Thank you for your reply. I have still the same issue. I have installed "react-native-cookies": "^3.3.0", and linked to iOS manually. This is my code for opening Instagram Login modal

const onInstaLoginClick = () => { CookieManager.clearAll().then(() => { this.setState({ token: null }) }); this.instagramLogin.show(); };

The instagram still logs in with previous Account automatically. So I cannot use another account.

turtlebe commented 5 years ago

I have tried your example with your video. Here is my recorded video. https://www.youtube.com/watch?v=6W-RVOUFLqE&feature=youtu.be Thank you.

IcebergRage commented 5 years ago

Hello, I have the same issue. Do you have any solution ?

IcebergRage commented 5 years ago

I found : Add this in Webview

cacheEnabled={false}
incognito={true}
thirdPartyCookiesEnabled={false}
sharedCookiesEnabled={false}
domStorageEnabled={false}

I will do a PR soon

turtlebe commented 5 years ago

Hi, @IcebergRage. Thank you. If I test with https://github.com/hungdev/react-native-instagram-login/tree/master/Example, where to put this code? Inside this package directly or inside my code? Hope your update.

hungdev commented 5 years ago

@jinguohao1991 @IcebergRage I know the reason. Due to the cookies library is not working and I'm trying to find a way to help you. read more: https://github.com/joeferraro/react-native-cookies/issues/78 https://github.com/joeferraro/react-native-cookies/issues/127 currently, temporary solution is disable cookies, but in some cases when logging back, we need to keep cookies, and users don't need to log in again. So i still recommend persist cookies and clear cookies when logout. We can try with another library manage cookies. @jinguohao1991 here is code for you:

        <InstagramLogin
          ref={ref => this.instagramRef = ref}
          clientId='************'
          redirectUrl='************'
          scopes={['basic']}
          onLoginSuccess={(token) => this.setState({ token })}
          onLoginFailure={(data) => this.setState({ failure: data })}
          cacheEnabled={false}
          incognito={true}
          thirdPartyCookiesEnabled={false}
          sharedCookiesEnabled={false}
          domStorageEnabled={false}
        />
turtlebe commented 5 years ago

@jinguohao1991 @IcebergRage I know the reason. Due to the cookies library is not working and I'm trying to find a way to help you. read more: joeferraro/react-native-cookies#78 joeferraro/react-native-cookies#127 currently, temporary solution is disable cookies, but in some cases when logging back, we need to keep cookies, and users don't need to log in again. So i still recommend persist cookies and clear cookies when logout. We can try with another library manage cookies. @jinguohao1991 here is code for you:

        <InstagramLogin
          ref={ref => this.instagramRef = ref}
          clientId='************'
          redirectUrl='************'
          scopes={['basic']}
          onLoginSuccess={(token) => this.setState({ token })}
          onLoginFailure={(data) => this.setState({ failure: data })}
          cacheEnabled={false}
          incognito={true}
          thirdPartyCookiesEnabled={false}
          sharedCookiesEnabled={false}
          domStorageEnabled={false}
        />

This works perfectly for me. <InstagramLogin ref={ref => this.instagramRef = ref} clientId='****' redirectUrl='****' scopes={['basic']} onLoginSuccess={(token) => this.setState({ token })} onLoginFailure={(data) => this.setState({ failure: data })} cacheEnabled={false} useWebKit={true} sharedCookiesEnabled={true} />