PWA. Recent updates to iOS/Android now strip any and all parameters and/or hash from URLs to prevent Cross Site Tracking

I’ve created a PWA Clock App for work and until recently I could have a single page dynamically load ANY employee clock profile by simply doing the following:

  1. Type their unique link in the browser: https://example.com/clock/?id=1001
  2. Click Share then click Add To Home Screen.
  3. Set a custom name for the icon if I want to.
  4. Click Add.

Done. Awesome web app ready to use.

Then one day… this stopped working on everyone’s phone. Meaning…

Forget this:

// https://example.com/clock/?id=1001
const parsedUrl = new URL(window.location.href);
const employeeId = parseInt(parsedUrl.searchParams.get("id")); // "1001"

And also, forget this:

// https://example.com/clock/#1001
// https://example.com/clock#1001
const employeeId = parseInt(window.location.hash.slice(1)); // "1001"

After hours of frustration I’ve decided to do the dumbest thing I could think of which is to create a physical directory for an employee using the same employee id just to say I’ve tried everything I could think of and what do you know… It worked.

Now I have to use this:

// https://example.com/clock/1001
const parsedUrl = new URL(window.location.href);
const pathParts = parsedUrl.pathname.split('/');
const employeeId = parseInt(pathParts[pathParts.length - 1]); // "1001"

Please “…say it ain’t so. This joke is a heart breaker.”