Twitter callback URL settings

[brandiw]

I'm trying to follow this tutorial. I'm 90% of the way there, but having trouble with the callback URL. Can I inquire as to what settings are used in this example app for the callback field? In the screenshot it's blank. Also, Twitter callback is a GET and I don't see any GET routes in this app that you'd be using for this?

For reference, I'm running the front and back ends of this app on two separate ports, and I see some other users are having issues with that. Unsure if related, but I'm also not able to trigger onSuccess in my front end.

[ivanvs]

Hi @brandiw,

First of all, sorry for late response. I will check out your issue during the weekend. Twitter must have changed something in their API. As soon as I found out what is the issue, I will edit the tutorial and post here solution.

[pthieu]

@brandiw @ivanvs:

Twitter has changed their flow it seems.

The popup() will get the login form from Twitter which hits their /authorize endpoint:

<form action="https://api.twitter.com/oauth/authorize" id="oauth_form" method="post" target="_self">
...
</form>

Upon successful login, they will handle some logic and redirect the user to the Callback URL that the app owner specified in the app settings.

This means the solution without changing the component logic is to add another route route.get('<Callback URL you specified in settings>'), which will either return something or redirect back to a route that has the query parameters oauth_token and oauth_verifier, since the component is polling for these here: https://github.com/GenFirst/react-twitter-auth/blob/master/src/index.js#L72

The polling logic will will detect these query parameters and close the dialog, returning them to the next middleware that's set up.

[ragrag]

@brandiw Did you manage to get it working?