fix(next/image): improve query string validation for integers (#67293)
The Image Optimization API currently uses `parseInt()` for `w` and `q` query string parameters. This doesn't handle floats as you might expect and instead coerces, for example `parseInt('99.9') === 99`. This PR changes the runtime to match the build time validation and only accept integers for `w` and `q`.
This commit is contained in:
parent
2fceb5b1aa
commit
78dc2db916
2 changed files with 36 additions and 9 deletions
|
@ -242,19 +242,28 @@ export class ImageOptimizerCache {
|
||||||
return { errorMessage: '"w" parameter (width) is required' }
|
return { errorMessage: '"w" parameter (width) is required' }
|
||||||
} else if (Array.isArray(w)) {
|
} else if (Array.isArray(w)) {
|
||||||
return { errorMessage: '"w" parameter (width) cannot be an array' }
|
return { errorMessage: '"w" parameter (width) cannot be an array' }
|
||||||
|
} else if (!/^[0-9]+$/.test(w)) {
|
||||||
|
return {
|
||||||
|
errorMessage: '"w" parameter (width) must be an integer greater than 0',
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!q) {
|
if (!q) {
|
||||||
return { errorMessage: '"q" parameter (quality) is required' }
|
return { errorMessage: '"q" parameter (quality) is required' }
|
||||||
} else if (Array.isArray(q)) {
|
} else if (Array.isArray(q)) {
|
||||||
return { errorMessage: '"q" parameter (quality) cannot be an array' }
|
return { errorMessage: '"q" parameter (quality) cannot be an array' }
|
||||||
|
} else if (!/^[0-9]+$/.test(q)) {
|
||||||
|
return {
|
||||||
|
errorMessage:
|
||||||
|
'"q" parameter (quality) must be an integer between 1 and 100',
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const width = parseInt(w, 10)
|
const width = parseInt(w, 10)
|
||||||
|
|
||||||
if (width <= 0 || isNaN(width)) {
|
if (width <= 0 || isNaN(width)) {
|
||||||
return {
|
return {
|
||||||
errorMessage: '"w" parameter (width) must be a number greater than 0',
|
errorMessage: '"w" parameter (width) must be an integer greater than 0',
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -273,12 +282,12 @@ export class ImageOptimizerCache {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const quality = parseInt(q)
|
const quality = parseInt(q, 10)
|
||||||
|
|
||||||
if (isNaN(quality) || quality < 1 || quality > 100) {
|
if (isNaN(quality) || quality < 1 || quality > 100) {
|
||||||
return {
|
return {
|
||||||
errorMessage:
|
errorMessage:
|
||||||
'"q" parameter (quality) must be a number between 1 and 100',
|
'"q" parameter (quality) must be an integer between 1 and 100',
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -506,7 +506,7 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"q" parameter (quality) must be a number between 1 and 100`
|
`"q" parameter (quality) must be an integer between 1 and 100`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -515,7 +515,7 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"q" parameter (quality) must be a number between 1 and 100`
|
`"q" parameter (quality) must be an integer between 1 and 100`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -524,7 +524,7 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"w" parameter (width) must be a number greater than 0`
|
`"w" parameter (width) must be an integer greater than 0`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -533,7 +533,7 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"w" parameter (width) must be a number greater than 0`
|
`"w" parameter (width) must be an integer greater than 0`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -542,7 +542,16 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"w" parameter (width) must be a number greater than 0`
|
`"w" parameter (width) must be an integer greater than 0`
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should fail when w is not an integer', async () => {
|
||||||
|
const query = { url: '/test.png', w: 99.9, q: 100 }
|
||||||
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
|
expect(res.status).toBe(400)
|
||||||
|
expect(await res.text()).toBe(
|
||||||
|
`"w" parameter (width) must be an integer greater than 0`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -551,7 +560,16 @@ export function runTests(ctx: RunTestsCtx) {
|
||||||
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
expect(res.status).toBe(400)
|
expect(res.status).toBe(400)
|
||||||
expect(await res.text()).toBe(
|
expect(await res.text()).toBe(
|
||||||
`"q" parameter (quality) must be a number between 1 and 100`
|
`"q" parameter (quality) must be an integer between 1 and 100`
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should fail when q is not an integer', async () => {
|
||||||
|
const query = { url: '/test.png', w: ctx.w, q: 99.9 }
|
||||||
|
const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
|
||||||
|
expect(res.status).toBe(400)
|
||||||
|
expect(await res.text()).toBe(
|
||||||
|
`"q" parameter (quality) must be an integer between 1 and 100`
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue