How to add local files using WebDAV

[icidasset]

A "File System Access API" integration is most likely going to happen in the future, which will allow you to play music from your device through just the browser. But in the meantime you can use WebDAV as an alternative. While most WebDAV software is quite outdated and unstable, there are modern equivalents such as https://github.com/hacdias/webdav which is what we're going to use in this short tutorial.

1. Install https://github.com/hacdias/webdav
2. Create a YAML configuration file (for the WebDAV server) in the directory where your music is located.
3. Add the necessary CORS configuration that will allow us to use Diffuse with the WebDAV server:

   cors:
     enabled: true
     credentials: true
   
     allowed_headers:
       - Authorization
       - Content-Type
       - Depth
       - Range
     allowed_methods:
       - GET
       - HEAD
       - PROPFIND
     allowed_hosts:
       - https://diffuse.sh
       - https://nightly.diffuse.sh
       - http://127.0.0.1:44999
     exposed_headers:
       - Content-Length
       - Content-Type

   You can also find this in Diffuse's documentation: https://diffuse.sh/about/cors/#CORS__WebDAV
4. Add a username and password to the YAML file so you can access the WebDAV server.

   users:
     - username: diffuse
       password: music

5. Start the WebDAV server:

   cd music_dir
   webdav --config name_of_your_yaml_file.yml

6. Add the WebDAV server to Diffuse: Sources → Add new → WebDAV
   Host url: http://localhost:PORT_NUMBER (HTTPS is possible too)
   The port number will be shown in your terminal, or you can pass your own via a flag to the WebDAV server.
   Use the username and password from config.
7. Add source & wait for it to process 🎷

[icidasset]

Part 2: Using HTTPS and making the WebDAV server available to your other devices.

There's many ways of doing this, but in this example we'll use Tailscale for easier networking and automatically setting up HTTPS. Continuing from the tutorial above:

1. Install https://tailscale.com/ on all your devices that you want to use Diffuse on and the one where the WebDAV server is hosted.
2. Enable HTTPS on Tailscale: https://tailscale.com/kb/1153/enabling-https/
3. Make sure you can access the Tailscale CLI: https://tailscale.com/kb/1080/cli/?q=cli#using-the-cli
4. Generate the HTTPS certificate and key files with:

   tailscale cert --cert-file tailscale.pem --key-file tailscale-key.pem YOUR-DEVICE-NAME.YOUR-TAILNET-DOMAIN-ALIAS.ts.net

5. Add these new config properties to your yaml WebDAV config file.
   Probably a good idea to pick a fixed port number here:

   address: 0.0.0.0
   tls: true
   port: 57911
   cert: tailscale.pem
   key: tailscale-key.pem

6. Use YOUR-DEVICE-NAME.YOUR-TAILNET-DOMAIN-ALIAS.ts.net as the host in your Diffuse WebDAV source.
7. Success 🎉

⚠️ This might not entirely work on Safari and iOS devices, not sure yet why that is.