Why does Swagger Editor show "undefined" headers for an operation with a custom header?

Question

I'm using the online Swagger Editor (http://editor.swagger.io) and the heroku-pets.yaml example. I changed the GET / operation to introduce a custom header token:

paths:
  /:
    get:
      parameters:
        - name: limit
          in: query
          description: number of pets to return
          type: integer
          default: 11
          minimum: 11
          maximum: 10000
        - name: token
          in: header
          description: token
          type: string

But when I do "Try it out", there's an error "ERROR Server not found or an error occurred", and the "Headers" say undefined.

Any idea what might be wrong and how to fix it?

Answer 1

Requests sent directly from the browser via Ajax are subject to the CORS (cross-origin request sharing) rules. As part of that, the target server can specify which HTTP headers are allowed in a request. In your case, the target host petstore-api.herokuapp.com only allows the Content-Type header for requests to /pet, which can be seen by doing a preflight OPTIONS request:

> curl -X OPTIONS http://petstore-api.herokuapp.com/pet

HTTP/1.1 200 OK
Server: Cowboy
Connection: keep-alive
X-Powered-By: Express
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET,PUT,POST,DELETE
Access-Control-Allow-Headers: Content-Type     <-------------
Allow: GET,POST,PUT,GET
Content-Type: text/html; charset=utf-8
...

That's why you get the error when trying to use a custom header.

To test custom headers, you'll need a test server that can accept custom headers. One such server is the awesome http://httpbin.org which will echo the data sent in the request. So you could use something like this:

swagger: '2.0'
info:
  title: test
  version: '1.0'
host: httpbin.org
schemes: [http, https]
produces:
  - application/json
paths:
  /get:
    get:
      summary: Returns GET data
      parameters:
        - name: token
          in: header
          type: string
      responses:
        200:
          description: OK