Add support for Thumbor

vercel · Oct 30, 2020 · e8bc851 · e8bc851
1 parent a666072
commit e8bc851
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/docs/basic-features/image-optimization.md b/docs/basic-features/image-optimization.md
@@ -132,6 +132,7 @@ The following Image Optimization cloud providers are supported:
 - [Imgix](https://www.imgix.com): `loader: 'imgix'`
 - [Cloudinary](https://cloudinary.com): `loader: 'cloudinary'`
 - [Akamai](https://www.akamai.com): `loader: 'akamai'`
+- [Thumbor](http://thumbor.org/): `loader: 'thumbor'`
 
 ## Caching
 

diff --git a/packages/next/client/image.tsx b/packages/next/client/image.tsx
@@ -8,10 +8,11 @@ const loaders = new Map<LoaderKey, (props: LoaderProps) => string>([
   ['imgix', imgixLoader],
   ['cloudinary', cloudinaryLoader],
   ['akamai', akamaiLoader],
+  ['thumbor', thumborLoader],
   ['default', defaultLoader],
 ])
 
-type LoaderKey = 'imgix' | 'cloudinary' | 'akamai' | 'default'
+type LoaderKey = 'imgix' | 'cloudinary' | 'akamai' | 'thumbor' | 'default'
 
 const VALID_LAYOUT_VALUES = [
   'fixed',
@@ -470,6 +471,18 @@ function cloudinaryLoader({ root, src, width, quality }: LoaderProps): string {
   return `${root}${paramsString}${normalizeSrc(src)}`
 }
 
+function thumborLoader({ root, src, width, quality }: LoaderProps): string {
+  const params = [`${width}x0`]
+  let paramsString = ''
+  if (quality) {
+    params.push(`filters:quality(${quality})`)
+  }
+  if (params.length) {
+    paramsString = params.join('/') + '/'
+  }
+  return `${root}${paramsString}${normalizeSrc(src)}`
+}
+
 function defaultLoader({ root, src, width, quality }: LoaderProps): string {
   if (process.env.NODE_ENV !== 'production') {
     const missingValues = []