如何编辑PDF浏览器，并将其保存到服务器 [英] How to edit a pdf in the browser and save it to the server
问题描述
这里的要求，用户需要能够以查看PDF文件的上载中的浏览器。他们需要能够添加注释到PDF和保存更新PDF到服务器，而无需将其保存到他们的机器并打开它的浏览器之外。
就如何实现这一目标的任何想法都欢迎。
由我带一个asp.net网站的工作（在C＃）的方式。
我有过什么样的PDF看起来像没有控制权。它被上传客户端则其他用户需要查看，并在PDF顶部的音符。
我在想解决的办法是使PDF格式为JPEG，并使用JavaScript来绘制的，其中笔记应该去坐标。
这里要说的是创造值得注意的JSON的HTML和JavaScript的一个简单的例子（使用jQuery）。
＆LT; HTML的xmlns =http://www.w3.org/1999/xhtml＆GT;
＆LT;头=服务器＆GT;
＆LT;冠军＆GT;＆LT; /标题＆GT;
＆LT;风格类型=文本/ CSS＆GT;
*
{
保证金：0;
填充：0;
}
#PDF
{
位置：绝对的;
顶部：0;
底部：0;
宽度：600px的;
高度：800px;
背景：网址（资产/图像/ gray.png）重复;
浮动：左;
}
#results
{
浮动：权利;
}
。评论
{
位置：绝对的;
边界：无;
背景颜色：透明;
高度：300像素;
宽度：100像素;
溢出：汽车;
浮动：左;
顶部：0;
右：0;
字体-family：宋体;
字体大小：12px的;
}
div.comment
{
填充顶：-20px;
}
的.comment a.button
{
显示：块;
填充顶：-20px;
}
＆LT; /风格＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; DIV＆GT;
＆LT; DIV ID =PDF＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =结果＆GT;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
＆LT;脚本类型=文/ JavaScript的SRC =脚本/ jquery.js和＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
VAR分= [];
$（＃PDF）。点击（函数（五）{
如果（$（textarea.comment）。长度== 0）{
VAR的=这一点;
VAR TXT = $（＆LT; TextArea类='评论'＆GT;＆LT; / textarea的＆gt;中），CSS（{顶部：e.pageY，左：e.pageX}）模糊（函数（）{$（这一点。 ）卸下摆臂（）;}）键preSS（函数（E2）{
如果（e2.key code == 13安培;＆安培;！e.shiftKey）{
VAR that2 =这一点;
$（＃PDF）追加（$（＆LT; DIV CLASS ='评论'＆gt;中）HTML（that2.value.replace（/ \ R / GI。＆LT; BR＆gt;中））的CSS。 （{顶部：e.pageY，左：e.pageX}））;
$（本）上卸下摆臂（）;
points.push（{X：e.pageX，Y：e.pageY，文：that2.value}）
$（＃结果）追加（{X：+ e.pageX +，Y：+ e.pageY +，文：'+ that2.value +}。 ＆LT; BR /＆GT;'）;
}
}）;
$（本）.append（TXT）;
txt.each（函数（）{this.focus（）;}）
}
}）;
＆LT; / SCRIPT＆GT;
所以现在我需要弄清楚如何：
您可以使用 GhostScript的渲染PDF格式为JPEG。
命令行的例子：
gswin32c.exe -dSAFER -dBATCH -dNOPAUSE -sDEVICE = JPEG -r300 -sOutputFile = output.jpg input.pdf
您需要在命令行版本（如上）来调用GhostScript的或使用的包装。 谷歌搜索变成了这篇博客文章：
有关创建新的PDF文档，你有两个主要备选方案：
- 修改JPEG和转换JPEG转换成PDF（可以使用GhsotScript的转换）
- 使用一个PDF库导入您的原始PDF，并在此基础之上添加数据
有关PDF库看到此等问题：
Here are the requirements, the users needs to be able to view uploaded PDFs in the browser. They need to be able to add notes to the PDF and save the updated PDF to the server without having to save it to their machine and open it outside the browser.
Any ideas on how to achieve this are welcomed.
by the way I am working with an asp.net website (in C#).
I have no control over what the pdf looks like. It is uploaded client-side then other users need to view and an notes on top of the pdf.
The solution that I was thinking is to render the PDF to a jpeg and use javascript to plot coordinates of where the note should go.
here is a quick example of the html and javascript that create the json of note (using 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>
So now I need to figure out how to:
- Render a pdf to jpeg.
- Recreate the PDF putting the annotations on top on it.
You can use GhostScript to render a PDF to JPEG.
Command line example:
gswin32c.exe -dSAFER -dBATCH -dNOPAUSE -sDEVICE=jpeg -r300 -sOutputFile=output.jpg input.pdf
You need to call GhostScript via the command line version (as above) or use a wrapper. A Google search turned up this blog post:
For creating a new PDF you have two main alternatives:
- Modify the JPEG and convert the JPEG into PDF (you can use GhsotScript for the conversion)
- Use A PDF library that imports your original PDF and add data on top of that
For PDF libraries see this SO question:
这篇关于如何编辑PDF浏览器，并将其保存到服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
