electron/docs/fiddles/system/protocol-handler/launch-app-from-URL-in-another-app/index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
  </head>
<body>
  <section>
    <header>
        <h1>
          Protocol Handler
        </h1>
        <h3>The <code>app</code> module provides methods for handling protocols.</h3>
        <p>These methods allow you to set and unset the protocols your app should be the default app for. Similar to when a browser asks to be your default for viewing web pages.</p>

        <p>Open the <a href="https://electronjs.org/docs/api/app">full app API documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> in your browser.</p>
    </header>

    <div >
        <button id="open-in-browser" class="js-container-target demo-toggle-button">Launch current page in browser
          <div class="demo-meta u-avoid-clicks">Supports: Win, macOS <span class="demo-meta-divider">|</span> Process: Main</div>
        </button>
        <section id='open-app-link'>
          <a href="electron-api-demos://open">Now... launch the app from a web link</a>
        </section>
        <div >
          <p>You can set your app as the default app to open for a specific protocol. For instance, in this demo we set this app as the default for <code>electron-api-demos://</code>. The demo button above will launch a page in your default browser with a link. Click that link and it will re-launch this app.</p>
          <h5>Packaging</h5>
          <p>This feature will only work on macOS when your app is packaged. It will not work when you're launching it in development from the command-line. When you package your app you'll need to make sure the macOS <code>plist</code> for the app is updated to include the new protocol handler. If you're using <code>electron-packager</code> then you can add the flag <code>--extend-info</code> with a path to the <code>plist</code> you've created. The one for this app is below.</p>
          <h5>Renderer Process</h5>
          <pre><code>
            const {shell} = require('electron')
            const path = require('path')
            const protocolHandlerBtn = document.getElementById('protocol-handler')
            protocolHandlerBtn.addEventListener('click', () => {
                const pageDirectory = __dirname.replace('app.asar', 'app.asar.unpacked')
                const pagePath = path.join('file://', pageDirectory, '../../sections/system/protocol-link.html')
                shell.openExternal(pagePath)
            })
          </code></pre>
          <h5>Main Process</h5>
          <pre><code>
            const {app, dialog} = require('electron')
            const path = require('path')

            if (process.defaultApp) {
                if (process.argv.length >= 2) {
                    app.setAsDefaultProtocolClient('electron-api-demos', process.execPath, [path.resolve(process.argv[1])])
                }
            } else {
                app.setAsDefaultProtocolClient('electron-api-demos')
            }

            app.on('open-url', (event, url) => {
                dialog.showErrorBox('Welcome Back', `You arrived from: ${url}`)
            })

          </code></pre>
          <h5>macOS plist</h5>
          <pre><code>
            <?xml version="1.0" encoding="UTF-8"?>
                <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
                    <plist version="1.0">
                        <dict>
                            <key>CFBundleURLTypes</key>
                            <array>
                                <dict>
                                    <key>CFBundleURLSchemes</key>
                                    <array>
                                        <string>electron-api-demos</string>
                                    </array>
                                    <key>CFBundleURLName</key>
                                    <string>Electron API Demos Protocol</string>
                                </dict>
                            </array>
                            <key>ElectronTeamID</key>
                            <string>VEKTX9H2N7</string>
                        </dict>
                    </plist>
                </code>
            </pre>
        </div>
    </div>
    <script type="text/javascript">
        require('./renderer.js')
    </script>
</section>
</body>
</html>

  </body>
