Writing a Simplest VPN Chromium Extension Ever.

Image for post
Image for post

👋, Imagine you have a proxy server, and you have been asked to create a VPN Extension, how would you do it? 😎I had to a similar task and I was asked to create a simple VPN server that will be used in our office staff, and after a bit of research I was able to create, what I hate the most is very lack of supporting help guides for the beginners over the internet, this is the reason why I decided to write my own guide on how you can make a simple chromium-based browser’s extension.

Lets get started 🏃‍♀️, first you need to set up an extension boilerplate, you can even create one, all you need is an HTML, js and a manifest file. You can clone this repo https://github.com/MahbbRah/chrome_extension_boilerplate 📃

Edit Your manifest file, you will need permission to change the proxy settings so just add this. 💻

All of the chromium-based browsers have a chrome API running, and chrome API provides the solution for modifying proxy of the browser, you learn more about it from here https://developer.chrome.com/extensions/proxy

Anyways you can setup a proxy by Proxy auto-config script, 🤓A Proxy Auto-Configuration (PAC) file is a JavaScript function that determines whether web browser requests (HTTP, HTTPS, and FTP) go directly to the destination or are forwarded to a web proxy server. It more like an instruction

In the above 👆 script, we are instructing to re-route every single request through Proxy, you can also change it to bypass proxy on some of the websites or use the proxy on a selective host like this. 👇

Anyways to set up the proxy you can just give the PAC script 👇

To Reset the proxy, write this. 👇

Simply you can just add two buttons on your HTML page to connect and disconnect like this. 👇

Image for post
Image for post

and You js file can look this this 👇

Image for post
Image for post

That’s it.🤘

A Resident of the Javascript Rockstar world. I like to write about problems and their solution that I face in my life. I code because is I am good at it.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store