Problem with JSON strings format in the swagger UI generated docs

[joaopfg]

First Check

• I added a very descriptive title to this issue.
• I used the GitHub search to find a similar issue and didn't find it.
• I searched the FastAPI documentation, with the integrated search.
• I already searched in Google "How to X in FastAPI" and didn't find any information.
• I already read and followed all the tutorial in the docs and didn't find an answer.
• I already checked if it is not related to FastAPI but to Pydantic.
• I already checked if it is not related to FastAPI but to Swagger UI.
• I already checked if it is not related to FastAPI but to ReDoc.

Commit to Help

• I commit to help with one of those options 👆

Example Code

from fastapi import FastAPI
from pydantic import BaseModel

class Model(BaseModel):
    json_field: str

app = FastAPI()

#A simple storage, just to illustrate
database = []

@app.post("/")
def create_entry(data: Model):
    database.append(data)
    return data

Description

Suppose that in my post request I want to inject data that follows a pydantic model in which one of the fields is a json string (see the example code).

In the Swagger UI generated docs, if I want to pass a json that represents a dictionnary I'm obliged to pass the json string field in the format "{'key1': value1, 'key2': value2, ...}".

If I request the database from javascript, for example, and I try to parse the json using JSON.parse, I will get the following error:

SyntaxError: Unexpected token ' in JSON at position 1

because this javascript method supposes that all internal quotes in the json are double quotes.

It's not a serious issue for me, because I can correct the problem by doing the post request through python. But it would be handy for tests if the post request through Swagger UI supported a json string in the format '{"key1": value1, "key2": value2, ...}'.

Is it achievable through FastAPI ? Or is it a Swagger UI issue ? I'm a bit lost

Operating System

Linux

Operating System Details

No response

FastAPI Version

0.73.0

Python Version

3.9.5

Additional Context

No response

[AlrasheedA]

Hi @joaopfg, I don't believe this is either FastAPI nor a Swagger UI issue. Double quotes are required for JSON string values, and if you have other quotes inside, you can escape them like this:

"{\"key1\": \"value1\", \"key2\": \"value2\"}"

And after you get the escaped response in JS, you would have to parse it twice. Though honestly, this is unusual behavior; why not just pass regular JSON object instead of a string? Then process it, and store it however you like.

[joaopfg]

@AlrasheedA Hello, in python for example, we can write strings like '{“key1”: value, ...}’. It seems weird for me that SwaggerUI can't consider this format as valid for a string. Do you know where this parsing is happening in Swagger UI code ? I will try to find it.

Yes, I could use a JSON object instead of a string. The problem is that the ORM I'm using doesn't provide one (at least not explicitly). That's why I'm using a string field to represent a json. So far, it didn't give me problems.

[joaopfg]

@AlrasheedA After some research, I believe the issue is deeper and actually related to the JSON grammar itself (from ECMAScript specs).

When a text is put in the Swagger UI Request body field and the Execute button is pressed, the internal js script will first call JSON.parse on the text string and, as you know, this method only accept strings with double quotes in the first level. So, if the text is:

{"key1": "value1", "key2": "{'key3': 1, 'key4': 2}"}

It's ok.

While if it's:

{"key1": "value1", "key2": '{"key3": 1, "key4": 2}'}

It's not ok.

However, the return of JSON.parse on the accepted string will be a js object like:

{key1: "value1", key2: "{'key1': 1, 'key2': 2}"}

which is interpreted by python as the following dict inside the API endpoint function:

{"key1": "value1", "key2": "{'key1': 1, 'key2': 2}"}

When I request the API from js, this dict is interpreted as the previous object again:

{key1: "value1", key2: "{'key1': 1, 'key2': 2}"}

Now if I try to call JSON.parse on the value corresponding to key2 on the js object, it will fail because the internal string "{'key1': 1, 'key2': 2}" has single quotes on the first level.

Summarizing, it seems there is no code to blame :) The real reason is this ECMAScript JSON grammar rule that says that the first level of a JSON object can only have double quotes. I don't know why this spec is like that. I couldn't find any explanation by googling. I believe the people who wrote this grammar might have deeper reasons. I would be interested to know these reasons.