👹🚧 Dodge browser security with web proxies

Work around browser security for fun

With Game Pad API browsers can capture inputs from game controllers like Xbox or PS5 without the need to install any drivers.

My goal was to use a wall tablet to control my cameraa and use a game controller as input.

Challenge: the camera has a HTTP endpoint but it wouldn’t accept requests from other sites because of CORS.

In this article I’ll explain what CORS is and how I overcame this using a webproxy I wrote with Python. Skip to to the fix below.

Cross-Origin Resource Sharing

CORS is a browser security restriction that stops site A making a request to site B. Without this the web would be a bad place. Imagine visiting a rogue site and it makes a request to say.. your banking site.

worse is browsers used to bundle requests with Cookies, meaning if you we were logged in to site B, the browser associated Cookie for that site (depending on same origin policy), making the request to site B as if you were logged on.

TLS/SSL Validation Checks

browsers make sure certificates pass certain checks and if they don’t you get a scary warning. it checks things like:

• Hostname mismatch / Common name validation
• Expired certs
• Invalid cert authority
• Self signed
• Weak Ciphers, but these are usually to do with the session itself rather than the cert

the fix

i needed something that would make the request look like it originated from the camera and my only option was a proxy.

I wanted to configure it dynamically. I made HomieProxy written in Python and runs in Home Assistant as an integration so I didn’t need to run a seperate docker container.

The parameters i wanted:

• url - The resource you want to proxy
• response_header - headers to return to your browser
• request_header - headers to send to the resource / origin
• token - For authentication with the proxy
• skip_tls_checks - Bypass TLS checks
• timeout - Timeout setting (defaults to 300 seconds)

.. e.g. how i’d send a request to the camera:

• the endpoint is https://camera4/onvif/soap/control
• I need Access-Control-Allow-Origin to be sent back to make the browser happy
• I want the Origin header my browser sends to be overwritten with the hostname of my camera (Not necessary for a lot of CORS implementations)

"http://localhost/homie_proxy/route? \
&url=https:///camera4/onvif/soap/control \
&response_header[Access-Control-Allow-Origin]=* \
&request_header[Origin]=https://camera4 \
&token=TOKEN"

Code: https://github.com/ibz0q/homie-proxy

Bonus: Apple TV

Another use case was using Apple TV screensavers (coz they’re nice) as backgrounds on my wall tablet.

Apple recently made a change to their video CDN that now serve the assets on a domain using a certificate with a custom CA. This stops browsers from loading things easily, without installing their CA.

You can see this yourself here: https://sylvan.apple.com/Videos/comp_A114_C001_0305OT_v10_SDR_FINAL_22062018_SDR_2K_AVC.mov

With the proxy i.e.

"http://localhost/homie_proxy?token=TOKEN \
&url=https://sylvan.apple.com/Videos /comp_A114_C001_0305OT_v10_SDR_FINAL_22062018_SDR_2K_AVC.mov \
&skip_tls_checks=cert_authority"