</html>
FEAT [#20442] : adds the fiddle for launching an app from URL in another app, including all 3 files main.js, index.html, renderer.js (#20718) 2019-11-13 05:46:54 +00:00			`<!DOCTYPE html>`
			`<html>`
			`<head>`
			`<meta charset="UTF-8">`
			`<title>Hello World!</title>`
			`</head>`
			`<body>`
			`<section>`
			`<header>`
			`<h1>`
			`Protocol Handler`
			`</h1>`
			`<h3>The <code>app</code> module provides methods for handling protocols.</h3>`
			`<p>These methods allow you to set and unset the protocols your app should be the default app for. Similar to when a browser asks to be your default for viewing web pages.</p>`

docs: replace electron.atom.io with electronjs.org in docs/fiddles (#22196) 2020-02-17 00:46:41 +00:00			`<p>Open the <a href="https://electronjs.org/docs/api/app">full app API documentation<span class="u-visible-to-screen-reader">(opens in new window)</span></a> in your browser.</p>`
FEAT [#20442] : adds the fiddle for launching an app from URL in another app, including all 3 files main.js, index.html, renderer.js (#20718) 2019-11-13 05:46:54 +00:00			`</header>`

			`<div >`
			`<button id="open-in-browser" class="js-container-target demo-toggle-button">Launch current page in browser`
			`<div class="demo-meta u-avoid-clicks">Supports: Win, macOS <span class="demo-meta-divider">\|</span> Process: Main</div>`
			`</button>`
			`<section id='open-app-link'>`
			`<a href="electron-api-demos://open">Now... launch the app from a web link</a>`
			`</section>`
			`<div >`
			`<p>You can set your app as the default app to open for a specific protocol. For instance, in this demo we set this app as the default for <code>electron-api-demos://</code>. The demo button above will launch a page in your default browser with a link. Click that link and it will re-launch this app.</p>`
			`<h5>Packaging</h5>`
			`<p>This feature will only work on macOS when your app is packaged. It will not work when you're launching it in development from the command-line. When you package your app you'll need to make sure the macOS <code>plist</code> for the app is updated to include the new protocol handler. If you're using <code>electron-packager</code> then you can add the flag <code>--extend-info</code> with a path to the <code>plist</code> you've created. The one for this app is below.</p>`
			`<h5>Renderer Process</h5>`
			`<pre><code>`
			`const {shell} = require('electron')`
			`const path = require('path')`
			`const protocolHandlerBtn = document.getElementById('protocol-handler')`
			`protocolHandlerBtn.addEventListener('click', () => {`
			`const pageDirectory = __dirname.replace('app.asar', 'app.asar.unpacked')`
			`const pagePath = path.join('file://', pageDirectory, '../../sections/system/protocol-link.html')`
			`shell.openExternal(pagePath)`
			`})`
			`</code></pre>`
			`<h5>Main Process</h5>`
			`<pre><code>`
			`const {app, dialog} = require('electron')`
			`const path = require('path')`

			`if (process.defaultApp) {`
			`if (process.argv.length >= 2) {`
			`app.setAsDefaultProtocolClient('electron-api-demos', process.execPath, [path.resolve(process.argv[1])])`
			`}`
			`} else {`
			`app.setAsDefaultProtocolClient('electron-api-demos')`
			`}`

			`app.on('open-url', (event, url) => {`
			dialog.showErrorBox('Welcome Back', `You arrived from: ${url}`)
			`})`

			`</code></pre>`
			`<h5>macOS plist</h5>`
			`<pre><code>`
			`<?xml version="1.0" encoding="UTF-8"?>`
			`<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">`
			`<plist version="1.0">`
			`<dict>`
			`<key>CFBundleURLTypes</key>`
			`<array>`
			`<dict>`
			`<key>CFBundleURLSchemes</key>`
			`<array>`
			`<string>electron-api-demos</string>`
			`</array>`
			`<key>CFBundleURLName</key>`
			`<string>Electron API Demos Protocol</string>`
			`</dict>`
			`</array>`
			`<key>ElectronTeamID</key>`
			`<string>VEKTX9H2N7</string>`
			`</dict>`
			`</plist>`
			`</code>`
			`</pre>`
			`</div>`
			`</div>`
			`<script type="text/javascript">`
			`require('./renderer.js')`
			`</script>`
			`</section>`
			`</body>`
			`</html>`

			`</body>`
docs: replace electron.atom.io with electronjs.org in docs/fiddles (#22196) 2020-02-17 00:46:41 +00:00			`</html>`