fix(blob): error early when trying to use conflicting characters (#769)

* fix(blob): error early when trying to use conflicting characters

Trying to upload files containing ?, # or // will always result in a weird
behavior where the pathname you sent won't be exactly the one in the resulting
url. Rather than relying on this I propose we just error early on and advise to
either not use them or encode them.

BREAKING CHANGE: Previously working characters will now throw an error.

* changeset

Author: vvo

.changeset/selfish-owls-thank.md

@@ -0,0 +1,5 @@
+---
+'@vercel/blob': minor
+---
+
+BREAKING CHANGE, we're no more accepting non-encoded versions of ?, # and // in pathnames. If you want to use such characters in your pathnames then you will need to encode them.

packages/blob/src/copy.ts

@@ -1,6 +1,6 @@
 import { MAXIMUM_PATHNAME_LENGTH, requestApi } from './api';
 import type { CommonCreateBlobOptions } from './helpers';
-import { BlobError } from './helpers';
+import { BlobError, disallowedPathnameCharacters } from './helpers';
 
 export type CopyCommandOptions = CommonCreateBlobOptions;
 
@@ -41,6 +41,14 @@ export async function copy(
     );
   }
 
+  for (const invalidCharacter of disallowedPathnameCharacters) {
+    if (toPathname.includes(invalidCharacter)) {
+      throw new BlobError(
+        `pathname cannot contain "${invalidCharacter}", please encode it if needed`,
+      );
+    }
+  }
+
   const headers: Record<string, string> = {};
 
   if (options.addRandomSuffix !== undefined) {

packages/blob/src/helpers.ts

@@ -81,3 +81,5 @@ export function isPlainObject(value: unknown): boolean {
     !(Symbol.iterator in value)
   );
 }
+
+export const disallowedPathnameCharacters = ['#', '?', '//'];

packages/blob/src/index.node.test.ts

@@ -586,6 +586,42 @@ describe('blob client', () => {
       );
     });
 
+    it('throws when pathname contains #', async () => {
+      await expect(
+        put('foo#bar.txt', 'Test Body', {
+          access: 'public',
+        }),
+      ).rejects.toThrow(
+        new Error(
+          'Vercel Blob: pathname cannot contain "#", please encode it if needed',
+        ),
+      );
+    });
+
+    it('throws when pathname contains ?', async () => {
+      await expect(
+        put('foo?bar.txt', 'Test Body', {
+          access: 'public',
+        }),
+      ).rejects.toThrow(
+        new Error(
+          'Vercel Blob: pathname cannot contain "?", please encode it if needed',
+        ),
+      );
+    });
+
+    it('throws when pathname contains //', async () => {
+      await expect(
+        put('foo//bar.txt', 'Test Body', {
+          access: 'public',
+        }),
+      ).rejects.toThrow(
+        new Error(
+          'Vercel Blob: pathname cannot contain "//", please encode it if needed',
+        ),
+      );
+    });
+
     const table: [string, (signal: AbortSignal) => Promise<unknown>][] = [
       [
         'put',

packages/blob/src/put-helpers.ts

@@ -2,7 +2,7 @@
 import type { Readable } from 'stream';
 import type { ClientCommonCreateBlobOptions } from './client';
 import type { CommonCreateBlobOptions } from './helpers';
-import { BlobError } from './helpers';
+import { BlobError, disallowedPathnameCharacters } from './helpers';
 import { MAXIMUM_PATHNAME_LENGTH } from './api';
 
 export const putOptionHeaderMap = {
@@ -92,6 +92,14 @@ export async function createPutOptions<
     );
   }
 
+  for (const invalidCharacter of disallowedPathnameCharacters) {
+    if (pathname.includes(invalidCharacter)) {
+      throw new BlobError(
+        `pathname cannot contain "${invalidCharacter}", please encode it if needed`,
+      );
+    }
+  }
+
   if (!options) {
     throw new BlobError('missing options, see usage');
   }