Экспорт отчета в формате PDF с диаграммами из Node/Express/Angular/PhantomJS

Question

Я использую AngularJS в стеке MEAN на основе генератора DaftMonk (https://github.com/DaftMonk/generator-angular-fullstack). Я довольно новичок во всем, что угодно: Angular/JS/Node (и stackoverflow, поэтому, пожалуйста, не стесняйтесь указывать, нужно ли мне переформулировать мой вопрос!).

Я собираюсь создать многостраничный PDF-отчет для пользователя с Угловой страницы, содержащей шесть графиков, изображений и текста.

Существует ряд вопросов о stackoverflow и Google, которые относятся к потенциальным решениям для этого, но, проверив их исчерпывающе, они не помогают с тем, что мне нужно достичь (или я не понимаю, как я могу их использовать в мой сценарий ..).

В настоящее время, когда пользователь переходит на страницу отчета, HTTP-запрос отправляется в узел/экспресс с помощью углового контроллера, который проверяет идентификатор пользователя/группы пользователей, запрашивает базу данных, анализирует данные и отправляет их назад к браузеру для рендеринга в графики (в настоящее время используется угловой график и флот).

Пользователь выбирает тип графика и может выбрать максимум шесть графиков для отображения из возможного списка из 20+. Эти шесть графиков - это то, что нужно экспортировать в отчет PDF (с другой информацией). Мне нужно сделать это (в разумных пределах) максимально совместимым с браузером (по крайней мере, IE8 +), хотя моим текущим решением является IE10 + с отключением PDF для старых браузеров с использованием Modernizr.

С помощью stackoverflow и Google возможные решения включают использование PhantomJS в узле для захвата экрана или с помощью клиентского средства визуализации PDF (например, jsPDF). Из этого я чувствую, что PhantomJS обеспечит максимальную гибкость/совместимость с браузером. Кроме того, мне нужно создать несколько разных отчетов в зависимости от роли пользователя, поэтому не нужно использовать весь код для создания отчетов в браузере. Но я полностью зациклен на том, как получить доступ к «тому, что видит клиент», используя стек MEAN. PhantomJS необходимо будет эффективно войти в систему как клиент и иметь доступ к шести вариантам для графиков, которые сделал клиент.

Из моего исследования использование PhantomJS потребует создания html-страницы, как-то передающей то, что видит клиент/выбор данных/диаграмм, а затем захват этого для рендеринга в PDF, перед отправкой обратно в браузер. Один из способов - передать требуемую информацию в Express (с помощью POST?), А затем отобразить страницу html на стороне сервера, на которую можно было бы указать PhantomJS, но я не знаю, как это сделать (или, если возможно). Другая возможность - сохранить данные отчета клиента, выбор и т. Д. В базе данных и задать задачу для рендеринга PDF-файла и отправить его обратно в браузер, когда это будет сделано, но я еще не знаю, как этого добиться.

Я прочитал о файлах cookie в PhantomJS или перейдя по странице входа с помощью кода, но это, по-видимому, является громоздким способом достижения этого. Можно ли создать html-файл на стороне сервера, с помощью chart.js (или другой графической библиотеки), введенной (и угловой?), И всех необходимых пользовательских данных/диаграмм для PhantomJS для рендеринга в PDF? Я думаю, что в некоторых случаях мне нужно иметь возможность использовать PDF-генератор, графическую библиотеку и т. Д. На стороне сервера для создания PDF-файла.

Любой совет (с возможными примерами кода) о том, как достичь этого, будет оценен по достоинству.

Answer 1

Я предполагаю, что у меня была такая же проблема, как и вы (только я использовал Laravel на стороне сервера).

Идеи я придумал была преобразовать полотно, генерируемое угловым-chartjs к изображениям (с использованием toDataURL() на полотне элементов)

$('.theCanvas').each(function() { 
      var canvas=this; 
      img=JSON.stringify(canvas.toDataURL()); 

}); 

http://plnkr.co/edit/PkZiqYynzQXehbe6p1eH?p=preview , а затем отправки изображений на сервер для создать pdf-файл и, наконец, отправить пользователю ссылку на созданный PDF-файл.

В моем случае у них много пакетов для создания PDF-файла с html на стороне сервера, и я не знаю, существует ли инструмент для узла.

Надеюсь, это поможет.