Hosting Web MiniDisc Pro

As of January 15th 2022, the MiniDisc Wiki has been hosting Web MiniDisc Pro at https://web.minidisc.wiki/. Here are my experiences with hosting a modern client-side web app on Microsoft Azure Blob Storage.

I am not the developer or maintainer of Web MiniDisc (Pro) - I am a sysadmin aiming to improve my knowledge of both Azure and devops as a whole. I also run the MiniDisc Wiki; a modern, community-led home for the Sony MiniDisc format that still sees niche interest and community support.

Since 2020, MiniDisc has obtained “retro tech” status and has both a dedicated fanbase as well as developers using the format for personal projects. Chief among these has been Web MiniDisc from Stefano Brilli (cybercase) - a port of the earlier (yet stagnant) linux-minidisc project to modern web browsers using TypeScript and the WebUSB standard.

Being able to easily copy music files to a (USB-capable) NetMD device without using the cumbersome and outdated Sony SonicStage software was a major boon to the MD scene. For decades, the only way to copy music to a MiniDisc was via real-time recording into a device, CD-MD equipment, or over USB on newer devices with SonicStage, a program criticized even in its day for being cumbersome and only working on (certain versions of) Windows. Even Windows 10 is not supported without disabling a key security feature.

Web MiniDisc corrected this, and works on all major platforms supporting Chromium-based browsers and libusb. But as the community surrounding MiniDisc grew, so did development interest in the application. As a niche passion project, cybercase could not commit to merging new PRs to the project regularly and asked the most prominent developer, asivery, to fork the project into “Web MiniDisc Pro.”

The MiniDisc Wiki has been live since February 2020 and has always been hosted as a Debian VM on Microsoft Azure. I chose Azure because it is what I use at work and I wished to gain more experience with the platform. Since its launch, the Wiki has become the largest site for MD info on the internet and has achieved its goal as the new home for the format.

When the possibility of a Web MiniDisc fork was discussed in late 2021, I looked into how I may be able to help. As the application is entirely client-side and does not need any server processing, static hosting with Azure Blob Storage was the obvious choice. Blob Storage does not require any maintenance and has significantly lower costs than a VM.

Initially, we used a subdirectory to host a test version of the fork for merging changes. This version was uploaded via a manually-built ZIP file to Azure Storage using the File Explorer. This later created an issue with the YAML script - we'll get to that shortly.

Microsoft's purchase of GitHub may have been influential, as there was existing documentation on how to deploy a GitHub project to Azure Storage. I forked asivery's repo on GitHub and looked at both cybercase's deployment to GH Pages and MS' documentation to make a YAML script that would build the application and push it to my Azure Storage account.

GitHub has a feature named “secrets” that allows for credentials to be used in builds and/or GitHub Actions and be kept private during a workflow run. Following Microsoft's documentation, I used this to hide both the Azure login credentials as well as the Storage Key used for uploading to the Blob - needing both seems redundant, but Microsoft.

Deploying WMD Pro in production had 3 major issues.

The first was a different Storage Key in GH Secrets that broke when moving from the test storage blob to the production one - this was an avoidable error that should have been caught before making the PR to asivery's repo. But it was very easy to resolve.

The second was a trailing slash (/) that caused the complied application to be uploaded to the "$web//" folder in Azure. On a traditional filesystem, this would not be possible. Instead, we were left with a subdirectory inaccessible from the web.

The first time this happened, I manually removed the “/” subdirectory, built the application myself and uploaded it manually to the storage blob. But this wasn't a workable solution long term, so I worked with asivery to remove the trailing slash from the YAML script in GitHub and tested the deployment. Luckily this resolved the issue, even though uploading to the “$web” location without a trailing slash seems wrong from a UNIX standpoint.

Finally, newer deployments did not overwrite existing files in the blob. From previous tests, overwriting was standard behavior. Upon reading the changelogs from the Ubuntu Docker image that GitHub uses for its Actions runs, I learned that newer versions of the Azure “az” command changed this behavior and would not overwrite existing files without an explicit flag. Adding the “–overwrite” flag to the upload command fixed this. Both asivery and myself were annoyed that a workflow-breaking change would be pushed to production in such a way.

Azure Storage provides a SSL certificate for HTTPS by default, but only for the .windows.net domain. To use our custom domain, we need to create a CDN endpoint attached to the Storage Blob. Validating and applying the SSL cert to the custom domain took longer than expected (several hours) but worked as intended once completed.

Because CDNs cache content at numerous PoPs, it was important to include a purge command to the GH Actions script. The CDN also caused issues with hosting a secondary app in a directory on the same subdomain, but that's a story for another day. One final adjustment was creating a rule using Azure's CDN Rules Engine to redirect HTTP traffic on port 80 to HTTPS on port 443. Luckily, this worked as intended.

Since ironing out these issues, Web MiniDisc Pro has been hosted successfully by us in Azure Storage with the associated CDN. The service has been reliable and inexpensive, despite the above mentioned flaws that caused confusion and/or disruption. For as long as there is a demand to host WMD Pro, we are able to do so; as well as use GitHub Actions to simplify building and pushing new versions without manual intervention.

  • software/hosting-wmdpro.txt
  • Last modified: 4 months ago
  • by specialk