QID 980213
QID 980213: Nodejs (npm) Security Update for graphql-playground-html (GHSA-4852-vrh7-28rf)
Security update has been released for graphql-playground-html to fix the vulnerability.
Note: The preceding description block is extracted directly from the security advisory. Using automation, we have attempted to clean and format it as much as possible without introducing additional issues.
**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 input
- `graphql-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.
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:
- [Upgrade Express Middleware](https://www.npmjs.com/package/graphql-playground-middleware-express#security-upgrade-steps)
- [Upgrade Koa Middleware](https://www.npmjs.com/package/graphql-playground-middleware-koa#security-upgrade-steps)
- [Upgrade Lambda Middleware](https://www.npmjs.com/package/graphql-playground-middleware-lambda#security-upgrade-steps)
- [Upgrade Hapi Middleware](https://www.npmjs.com/package/graphql-playground-middleware-hapi#security-upgrade-steps)Workaround:
Ensure you properly sanitize *all* user input for options you use for whatever function to initialize GraphQLPlayground:
for example, with `graphql-playground-html` and express:
```js
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`:
```js
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()
}
```
- GHSA-4852-vrh7-28rf -
github.com/advisories/GHSA-4852-vrh7-28rf
CVEs related to QID 980213
| Advisory ID | Software | Component | Link |
|---|---|---|---|
| GHSA-4852-vrh7-28rf | graphql-playground-html |
github.com/advisories/GHSA-4852-vrh7-28rf |