Как отредактировать PDF в браузере и сохранить его к серверу
Вот требования, пользователи должен смочь просмотреть загруженный PDFs в браузере. Они должны смочь добавить примечания к PDF и сохранить обновленный PDF к серверу, не имея необходимость сохранять его к их машине и открывать его вне браузера.
Одобрены любые идеи о том, как достигнуть этого.
по тому, как я работаю с веб-сайтом asp.net (в C#).
Я не имею никакого контроля над тем, на что похож PDF. Это загружается клиентское затем, другие пользователи должны просмотреть и примечания сверху PDF.
Решение, что я думал, состоит в том, чтобы представить PDF к jpeg и использовать JavaScript для графического изображения координат того, куда примечание должно пойти.
вот быстрый пример HTML и JavaScript, которые создают json знаменитое (использование jQuery.)
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<style type="text/css">
*
{
margin:0;
padding:0;
}
#PDF
{
position:absolute;
top:0;
bottom:0;
width:600px;
height:800px;
background:url(assets/images/gray.png) repeat;
float:left;
}
#results
{
float:right;
}
.comment
{
position:absolute;
border:none;
background-color:Transparent;
height:300px;
width:100px;
overflow:auto;
float:left;
top:0;
right:0;
font-family: Arial;
font-size:12px;
}
div.comment
{
padding-top:-20px;
}
.comment a.button
{
display:block;
padding-top:-20px;
}
</style>
</head>
<body>
<div>
<div id="PDF"></div>
<div id="results">
</div>
</div>
</body>
</html>
<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript">
var points = [];
$("#PDF").click(function(e) {
if ($("textarea.comment").length == 0) {
var that = this;
var txt = $("<textarea class='comment'></textarea>").css({ top: e.pageY, left: e.pageX }).blur(function() { $(this).remove(); }).keypress(function(e2) {
if (e2.keyCode == 13 && !e.shiftKey) {
var that2 = this;
$("#PDF").append($("<div class='comment'>").html(that2.value.replace(/\r/gi, "<br>")).css({ top: e.pageY, left: e.pageX }));
$(this).remove();
points.push({ "x": e.pageX, "y": e.pageY, "text": that2.value })
$("#results").append('{ "x": ' + e.pageX + ', "y": ' + e.pageY + ', "text": "' + that2.value + '" }<br/>');
}
});
$(this).append(txt);
txt.each(function() { this.focus(); })
}
});
</script>
Таким образом, теперь я должен выяснить как к:
7 ответов
Вы можете использовать GhostScript для преобразования PDF в JPEG.
Пример командной строки:
gswin32c.exe -dSAFER -dBATCH -dNOPAUSE -sDEVICE=jpeg -r300 -sOutputFile=output.jpg input.pdf
Вам нужно вызвать GhostScript через версию командной строки (как описано выше) или использовать обертку. Поиск в Google выдал следующее сообщение в блоге:
Для создания нового PDF у вас есть две основные альтернативы:
- Изменить JPEG и преобразовать JPEG в PDF (для преобразования можно использовать GhsotScript)
- Использовать библиотеку PDF, которая импортирует ваш исходный PDF и добавляет данные поверх него
О библиотеках PDF смотрите этот вопрос в SO:
Мы делаем это с помощью lowagie на платформе Spring / Java.
Пользователям предоставляются предварительно сгенерированные налоговые декларации, и они могут вручную вносить определенные корректировки в несколько полей. Затем мы повторно вычисляем итоговые поля на основе их ручного ввода и сохраняем все это обратно в нашу БД.
Моя компания, Atalasoft, предоставляет компоненты, которые позволяют просматривать изображения документов, включая PDF, аннотировать их и сохранять аннотации обратно в PDF. В нашем наборе продуктов вам понадобится программа для создания изображений документов dotImage и надстройка PDF Reader. Вы будете использовать dotAnnotate через наши веб-контроллеры AJAX. Вот ссылка на нашу онлайн-демонстрацию - отображаемый документ - TIFF, но вы можете использовать и PDF.
Я не думаю, что вы сможете заставить пользователя загрузить PDF-файл в свой браузер, отредактировать его, а затем сохранить на сервере, не сохраняя его на своей машине, а затем загружая на сервер.
Что вы можете сделать, так это настроить веб-форму с серверной частью базы данных, которая может представлять PDF-файл, и когда они редактируют его, вы можете повторно создать PDF-файл с помощью itextsharp и загрузить информацию из базы данных, таким образом, когда пользователь вернется к редактированию PDF, вы можете предварительно заполнить форму тем, что уже существует.
itextsharp чрезвычайно прост в использовании, вот пример:
string sourceFile = "path/to/pdfTemplate.pdf";
PdfReader reader = new PdfReader(sourceFile);
PdfStamper stamper = new PdfStamper(reader, new FileStream("path/to/store/pdf/filename.pdf", FileMode.Create));
AcroFields fields = stamper.AcroFields;
//now assign fields in the form to values from your form
fields.SetField("input1", input1.Text);
fields.SetField("input2", input2.Text);
//close the pdf after filling out fields
stamper.SetFullCompression();
stamper.FormFlattening = true;
stamper.Close();
тогда, если вы хотите показать настоящий PDF, вы можете легко
Response.Redirect("path/to/store/pdf/filename.pdf");
Для создания аннотаций можно использовать либо PDFSharp, либо itextsharp. Я не пробовал аннотации PDFSharp, но iTextSharp работает. Вам придется обрабатывать редактирование на стороне сервера. возможно, скопируйте файл во временную папку, отредактируйте его и сохраните обратно.
Вы найдете itextsharp по адресу http://itextsharp.sourceforge.net, пример аннотации: внизу на странице http://itextsharp.sourceforge.net/tutorial/ch03.html
pdfsharp: http://www.pdfsharp.net
Если у вас есть возможность приобрести библиотеку стороннего производителя, я бы очень рекомендовал TxTextControl. http://www.textcontrol.com/en_US/
С помощью этого элемента управления вы можете написать редактор, который позволяет вам использовать ваш pdf в качестве шаблона и позволяет пользователю вносить изменения и сохранять их. Все в пределах браузера, без необходимости вручную выбирать временный файл на компьютере. Получение доступа практически аналогично использованию свойства TextProperty обычного TextBox.
Вы не указали, какие технологические ограничения у вас есть. Если вы можете рассмотреть решение Silverlight и у вас есть клиентские компьютеры, поддерживающие Silverlight, вы легко сможете это сделать.
Посмотрите, как работает Microsoft Sketchflow: он позволяет пользователю комментировать документы в веб-браузере, и аннотации сохраняются на сервере.
Вот компания с коммерческим контролем для аннотирования PDF (и других форматов).
Microsoft делает это в своем плеере Sketchflow. Вот видео . Конечно, вы бы не использовали Sketchflow, а скорее имплементировали что-то подобное, отвечающее вашим потребностям.
В качестве дополнительного бонуса Silverlight 4 поддерживает буфер обмена, а также перетаскивание, чтобы конечные пользователи могли вставить что-то в изображение PDF, а также перетащить на него любой файл, чтобы вы могли затем загрузить его на свой сервер.