无效的JSON在'操作'多部分字段的formData在下一个js应用程序?

Question

我有一个这样的突变-

mutation signUp($avatar: Upload!) {
signUp(
avatar: $avatar
input: { 
name: "Siam Ahnaf"
email: "[e-mail]"
password: "12345678" }
) {
message
token
}
}

为此，我从下一个js应用程序发送了一个请求，像这样-

var formData = new FormData();
formData.append('operations', '{ "query": "mutation($file: Upload!) {signUp(avatar: $file, input: {name: "Siam Ahnaf", email: "[e-mail]", password: "siam1980"}){message, token}}", "variables": { "file": null } }');
formData.append('map', '{ "0": ["variables.file"] }');
formData.append('0', Image);
await axios({
url: "http://localhost:3001/graphql",
method: "post",
data: formData,
Headers: {
'Accept': 'application/json'
}
})
.then(response => console.log(response))
.catch(error => console.log(error));

现在我得到错误像-无效JSON在'操作'多部分字段

但是我不明白我在'operation' json中的错误。请帮帮我。

提前谢谢。

Answer 1

我从一个几乎重复的问题中复制了我的答案，以防那个问题被关闭:

如果你有引号里面的引号，并且你想在上面运行JSON.parse，你必须转义它们(就像其他人提到的那样)。但是，在后续副本中，不能只转义引号。你必须对它们进行双或三转义。

解释如下:

'{ "query": "mutation($file: Upload!) {signUp(avatar: $file, input: {name: "Siam Ahnaf", email: "[e-mail]", password: "siam1980"}){message, token}}", "variables": { "file": null } }'

当它被JavaScript解析时(因为它在单引号内)，它接受"并意识到您试图转义它们(不必要的，因为它不是单引号)，所以它将其转换为"。现在解析器看到引号(转义)中的值:

{ "query": "mutation($file: Upload!) {signUp(avatar: $file, input: {name: "Siam Ahnaf", email: "[e-mail]", password: "siam1980"}){message, token}}", "variables": { "file": null } }

如您所见，语法高亮显示在中途改变了颜色，因为引号已经转义了。

要得到想要的输出，你必须让FIRST字符串处理以反斜杠结束，所以你也必须转义反斜杠:

'{ "query": "mutation($file: Upload!) {signUp(avatar: $file, input: {name: \"Siam Ahnaf\", email: \"[e-mail]\", password: \"siam198\"}){message, token}}", "variables": { "file": null } }'

现在的问题是你需要两个反斜杠还是三个。这里的答案是，因为你的OUTER字符串使用单引号，你不需要也转义里面的双引号，所以你只需要两个反斜杠为每一个你想要保留的双引号。如果外部字符串使用双引号，则必须使用三倍转义而不是双引号，否则引号也不会被转义，并且原始字符串将无效。

经验法则:如果你试图转义与字符串中使用的引号类型相同，则使用三重转义。如果您试图转义不同的类型，请使用双转义。