«Слишком большой размер заголовка» при попытке отобразить диаграмму JSON, переданную из серверной части Python во внешний интерфейс JS.
Как указано в заголовке, я создаю панель инструментов с полным стеком, в которой я выполняю некоторый анализ данных Python, а затем визуализирую с помощью Altair на серверной части, а затем разрабатываю панель инструментов с помощью React на интерфейсе. Очевидно, я хотел бы, чтобы те же самые графики отображались на интерфейсе.
Создать диаграмму, а затем передать связанный JSON во внешний интерфейс довольно просто. Я просто определяю маршрут в Python, а затем создаю функцию, которая возвращает диаграмму:
chart = altair.Chart(XXX)
chartJson = chart.to_json()
chartFile= json.dumps(chartJson)
Во внешнем интерфейсе я использую Axios для получения JSON диаграммы, а затем сохраняю его, устанавливая его как переменную в хуке useState. Затем я могу получить доступ к переменной и распечатать ее без проблем. Даже во внешнем интерфейсе он выглядит правильно спроектированным как объект JSON.
const [chart, setChart] = useState("");
Проблема в том, что когда я пытаюсь отобразить диаграмму с помощью react-Vega, используя следующий условный рендеринг:
{chart ? "<"Vega spec={chart} /">" : ""}
Я получаю следующую ошибку:
ERR_ABORTED 431 (Request Header Fields Too Large)
Это не имеет для меня смысла, так как я уже успешно передал JSON-файл диаграммы во внешний интерфейс? Когда я изучаю JSON, он выглядит нормально. На самом деле, если я скопирую его точно из моей консоли devtools и вставлю в новый интерфейсный компонент React с помощью приведенной выше команды Vega, он отобразится просто отлично. Таким образом, это, кажется, в правильном формате.
Я попытался использовать Fetch для доступа к файлу JSON, и все равно была та же ошибка. Я также попробовал json.stringify() в файле, но это также не имело значения.
Кто-нибудь еще сталкивался с этой проблемой раньше или может помочь мне с этим? Заранее спасибо,