I implemented Instagram Login using Basic Display API. Everything works fine if the user enters their Instagram credentials in the web view that comes up on loading https://api.instagram.com/oauth/authorize request. After that I can pull the user’s media from the Instagram account. It tells me that everything is implemented properly.
Now, if user choses the "Log in with Facebook" option in the WebView and goes through the Facebook login flow, everything still works fine when I run it on a simulator: after Facebook finishes its login flow with 2 factor authentication I eventually get the redirect callback, parse the code form it and all the rest works as normal.
But the same fails on a physical device. After I call https://api.instagram.com/oauth/access_token to get the token with the obtained code the Instagram app launches momentarily and then opens Safari with this error:
{"message":"Logged-in use not
supported","status":"fail"}
What gives? This is incredibly frustrating, one day was wasted and not sure where to go from here. Any ideas?
UPDATE:
The reason it behaves differently on the device is because it has Instagram app installed and the app gets launched when Facebook calls https://www.instagram.com/accounts/signup/... endpoint to return to the Instagram auth flow (I am watching the requests coming through the WkWebView). Instagram app throws that error above, while on the simulator the end point seems to be serviced fine by the Instagram backend and the flow continues as it should.
So the question is how to get the Instagram app out of the loop.
UPDATE2:
Confirmed – once I deleted the Instagram app from the device it works as expected. Once I install it back it gets launched again during the authentication flow by Facebook and the problem is back. This seems to be a bug in the Instagram app, I have no other explanation.
3
Answers
OK, so after lots of dead ends and obscure rabbit holes I was frantically going down, I have concluded that the real issue is the bug in the Instagram App. As noted in the update to my question the flow started to work fine after I removed the Instagram.
Still not ready to jump to conclusions I tried a few other apps from the Appstore that have Connect to Instagram feature. All of them fail exactly the same way. Specifically if you choose "Continue with Facebook" on the Instagram login WebView you eventually end up launching Instagram app (if it's installed) which in turn throws an error in Safari, and you are stuck.
And you know what the funniest thing is? If you download the Instagram app itself and try to login using the same Facebook flow it will fail as well!
The lesson learned - before you suspect you made a mistake in your implementation check out some other apps with the same feature implemented and maybe you'll discover that you are not alone in your struggle.
The documentation says you should send a POST request to this URL:
I didn’t get why are you trying to redirect users to this endpoint?
I had exactly the same issue, the only workaround is to clear cache and cookies of WKWebView, so the user should re-input login and password again.
So use this snippet before loading your web view