App Options
Customizing your app
Javascript API
Recipes
⛓
App Protocols and Deeplinks
How to use custom protocol links to launch your app built with ToDesktop.
What are App Protocols?
You've probably seen app protocols before. Perhaps you've seen them with iTunes (
itmss://) or Spotify (spotify://) or Slack (slack://). App protocols provide an easy way for you to launch your application from inside another application. One common use-cases is to launch a desktop application from a website.
1
<a href="spotify://">Open Spotify App</a>
Copied!
What are Deeplinks?
We can also add more information to go to a specific part of a desktop application. We call this a ‘deeplink’.
1
<a href="spotify://track:1mIBixqmt8vbDNXiKqLTGJ">
2
Play “Broken Together” by “Mani Obeya” on Spotify
3
</a>
Copied!
App Protocols and ToDesktop
Enabling App Protocols
You can enable App Protocols for your app by selecting the “Support App Protocol (deeplink)” option in the “App Options” box. You can then type the App Protocol that you wish to use. In the example below, we have chosen
interplay:// as the app protocol.
Using App Protocols
Let's use the app protocol of
interplay:// in our examples below.Simple App Protocol
interplay:// → https://app.interplay.ioThis will open Interplay app at the default location. If the app is already opened then the window will gain focus.
Deeplink
interplay://foo/bar → https://app.interplay.io/foo/barDeeplinks allow you to specify a path to navigate to in your app. This will open Interplay app at the
foo/bar path.Example
So, if you wanted to link from a website to a deeplink within Interplay app then you could do something like this:
1
<a href="interplay://foo/bar">Open FooBar on Interplay app</a>
Copied!
Manually handling App Protocols
You may wish to opt-out of the default behaviour for App Protocols. For example, you may wish to pass data to your app through a URL but not load a new page.
Let's say that we want to handle the URL
spotify://pause. When this link is opened we want to pause the music but we don't want to change the current URL of our app. We can prevent navigation by calling event.preventDefault(). Here's an example:1
window.todesktop.on("open-protocol-url", (_, event) => {
2
/*
3
* If URL contains 'pause' then prevent navigation
4
* and pause the audio player.
5
*/
6
if (event.url.includes("pause")) {
7
event.preventDefault();
8
audio.pause();
9
}
10
});
Copied!
Video
AppImage Support
Your users should use AppImageLauncher to install and integrate your app into their desktop environment. Otherwise this feature may not work.
App Options - Previous
Defining Internal URLs
Next - Customizing your app
Add Custom CSS to your Desktop App
Last modified 7mo ago