Django中fetch() POST数据失败，如何获取数据并存入SQLite？

1. 修复CSRF令牌验证问题 #

你遇到的403错误核心原因是CSRF令牌传递方式不符合Django要求——虽然你把csrfmiddlewaretoken放进了JSON数据里，但Django默认只会从POST表单数据或者请求头X-CSRFToken中读取令牌，不会解析JSON里的令牌。

修改你的record_order()函数：

function record_order() {
    // 从页面cookie中提取CSRF令牌（Django自动设置的csrftoken cookie）
    function getCookie(name) {
        let cookieValue = null;
        if (document.cookie && document.cookie !== '') {
            const cookies = document.cookie.split(';');
            for (let i = 0; i < cookies.length; i++) {
                const cookie = cookies[i].trim();
                if (cookie.substring(0, name.length + 1) === (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
    const csrftoken = getCookie('csrftoken');

    fetch('http://localhost:8000/', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRFToken': csrftoken  // 关键：把CSRF令牌放到请求头里
        },
        body: JSON.stringify({a: 1, b: "vb"})  // 用JSON.stringify生成标准JSON格式，避免解析失败
    })
    .then(response => response.json())
    .catch(error => console.error('请求错误:', error));
}

注意：原始的{a:1, b:"vb"}是非标准JSON（键名未加双引号），会直接导致解析失败，必须用JSON.stringify()处理成标准格式。

2. 后端视图正确获取JSON数据 #

Django的request.POST只处理表单编码的请求体，对于JSON格式的请求，需要从request.body中读取并手动解析：

类视图示例 #

from django.http import JsonResponse
from django.views import View
import json
from .models import YourModel  # 替换成你的模型类

class MainView(View):
    def get(self, request):
        # 你的GET请求逻辑，比如渲染页面
        return render(request, 'your_template.html')

    def post(self, request):
        # 解析JSON请求体
        try:
            data = json.loads(request.body)
            print("获取到的JSON数据:", data)  # 这里就能拿到{a:1, b:"vb"}
        except json.JSONDecodeError:
            return JsonResponse({'status': 'error', 'msg': 'JSON格式错误'}, status=400)
        
        # 将数据存入SQLite数据库
        try:
            YourModel.objects.create(
                field_a=data.get('a'),
                field_b=data.get('b')
                # 替换成你模型对应的字段名
            )
            return JsonResponse({'status': 'success'})
        except Exception as e:
            return JsonResponse({'status': 'error', 'msg': str(e)}, status=500)

函数视图示例 #

from django.http import JsonResponse
import json
from .models import YourModel

def main_view(request):
    if request.method == 'GET':
        return render(request, 'your_template.html')
    elif request.method == 'POST':
        try:
            data = json.loads(request.body)
        except json.JSONDecodeError:
            return JsonResponse({'status': 'error', 'msg': 'JSON格式错误'}, status=400)
        
        try:
            YourModel.objects.create(field_a=data['a'], field_b=data['b'])
            return JsonResponse({'status': 'success'})
        except Exception as e:
            return JsonResponse({'status': 'error', 'msg': str(e)}, status=500)

3. 模型类示例（如果未创建） #

确保你的模型字段和要存储的数据对应，比如：

from django.db import models

class YourModel(models.Model):
    field_a = models.IntegerField()
    field_b = models.CharField(max_length=100)

    def __str__(self):
        return f"{self.field_a} - {self.field_b}"

创建模型后执行迁移命令，将表结构同步到SQLite：

python manage.py makemigrations
python manage.py migrate

排查要点 #

• 确认浏览器csrftoken cookie存在：在开发者工具的Application标签里查看Cookies
• 确保请求头的Content-Type是application/json，否则Django不会识别为JSON请求
• 检查Django的MIDDLEWARE配置中是否包含django.middleware.csrf.CsrfViewMiddleware（默认开启）

内容的提问来源于stack exchange，提问作者Elyar Abade Pur