Twitter API authorization fails CORS preflight in browser

Question

I\'m trying to do the 3-legged authorization necessary to call the Twitter APIs in a browser. The process starts with getting a request token by POSTing a signed request to

Answer 1

Check this workaround: https://stackoverflow.com/a/43881141

If you don’t control the server your frontend JavaScript code is sending a request to, and the problem with the response from that server is just the lack of the necessary Access-Control-Allow-Origin header, you can still get things to work—by making the request through a CORS proxy.

In short, prefix the request so the full URI looks something like this:

https://cors-anywhere.herokuapp.com/https://api.twitter.com/oauth/request_token

Unfortunately, you will not be able to use most Twitter libraries this way, but you can continue using fetch with the cors-anywhere prefix.

Answer 2

A workaround and it is a long way around is to build a proxy server that you run with node or something else, I've done this a few times now, this is a good starter repo for someone running into this issue. It has the downside of being React specific, but you could always rip out the react ui and just setup with whatever you need: hcra twitter build.

Its forked from a Create React App/Node Express boilerplate by Mars Hall

You will need to clone it and run git fetch and then checkout twitter-req branch.

Answer 3

One workaround would be to create a NodeJS server for the same and call the Node API requesting Twitter API from front-end.

Answer 4

So the unsatisfying resolution appears to be that the Twitter API does not support CORS. This seems a little astonishing to me, as it means that the API cannot be used from a browser.

That policy decision is probably related to their OAuth implementation, which is vulnerable to anyone with access to the calling platform. Maybe that was okay back in 2010, but most of the other major internet players have figured out how to do client-based authorization.