Setting up Custom Proxy for Electron Webview
So lately I have been working on an app, a Browser on Electron and one of the requirements was to change the proxy of the browser and every instance should originate from a single IP, in short, they wanted me to set up a custom IP for the webview.
After hours of research over google, I was able to solve the problem and was successfully changed the proxy of the browser. It was quite easy to solve but since I am a newbie at electron and there was no relevant help on the internet I decided to write a medium article so the people in the future will be able to do what I did and took me hours of research, easily.
So I was using react-electron, and I had to inject the webview tag via javascript on the mount of the app, anyways I did that, and now I needed to set up a proxy for the web view, I found this.
The solution guy proposed work perfectly as he used persist webviewSession and he set up proxy rules for the persisted webview session.
Since I was using a javascript injected webview added the partition.
webview.setAttribute("partition", "persist:webviewsession");and on main, I wait for the window read-to-show even and then I inject the proxy to the webview since I was injecting the webview on did mount method or react.js, I did the following on main.js
mainWindow.on("ready-to-show", function () {
var proxyIp = " 83.97.23.90";
var port = "18080";if (proxyIp.trim() == "noproxy") {
var my_proxy = "direct://";
session
.fromPartition("persist:webviewsession")
.setProxy({ proxyRules: my_proxy }, function () {
console.log("using the proxy " + proxyIp);
});
} else {
var my_proxy = "http://" + proxyIp + ":" + port;
session
.fromPartition("persist:webviewsession")
.setProxy({ proxyRules: my_proxy }, function () {
console.log("using the proxy " + proxyIp);
});
}
});
