title: Authenticating AppSync mutation using AWS Cognito User pool on Graphql playground
body: <p>A very basic scenario where I want to test an AppSync mutation on Graphql playground which was working fine with API key authentication.</p>
  
  <p>I have attached an additional authorization provider besides the API key authentication.</p>
  
  <p><a href="https://i.stack.imgur.com/Rv7ye.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Rv7ye.png" alt="screenshot for additional authorization"></a></p>
  
  <p>Mutation:</p>
  
  <pre><code>type Mutation {
    createPitch(gameID: ID!, pitchID: Int!, pitchEvent: PitchInput!): Pitch
      @aws_api_key
    predictPitch(userID: String!, gamePitchID: String!, prediction: PredictionInput): Prediction
      @aws_cognito_user_pools
  }
  </code></pre>
  
  <p>Invoking <code>predictPitch</code> mutation on graphql playground:</p>
  
  <pre><code>mutation PredictPitch($prediction:PredictionInput) {
    predictPitch(userID: "12345", gamePitchID: "29fb2xx-xxxxx-xxxxx-1", 
    prediction: $prediction ) {
      gameID
      gamePitchID
    }
  }
  </code></pre>
  
  <p>query variables:</p>
  
  <pre><code>{
    "prediction": {
      "gameID": "29",
      "hitterGuess": "Miss",
      "pitcherGuess": "Fastball"
    }
  }
  </code></pre>
  
  <p>Headers:</p>
  
  <pre><code>
  {
    "X-API-KEY": "da2-o6fs2lq47vbehexxxxxxxx",
    "Authorization": "Bearer xxxx-the-pretty-long-jwt-token-from-cognito login"
  }
  </code></pre>
  
  <p>I have tried <code>Authorization</code> header alone and in conjunction with <code>x-api-key</code>.
  Nothing worked so far. I am pretty sure I am missing a very tiny bit. </p>
  
  <pre><code>{
    "error": {
      "errors": [
        {
          "errorType": "UnauthorizedException",
          "message": "Valid authorization header not provided."
        }
      ]
    }
  }
  
  </code></pre>
  
  <p><strong>NOTE:</strong> The JWT token <code>AccessToken</code> is generated via aws-cli 
  <code>aws cognito-idp admin-initiate-auth</code>.</p>