Сохранение холста fabri.js в базе данных postgres

Я пытаюсь сохранить мой холст и некоторые другие данные в моей базе данных postgres. В React frontend я создал интерфейс и метод для отправки данных в Django backend. Проблема, с которой я столкнулся, заключается в том, что я всегда получаю следующее сообщение от сервера: {sucess: false, error: "Canvas() получил неожиданные аргументы ключевого слова: 'data'"} error: "Canvas() получил неожиданные аргументы ключевого слова: 'data'" успех: false

Вот мой код frontedn:

import { Button } from "@mui/material";
import fabric from "fabric/fabric-impl";
import { saveCanvasData } from "../api/CanvasApi";
import { Canvas } from "../model/Canvas";

export const SaveCanvasButton = ({
  fabricRef,
}: {
  fabricRef: React.MutableRefObject<fabric.Canvas | null>;
}) => {
  const handleClick = () => {
    const jsonCanvas = JSON.stringify(fabricRef.current?.toJSON());

    const canvasData: Canvas = {
      aedate: new Date(),
      aeuser: "test",
      data: jsonCanvas,
      edate: new Date(),
      euser: "test",
      pid: "test",
    };

    console.log(canvasData);
    if (canvasData) {
      saveCanvasData(canvasData);
    }
  };

  return (
    <Button onClick={handleClick} color="inherit">
      Canvas Speichern
    </Button>
  );
};

Код бэкенда:

from django.db import models
from django.core.validators import RegexValidator

# Validierung des Inputs gem. Datenmodell mit regulären Ausdrücken
ID_validator = RegexValidator(
    regex=r"^\d{0,7}[1-9]$",
    message="Die ID muss eine Länge von 8 haben und darf nicht mit Null beginnen.",
    code="invalid_id",
)


class Canvas(models.Model):
    # CID = models.CharField(max_length=8, unique=True, verbose_name="Canvas ID", validators=[ID_validator])  Wird nicht mehr benötigt, da automatisch erzeugt
    PID = models.CharField(
        max_length=8, verbose_name="Projekt ID", validators=[ID_validator]
    )
    EDATE = models.DateTimeField(verbose_name="Erstellungsdatum")
    EUSER = models.CharField(
        max_length=8, verbose_name="Ersteller ID", validators=[ID_validator]
    )
    AEDATE = models.DateTimeField(verbose_name="Aenderungsdatum")
    AEUSER = models.CharField(
        max_length=8, verbose_name="Bearbeiter ID", validators=[ID_validator]
    )
    Data = (
        models.JSONField(default=None, blank=True, null=True, verbose_name="Canvas Daten")
    )  # ist im prinzip alles was in dem canvas gespeichert wird als json gespeichert, alle objekte in einem array

Интерфейс для CanvasData:

export interface Canvas {
  aedate: Date;
  aeuser: string;
  data: string;
  edate: Date;
  euser: string;
  pid: string;
}

Я уже пробовал менять тип на string и jsonfield. Это уже сработало, когда был только атрибут jsonfield:

import { Button } from "@mui/material";
import fabric from "fabric/fabric-impl";
import { saveCanvasData } from "../api/CanvasApi";

export const SaveCanvasButton = ({
  canvasRef,
  fabricRef,
}: {
  canvasRef: React.MutableRefObject<HTMLCanvasElement | null>;
  fabricRef: React.MutableRefObject<fabric.Canvas | null>;
}) => {
  const handleClick = () => {
    const canvasData = JSON.stringify(fabricRef.current?.toJSON());

    console.log(canvasData);
    if (canvasData) {
      saveCanvasData(canvasData);
    }
  };

  return <Button onClick={handleClick}>Canvas speichern</Button>;
};

Вернуться на верх