Rob--W / cors-anywhere

CORS Anywhere is a NodeJS reverse proxy which adds CORS headers to the proxied request.
MIT License
8.57k stars 5.99k forks source link

Set cors-anywhere as system proxy #396

Closed ebirck-css closed 2 years ago

ebirck-css commented 2 years ago

Still learning so bare with me if I'm going about this wrong.

I run an internal website for my job and I'm trying to use cors-anywhere to embed a site (that doesn't want to be embedded) within my website in an iframe. I followed the basic setup for a local server with node js, and all is working as expected, but I'm running into issues with relative url paths.

For example, if I set the initial src to "https://0.0.0.0:8080/https://third.party.site/dashboard", the main page loads fine, but needs to download some static files so on load it will make a call like GET "/static/logo.png". If this was loaded as the top level site in a browser that would translate to "https://third.party.site/static/logo.png" but because the origin is now technically my localhost this instead translates to "https://0.0.0.0:8080/static/logo.png" which of course gives a 404 and doesn't work.

So my plan to get around this is to set cors-anywhere as the system level proxy, so all traffic would pass through it, and then just have my website add a custom header that cors-proxy can look for so if that header is present it does its magic but when it's not traffic passes through untouched. Then in my website I would just reference the third party site directly so relative paths work like normal.

This of course would require some reworking of how requireHeader works to allow pass-through traffic instead of denying, and I would have to change the parseURL function so it accepts the target URL directly. I'm fairly confident I can handle both, but before endeavoring into all that I figured it worth a mention in case this is a use case someone has already solved in a more elegant way.

Any advice appreciated, and thanks for the great tool!

Rob--W commented 2 years ago

CORS Anywhere is not the right tool for your task.

You are looking for a HTTP proxy with man-in-the-middle capabilities that rewrites the HTTP response. Your sample URLs use https, so that implies that the server needs to be able to generate certificates on the fly, chained to a root that is trusted by your device. That is not easily possible.

If the third party website is completely outside of your control, then I suggest to create or use a browser extension that modifies the X-Frame-Options and/or the frame-ancestors directive of the Content-Security-Policy header for that third-party website, when embedded in your website. Then you can frame it.

An alternative is to not embed that third-party website in a frame, but open it in a popup instead.