DEV Community: Joe Snell

Hide Rick Rolls in a Spotify Link

Joe Snell — Mon, 13 May 2024 19:31:26 +0000

Last night, my brother messaged me a spotify link, but when I tapped it, it took me somewhere else entirely.

tldr; I made a thing to hide rick rolls in spotify links: https://spotify-rickroll.vercel.app/

After copying the link to a note to see the raw URL, I saw that there was a query string with URL encoded values.



https://open.spotify.com/track/66cuLvkHsW7dNkfNk6gQP9?context=spotify%3Aalbum%3A6DUyohk95eun9LArJtHyF7

The API reference is light on details, but spotify mobile apps appear to resolve whatever spotify URI is passed in the context parameter (the web UI did not behave this way).

After inspecting the URL I realized that the first ID in the URL (66cuLvkHsW7dNkfNk6gQP9) matched A Wolf At the Door by Radiohead and the second ID in the query string (6DUyohk95eun9LArJtHyF7) indeed matched the album Country by Medium Build (a fantastic album you should check out).

After creating some more examples (linking to a search, a podcast, etc.), I discovered that using: spotify:track:<track id> will cause the track to automatically play. The value of this was quickly realized with a certain (infamous) spotify ID 4PTG3Z6ehGkBFwjybzWkR8 (copy paste into a message to try it out):



https://open.spotify.com/track/7pqmuOzAXmnuAXP68LSjD5?context=spotify%3Atrack%3A4PTG3Z6ehGkBFwjybzWkR8

After crafting a few more by hand, I threw together a simple website to handle parsing the track IDs and generating a rick roll (or optionally a different target track entirely).

After spending the morning rick rolling everyone I can think of, I have made it public (github):

You can generate your own links here:

https://spotify-rickroll.vercel.app/

Misc. observations:

This appears to only work on mobile apps (tested on ios and android)
iOS provides the most impact because it automatically renders the preview track whereas Android requires you to tap to display the preview
How the spotify app generated one of these links in the first place does appear to be a somewhat difficult to reproduce bug. If anyone from the spotify team would like to get any of the original links with the si values please reach out.

Enjoy ❤️

🚀 Vercel API Client for Python

Joe Snell — Tue, 28 Jul 2020 19:21:11 +0000

Overview

Introducing a python sdk for interacting with the Vercel API!

pip install vercel

Get started in just a few lines:

import vercel

vercel.api_token = 'xxxxxx'

user = vercel.User.get()
# { ... }

Or you can remix this glitch project:

Get Involved

If you'd like to get involved, check out the repo below:

wulfmann / vercel

Python SDK for the Vercel API

You can see the supported resources here.

If you'd like to contribute or find a bug feel free to open an issue.

Follow me on twitter

Generating ACM certificates for a Vercel-managed domain.

Joe Snell — Tue, 21 Jul 2020 13:08:31 +0000

When you use Vercel to manage your DNS records, they generate SSL certificates for you.

I want to manage my DNS with Vercel, but still need an ACM Certificate in my AWS account. I've done this before with Route 53, but with Vercel I kept seeing mysterious failures.

After trying Email Validation, I switched to DNS Validation. I still got errors, but this time I got more information:

The status of this certificate request is "Failed". One or more domain names have failed validation due to a Certificate Authority Authentication (CAA) error.

After googling around, I found this note:

One or more domain names have failed validation due to a Certification Authority Authentication (CAA) error, check your CAA DNS records..

After going back to my domain in the Vercel dashboard, I found this record:

CAA 0 issue "letsencrypt.org"

Since there is no CAA Record allowing amazon to issue certificates, the request fails.

AWS provides documentation on how to configure a CAA record to allow ACM to generate certs. We need to add an extra record in Vercel:

CAA 0 issue "amazon.com"

Request a new ACM cert and this time it succeeds!

Introducing `bump-cdk`

Joe Snell — Wed, 15 Jul 2020 14:21:25 +0000

Quickstart

From a directory that contains a package.json with aws-cdk dependencies run:

$ npx bump-cdk

You should now have those dependencies upgraded and pinned to the same version!

You can check out the source here.

Why does this exist

A common issue when working with AWS CDK is version mismatch.

The way CDK's modules interface together requires them to always be on the same version More Information.

This for example might cause an error:

{
    "dependencies": {
        "@aws-cdk/core": "1.30.0",
        "@aws-cdk/aws-lambda": "1.51.0"
    }
}

This introduces maintenance overhead by forcing you to always have your CDK dependencies on the same version.

Additionally, because of semver, when you add dependencies, you often end up with a dynamic version range:

$ yarn add @aws-cdk/core
...
{
    "dependencies": {
        "@aws-cdk/core": "^1.30.0"
    }
}

This means that the module is "Compatible with version" 1.30.0, but dependencies added at a later date can get out of sync.

Because of all this, it is recommended to pin the versions without the semver range modifier.

Issues

Feel free to check it out, and if you find any issues or have suggestions feel free to open an issue.

pin-latest: Easily resolve package.json “latest” versions

Joe Snell — Thu, 09 Jul 2020 16:03:17 +0000

wulfmann / pin-latest

Small utility for converting `package.json` versions from `latest` to the actual latest version.

pin-latest

Small utility for converting package.json versions from latest to the actual latest version.

Quickstart

Install

npm i -g pin-latest
# or
yarn global add pin-latest
# or
npx pin-latest

Given the following package.json:

{
    "name": "example-project",
    "dependencies": {
        "react": "latest"
    }
}

Running pin-latest will result in the following output:

$ pin-latest .

{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}

To save changes pass the --write flag:

$ pin-latest .
package.json updated.

$ cat package.json
{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}

Usage

$ pin-latest --help
Usage
    $ pin-latest <project-directory>
Options
    --exact, -t     Set the exact version
    --write, -w     Write changes
    --version, -v   Version number
    --help, -h      Displays

…

View on GitHub

The purpose of this project is providing an easy way to translate dependency versions specified in a package.json.

Any dependency that specifies a version of latest will be updated to the actual latest version of the package.

Quickstart

Install

npm i -g pin-latest
# or
yarn global add pin-latest
# or
npx pin-latest

Given the following package.json:

{
    "name": "example-project",
    "dependencies": {
        "react": "latest"
    }
}

Running pin-latest will result in the following output:

$ pin-latest .

{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}

To save changes pass the --write flag:

$ pin-latest .
package.json updated.

$ cat package.json
{
    "name": "example-project",
    "dependencies": {
        "react": "^16.13.1"
    }
}

View more information in the project’s readme.