Skip to content

Commit ca4ea71

Browse files
committed
fix: 🐛 Removed crypto dependency from client bundle
Uses hashCode instead of sha1 for external images ✅Closes: #332
1 parent 7569362 commit ca4ea71

File tree

2 files changed

+19
-13
lines changed

2 files changed

+19
-13
lines changed

__tests__/components/image/external-images/index.test.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -37,15 +37,15 @@ describe('External images', () => {
3737
externalUrl: 'https://next-export-optimize-images.vercel.app/sub-path/og.png',
3838
output: '/_next/static/chunks/images/sub-path/og_1920_75.webp',
3939
quality: 75,
40-
src: '/_next/static/media/8fcb025d6e036ec05907f2367ee713067a0c406c.png',
40+
src: '/_next/static/media/-803215824.png',
4141
width: 1920,
4242
},
4343
{
4444
extension: 'webp',
4545
externalUrl: 'https://next-export-optimize-images.vercel.app/sub-path/og.png',
4646
output: '/_next/static/chunks/images/sub-path/og_3840_75.webp',
4747
quality: 75,
48-
src: '/_next/static/media/8fcb025d6e036ec05907f2367ee713067a0c406c.png',
48+
src: '/_next/static/media/-803215824.png',
4949
width: 3840,
5050
},
5151
])

src/image.tsx

+17-11
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
/* eslint-disable @typescript-eslint/no-var-requires */
2-
import { createHash } from 'crypto'
3-
42
import Image, { ImageLoader, ImageProps } from 'next/dist/client/image'
53
import React from 'react'
64

@@ -10,6 +8,16 @@ import getConfig, { ParsedImageInfo } from './utils/getConfig'
108

119
const config = getConfig()
1210

11+
function hashCode(src: string) {
12+
let hash = 0
13+
for (let i = 0; i < src.length; i += 1) {
14+
const chr = src.charCodeAt(i)
15+
hash = (hash << 5) - hash + chr
16+
hash |= 0 // Convert to 32bit integer
17+
}
18+
return `${hash}`
19+
}
20+
1321
const defaultImageParser: (src: string) => ParsedImageInfo = (src: string) => {
1422
const path = src.split(/\.([^.]*$)/)[0]
1523
const extension = (src.split(/\.([^.]*$)/)[1] || '').split('?')[0]
@@ -86,15 +94,13 @@ const exportableLoader: ImageLoader = ({ src: _src, width, quality }) => {
8694
const path = require('path') as typeof import('path')
8795

8896
if (src.startsWith('http')) {
89-
json.src = `/${externalOutputDir}/${createHash('sha1')
90-
.update(
91-
src
92-
.replace(/^https?:\/\//, '')
93-
.split('/')
94-
.slice(1)
95-
.join('/')
96-
)
97-
.digest('hex')}.${originalExtension}`
97+
json.src = `/${externalOutputDir}/${hashCode(
98+
src
99+
.replace(/^https?:\/\//, '')
100+
.split('/')
101+
.slice(1)
102+
.join('/')
103+
)}.${originalExtension}`
98104

99105
json.externalUrl = src
100106
}

0 commit comments

Comments
 (0)