Archived course lesson

Add Banned Mutation Check

Part of Frontend Serverless with React and GraphQL

Objective: Create a function that will block unauthorized mutation types from being executed in the GraphCMS server.

We need to write a function that will search the incoming graphQL query for any of the banned mutation types. These include deleteMany, updateMany, or publishMany*. An easy way to do this, is create a function that searches for a substring using regular expression matching. If it finds a match then it throws an error which immediately stops the proxy request before it can fire off its request to the GraphCMS backend.

import * as _ from 'lodash';

export const verifyNotABannedMutation = async (req, res) => {
  const isBannedMutation = req.body.query.match(
    /deleteMany|updateMany|publishMany/g,
  );

  if (!_.isNil(isBannedMutation)) {
    throw new Error('Invalid Mutation Requested');
  }
};

Now we can just call the verifyNotABannedMutation function from the graphql api endpoint:

import getConfig from 'next/config';
import { GraphQLClient } from 'graphql-request';
import { verifyNotABannedMutation } from '../../utils/verify';

const { serverRuntimeConfig } = getConfig();

const {
  BRANCH,
  GRAPHCMSURL,
  GRAPHCMSPROJECTID,
  GRAPHCMS_TOKEN,
} = serverRuntimeConfig.graphcms;

const graphqlEndpoint = `${GRAPHCMSURL}/${GRAPHCMSPROJECTID}/${BRANCH}`;

export const graphQLClient = new GraphQLClient(graphqlEndpoint, {
  headers: {
    authorization: `Bearer ${GRAPHCMS_TOKEN}`,
  },
});

async function proxyGraphql(req, res) {
  try {
    await verifyNotABannedMutation(req, res);
    const { variables, query } = req.body;
    const data = await graphQLClient.rawRequest(query, variables);
    res.json(data);
  } catch (e) {
    res.json({ data: {}, errors: [{ message: e.message }] });
  }
}

export default proxyGraphql;