This is going to be very difficult, mainly because of security reasons. A website normally cannot access the filesystem of the client, nor can it run commands. This is done to prevent random websites messing with your computer.
There are however a few ways you can do this:
Option 1: Javascript (hacky, do not use it)
As mentioned in this question, there is a way of executing files on the client if you know exactly where it is. It is done by using the file://
protocol like so:
window.open('file://C:/path/to/your/file.exe');
To use this method, you could try to install the Electron program in a folder on the C drive. That way, you always know where it is.
I do not recommend using this option though, I'm just including it because it's a possibility and so you know it's a bad one.
Option 2: Reverse the flow
A good second option would be to change the flow of your application. Instead of starting with your web app, a better approach might be to start in the desktop app and from there open the web app. This can be done using standard practices and is also more durable.
This question details how to use NodeJS (which is part of Electron) to open a website in the client browser.
Option 3: Using a custom URI scheme
The third, and most difficult, option would be to register your own URI scheme in the operating system of the client. Just as http://
makes your computer go on the internet and file://
makes it go to the hard disk, you can make your own scheme/protocol to do what you want. You could register myapp://
in the OS, and have it execute your app once somebody clicks on such a link. This is however far more complicated, and works differently on all operating systems. You will have to create system specific installers for this. More information on how to do this on Windows can be found here.
Conclusion
This is highly situation dependant, but based on what you told me, your focus lies on security. The best approach seems to be option 2 if possible. This way, you start with the desktop app and open a regular URL to your website once needed. This URL is already public, so no other vulnerabilities would get introduced. The custom URI solution is very neat, but introduces two possibilities:
- Other websites could launch your app as well.
- If you allow passing data in the URL, like
myapp://data
, other websites could try to pass malformed data to your application to try to compromise it.
Option 2 also has this problem because it's a public facing website, but that's your only concern. Choosing option 3, you would have 2 attack vectors instead of one. But, in the end, it's a matter of preference really. Using a custom URI scheme can be done safely, so it's perfectly fine to use that solution. It will however be more work.