POST 与 Postman 一起工作，但不是通过 JavaScript 中的 fetch答案

【问题标题】：POST working with Postman but not via fetch in JavaScriptPOST 与 Postman 一起工作，但不是通过 JavaScript 中的 fetch
【发布时间】：2019-07-16 12:59:56
【问题描述】：

当在“body”部分填写适当的参数时，对 Django Rest API 框架的发布请求通过 Postman 工作。但同样不适用于以下 JavaScript 代码：

var data = {emp_id:50,emp_name:'test',password:'pass123'};   
fetch('http://127.0.0.1:8000/signup/',{
    method:"POST",
    body: JSON.stringify(data),
    mode:"no-cors",
     headers: {
                "Content-Type": "application/json",
                // "Content-Type": "application/x-www-form-urlencoded",
            },
    })
    .then(response => response.json());

下面是REST-API的views.py中处理POST请求的def：

@api_view(['GET', 'POST', ])
def signup(request):
    serializer = employeeSerializer(data=request.data)
    if serializer.is_valid():
        serializer.save()
        return Response(serializer.data, status=status.HTTP_201_CREATED)
    else:
        return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST)

我是新手，谁能告诉我为什么 JavaScript 代码不起作用？

编辑：浏览器控制台显示的错误是：

POST http://127.0.0.1:8000/signup/ 415 (Unsupported Media Type)

【问题讨论】：

结果如何？如果有的话，你在开发者工具中看到了什么错误信息？
您不需要另一个.then 调用来处理JSON 响应吗？
“谁能告诉我为什么 JavaScript 代码不能工作？” - 你的浏览器控制台很可能可以，所以去那里检查一下。可能会指出您有 CORS 问题，因此请阅读该关键字，如果它对您来说是新闻。
@skyboyer，出现错误信息：415（不支持的媒体类型）

标签： javascript django-rest-framework fetch

【解决方案1】：

问题在于，通过使用no-cors 模式，您将自己限制为使用simple requests，而这又不能具有application/x-www-form-urlencoded、multipart/form-data 或text/plain 以外的内容类型。事实上，如果您查看浏览器随请求发送的标头，您会看到内容类型从 application/json 更改为 text/plain - 因此出现错误。

要解决您的问题：删除 no-cors 模式并将 cors 标头添加到您的 django 应用程序的响应中。你可以使用django-cors-headers。

另外，邮递员没有问题，因为它不关心same-origin policy。

【讨论】：

【解决方案2】：

尝试将标题更改为

headers: { 
    'Accept': 'application/json',
    'Content-Type': 'application/json' 
}

accept header 用于确定在响应中将数据发送回客户端的格式，猜测可能需要它

【讨论】：

【解决方案3】：

我在这里找到了解决方案：https://learning.postman.com/docs/sending-requests/generate-code-snippets/#generating-code-snippets-in-postman

使用邮递员，您可以看到以多种语言（Node Axios、javascript fetch ...）在请求中发送的标头代码，然后只需将标头和邮递员发送的所有数据复制粘贴到您的应用程序

【讨论】：

虽然此链接可能会回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，仅链接答案可能会失效。 - From Review