Search code examples
javascriptajaxfirebasegoogle-chromexmlhttprequest

How to proxy all XMLHttpRequest in a web browser?


I'm using Google Firebase, and unfortunately, Google Firebase put some countries under sanctions which means they must use a proxy (or VPN) to access the website.

Is there any way I can set a proxy setting for each client request that they can freely access Firebase without a VPN?

I know there are options for Node.js, but I'm looking for a web browser solution. Firefox has this proxy settings, and Google Chrome also has some options for extension developers, but I need a solution that works just in a web page, and it means when a user comes to my website, he/she does not need to set a proxy to access Firebase.

Example: when a user comes to my website from (for example) Syria or Sudan, they don't need to set VPN for their browser, because I have done some proxy configuration in my website


Solution

  • Short answer: You can't do it website-only.

    Longer answer / explanation:

    I know there are options for Node.js,

    Good... that could work. Deploy your own Node.js server on Heroku or the like, which proxies requests to Firebase.

    but I'm looking for a web browser solution. Firefox has this proxy settings, and Google Chrome also has some options for extension developers, but

    This could work too, but as I'm sure you've considered... that would rely on the end-users installing those extensions before attempting to visit your site.

    I need a solution that works just in a web page,

    Nope. Not possible. The Google servers will not respond to any request coming from a sanctioned country. If a request comes from a disallowed country, the Firebase servers won't respond with your website - instead they respond with a 403. Firebase won't send the website. Your website won't be sent to the client. It doesn't matter what your website contains, it will never be sent to those end users in the first place.

    Even if you host the site elsewhere, and just use the Firebase database, it still won't work - for the same reasons. When the Firebase servers receive the request from a browser running in a sanctioned country, they respond with 403.

    The question then becomes: How to make the request appear to come from outside the sanctioned country, from the website only?

    You can't, not when you only control the website itself. That part of the request/response cycle is, for end-user protection purposes, handled by the browser. Browsers do not expose that functionality to webpages.

    If you want to handle everything for your users, without them needing a VPN (desktop, or browser), your only choice will be to send the request to a different non-Google server (such as a Node.js server you host on Heroku or the like), which then makes the request to Firebase on their behalf, gets the response, and responds back to the client. That way, to the Firebase servers, it looks like the request is coming from X* location.

    *X: Where ever the Heroku server is running.