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.

Let’s 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. πŸ‘‡

Image for post
Image for post

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.🀘

Written by

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