| Package | Affected versions | Patched versions |
|---|---|---|
| graphql-playground-html | < 1.6.22 | 1.6.22 |
| graphql-playground-middleware-express | < 1.7.16 | 1.7.16 |
| graphql-playground-middleware-hapi | < 1.6.13 | 1.6.13 |
| graphql-playground-middleware-koa | < 1.6.15 | 1.6.15 |
| graphql-playground-middleware-lambda | < 1.7.17 | 1.7.17 |
| graphql-playground-html | < 1.6.22 | 1.6.22 |
directly impacted:
graphql-playground-html@<1.6.22 - all unsanitized user input for renderPlaygroundPage()all of our consuming packages of graphql-playground-html are impacted:
graphql-playground-middleware-express@<1.7.16 - unsanitized user input to expressPlayground()graphql-playground-middleware-koa@<1.6.15 - unsanitized user input to koaPlayground()graphql-playground-middleware-lambda@<1.7.17 - unsanitized user input to lambdaPlayground()graphql-playground-middleware-hapi@<1.6.13 - unsanitized user input to hapiPlayground()as well as any other packages that use these methods with unsanitized user input.
not impacted:
graphql-playground-electron - uses renderPlaygroundPage() statically for a webpack build for electron bundle, no dynamic user inputgraphql-playground-react - usage of the component directly in a react application does not expose reflected XSS vulnerabilities. only the demo in public/ contains the vulnerability, because it uses an old version of the html pacakge.upgrading to the above mentioned versions will solve the issue.
If you're using graphql-playground-html directly, then:
yarn add graphql-playground-html@^1.6.22
or
npm install --save graphql-playground-html@^1.6.22
Then, similar steps need to be taken for each middleware:
Running one of these products? Scan your site to see whether it exposes a vulnerable version.
Scan my site freeEnsure you properly sanitize all user input for options you use for whatever function to initialize GraphQLPlayground:
for example, with graphql-playground-html and express:
const { sanitizeUrl } = require('@braintree/sanitize-url');
const qs = require('querystringify');
const { renderPlaygroundPage } = require('graphql-playground-html');
module.exports = (req, res, next) => {
const { endpoint } = qs.parse(req.url)
res.html(renderPlaygroundPage({endpoint: sanitizeUrl(endpoint) })).status(200)
next()
}
or, with graphql-playground-express:
const { expressPlayground } = require('graphql-playground-middleware-express');
const { sanitizeUrl } = require('@braintree/sanitize-url');
const qs = require('querystringify');
const { renderPlaygroundPage } = require('graphql-playground-html');
module.exports = (req, res, next) => {
const { endpoint } = qs.parse(req.url)
res.html(expressPlayground({endpoint: sanitizeUrl(endpoint) })).status(200)
next()
}
Masato Kinugawa of Cure53
If you have any questions or comments about this advisory: