Unrecognized response type - application/pdf displayed incorrectly in response body

Q&A

• Method of installation: dist
• Swagger-UI version: e.g. 3.23.0
• Swagger/OpenAPI version: OpenAPI 3.0

Content & configuration

Swagger/OpenAPI definition:

  /pdf/{date}/lunch.pdf:
    get:
      tags:
        - PDF
      summary: Mittagessen als PDF (Woche)
      parameters:
        - name: date
          in: path
          description: YYYY-MM-DD
          required: true
          schema:
            type: string
      responses:
        '200':
          description: OK
          headers:
            Content-Disposition:
              schema:
                type: string
                example: filename=\lunch.pdf\
          content:
            application/pdf:
              schema:
                type: string
                format: binary
              example: PDF-Datei

Describe the bug you’re encountering

When you are calling an API in the try it out-section which returns an PDF-File the response body is not able to render the file or present it in a readable format. Instead you get the following message: Unrecognized response type; displaying content as text. - even if the correct content type is passed in the response header. Additionally the binary data will be displayed in the response body.

To reproduce…

Steps to reproduce the behavior: In Swagger-UI

1. Navigate to the specific path
2. Click on ‘Try it out’
3. ‘Execute’
4. Inspect Response body

Expected behavior

The PDF should be rendered as an typical pdf file in the swagger-ui or you should provide a download link to extract the file.

Screenshots

HTTP Request-Response Swagger-UI Display

Additional context or thoughts

Unfortunatly i cannot provide a running API which returns a valid PDF-File to debugging this issue Whenever you run the command curl -X GET "http://server.de/menupdfservice/api/pdf/pdf/2019-07-26/lunch.pdf" -H "accept: application/json which the Swagger-UI is calling outside of Swagger-UI you get the binary data as well. But when you try to merge this data with curl -X GET "http://server.de/menupdfservice/api/pdf/pdf/2019-07-26/lunch.pdf" -H "accept: application/json --output lunch.pdf in a spefic file with extension you get a properly working PDF-file

[Pzixel]

In the end it worked when I added headers to the response:

res.setHeader('Content-Type', 'application/pdf');
res.setHeader('Content-Disposition', 'attachment; filename=labels.pdf');

[admalledd]

I don’t have the tooling on-hand right now, but I wonder if it makes sense to extend the if-statement here to include /^application\/octet-stream/i.test(contentType) || /^application\/pdf/i.test(contentType) ...? response-body.jsx#L61

I have a situation where we need to prefer the user/browsers view the PDFs instead of directly downloading first. So having the header read content-disposition: inline; filename=SomeFile.pdf vs attachment is what we need. note that content-disposition: attachment; filename=SomeFile.pdf doesn’t complain about the “Unrecognized Response Type” because it short-circuits into the “if” as an attachment/download.

A more-correct solution would be somehow in the “else” side of the statement where it checks for json, xml, images, etc, to check for PDF and do a inline-viewer magic (pdf.js? no preference from me, just “something”)