网站运营策略,贵州省建设执业资格教育促进会网站,网站建网站,宁波市城乡和建设网站目录
需求
方案分析
相关库引入
关键代码
Word 转 Pdf
Pdf 转批量 Jpeg
Jpeg 转为电子书
实现效果演示
小结 需求
曾经的一个项目#xff0c;要求实现制作电子期刊定期发送给企业进行阅读#xff0c;基本的需求如下#xff1a;
1、由编辑人员使用 Microsoft Word…
目录
需求
方案分析
相关库引入
关键代码
Word 转 Pdf
Pdf 转批量 Jpeg
Jpeg 转为电子书
实现效果演示
小结 需求
曾经的一个项目要求实现制作电子期刊定期发送给企业进行阅读基本的需求如下
1、由编辑人员使用 Microsoft Word 编辑期刊内容上传到系统生成PDF文件。
2、将生成的PDF文件转化为JPEG文件。
3、将JPEG文件制作目录结构并生成电子书模式。
方案分析
分析了一下需求制作了初步的实现方案主要有以下几点分析
1、Microsoft Word 仍然是目前比较常用和广泛使用的应用程序适用于各类人群他们只需要编写好自己的文稿即可包括文字、图片、排版所以可以作为实现电子书的基础。
2、较高版本的 Word 如2016、2019及以上可以提供另存为PDF的能力利用API可以将DOCX另存为PDF文件为进一步生成JPEG图片提供基础。
3、利用改造过的 turn.js 实现电子书及翻页效果。
相关库引入
实现功能要引入相关库包括 PdfiumViewer.dll 和 turn.js 相关包完整下载链接请访问
https://download.csdn.net/download/michaelline/88647689
另外在服务器端您需要安装 Microsoft Word 2016 或以上版本。
关键代码
Word 转 Pdf
在操作界面上传WORD文件通过API将其另存为PDF文件。
示例代码如下 public string WordToPdf(string _filename){string resultReport; //调试信息Object Nothing System.Reflection.Missing.Value;
//在上传目录下一定要创建一个tempbfile目录用于存储临时文件string _file,_pathPath.GetDirectoryName(_filename)\\tempbfile\\,_ext;_filePath.GetFileNameWithoutExtension(_filename);_extPath.GetExtension(_filename);string _validfilenameGuid.NewGuid().ToString()_ext;string _lastfile_path_validfilename;string _pdfFile _path Guid.NewGuid().ToString() .pdf;File.Copy(_filename,_lastfile,true);if(!File.Exists(_lastfile)){resultReport create _lastfile fail.br;return ;}//取得Word文件保存路径object filename_lastfile;//创建一个名为WordApp的组件对象Word.Application WordAppnew Word.Application();//创建一个名为WordDoc的文档对象WordApp.DisplayAlertsWord.WdAlertLevel.wdAlertsNone;Word.Document WordDocWordApp.Documents.Open(ref filename,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing,ref Nothing);WordDoc.SpellingChecked false;WordDoc.ShowSpellingErrors false;string pdfFilename ;
//导出到pdf文件WordDoc.ExportAsFixedFormat(_pdfFile, Microsoft.Office.Interop.Word.WdExportFormat.wdExportFormatPDF,false,Word.WdExportOptimizeFor.wdExportOptimizeForPrint,wdExportRange,pagefrom,pageto,Word.WdExportItem.wdExportDocumentContent,false,true,Word.WdExportCreateBookmarks.wdExportCreateNoBookmarks,true,true,false, ref Nothing);if (File.Exists(_pdfFile)){pdfFilename _pdfFile;}WordDoc.Close(ref Nothing, ref Nothing, ref Nothing);//关闭WordApp组件对象WordApp.Quit(ref Nothing, ref Nothing, ref Nothing);return pdfFilename;} Pdf 转批量 Jpeg
生成pdf文件后我们需要将其转化到指定目录下批量生成JPEG图片以备客户端JS进行调用。
方法介绍
public void PdfToImage(string pdfInputPath, string imageOutputPath,string imageName)
//参数1PDF文件路径参数2:输出图片的路径参数3图片文件名的前缀比如输入Img则会输出Img_001.jpg、Img_002.jpg。。。以此类推。
示例代码如下
//参数1PDF文件路径参数2:输出图片的路径参数3图片文件名的前缀比如输入Img则会输出Img_001.jpg、Img_002.jpg以此类推
public void PdfToImage(string pdfInputPath, string imageOutputPath,string imageName){// PdfRenderFlags.Annotations 改成 PdfRenderFlags.CorrectFromDpi DPI值设置成600 即可高清图像if (Directory.Exists(imageOutputPath) false){Directory.CreateDirectory(imageOutputPath);}var pdf PdfiumViewer.PdfDocument.Load(pdfInputPath);var pdfpage pdf.PageCount;var pagesizes pdf.PageSizes;if (pdfpage 0){pdf.Dispose();return;}var document PdfiumViewer.PdfDocument.Load(pdfInputPath);for (int i 1; i pdfpage; i){Size size new Size();size.Height (int)pagesizes[(i - 1)].Height;size.Width (int)pagesizes[(i - 1)].Width;//可以把.jpg写成其他形式string tmpfile imageOutputPath imageName _ i.ToString().PadLeft(3, 0) .jpg;var stream new FileStream(tmpfile, FileMode.Create);var image document.Render(i - 1, size.Width, size.Height, 120, 120, PdfRenderFlags.CorrectFromDpi);image.Save(stream, System.Drawing.Imaging.ImageFormat.Jpeg);stream.Close();}document.Dispose();pdf.Dispose();} Jpeg 转为电子书
根据 turn.js 的格式要求我们在服务端 Page_Load 事件里生成一个 ViewState直接输出到客户端ViewState[result] 是我们要输出的变量我们对指定的 jpgTmpPath 变量目录进行遍历符合jpeg或jpg扩展名的文件则进行记录。
服务端示例代码如下
protected void Page_Load(object sender, EventArgs e){ViewState[result] ; //关键的viewsate用于存储JPEG地址数组格式string _cidRequest.QueryString[cid];if ( _cid! null){string result ;string jpgTmpPath Request.PhysicalApplicationPath \\ebook\\ _cid \\;if (Directory.Exists(jpgTmpPath)){string[] allfs System.IO.Directory.GetFiles(jpgTmpPath);for (int i 0; i allfs.Length; i){string jpgfile allfs[i].ToLower();string filename System.IO.Path.GetFileName(jpgfile);if (jpgfile.IndexOf(.jpg) -1 jpgfile.IndexOf(.jpeg) -1){continue;}result \../../ebook/ _cid / filename \,\r\n;}ViewState[result] result;}}if (ViewState[result].ToString() ){Response.Write(没有预览资源);Response.End();}
}
中间UI代码引用示例 head runatservermeta charsetutf-8meta http-equivX-UA-Compatible contentIEedge,chrome1/meta http-equivpragma contentno-cache /meta http-equivCache-Control contentno-cache,no-store,must-revalidate/meta http-equivExpires content0 /meta nameviewport contentwidthdevice-width, initial-scale1.0, user-scalableno/meta nameformat-detection contenttelephonenometa nameapple-mobile-web-app-capable contentyes/title电子期刊预览/titlelink relstylesheet typetext/css hrefcss/basic.css/script typetext/javascript srcjs/jquery.js/scriptscript typetext/javascript srcjs/modernizr.2.5.3.min.js/script
/headdiv classshadediv classsk-fading-circlediv classsk-circle1 sk-circle/divdiv classsk-circle2 sk-circle/divdiv classsk-circle3 sk-circle/divdiv classsk-circle4 sk-circle/divdiv classsk-circle5 sk-circle/divdiv classsk-circle6 sk-circle/divdiv classsk-circle7 sk-circle/divdiv classsk-circle8 sk-circle/divdiv classsk-circle9 sk-circle/divdiv classsk-circle10 sk-circle/divdiv classsk-circle11 sk-circle/divdiv classsk-circle12 sk-circle/div/divdiv classnumber/div
/divdiv classflipbook-viewport styledisplay:none;div classpreviousPage/divdiv classnextPage/divdiv classreturn/divimg classbtnImg src./image/btn.gif styledisplay: none/div classcontainerdiv classflipbook/divdiv classpagenumber/div/div
/div
客户端脚本
在客户端我们接收来自 ViewState[result] 的变量值实现电子书的效果
script typetext/javascriptvar loading_img_url [%ViewState[result]%];
/script
script typetext/javascript srcjs/main.js/script
script//自定义弹出层(function ($) {//ios confirm boxjQuery.fn.confirm function (title, option, okCall, cancelCall) {var defaults {title: null, //what textcancelText: 取消, //the cancel btn textokText: 确定 //the ok btn text};if (undefined option) {option {};}if (function ! typeof okCall) {okCall $.noop;}if (function ! typeof cancelCall) {cancelCall $.noop;}var o $.extend(defaults, option, { title: title, okCall: okCall, cancelCall: cancelCall });var $dom $(this);var dom $(div classg-plugin-confirm);var dom1 $(div).appendTo(dom);var dom_content $(div).html(o.title).appendTo(dom1);var dom_btn $(div).appendTo(dom1);var btn_cancel $(a href#/a).html(o.cancelText).appendTo(dom_btn);var btn_ok $(a href#/a).html(o.okText).appendTo(dom_btn);btn_cancel.on(click, function (e) {o.cancelCall();dom.remove();e.preventDefault();});btn_ok.on(click, function (e) {o.okCall();dom.remove();e.preventDefault();});dom.appendTo($(body));return $dom;};})(jQuery);if ($(window).width() 1024 $(window).height() 700) {//上一页$(.previousPage).bind(click, function () {var pageCount $(.flipbook).turn(pages); //总页数var currentPage $(.flipbook).turn(page); //当前页if (currentPage 2) {$(.flipbook).turn(page, currentPage - 2);} else if (currentPage 2) {$(.flipbook).turn(page, currentPage - 1);}});// 下一页$(.nextPage).bind(click, function () {var pageCount $(.flipbook).turn(pages); //总页数var currentPage $(.flipbook).turn(page); //当前页if (currentPage pageCount - 1) {$(.flipbook).turn(page, currentPage 2);} else if (currentPage pageCount - 1) {$(.flipbook).turn(page, currentPage 1);}});} else {//上一页$(.previousPage).bind(click, function () {var pageCount $(.flipbook).turn(pages); //总页数var currentPage $(.flipbook).turn(page); //当前页if (currentPage 2) {$(.flipbook).turn(page, currentPage - 1);} else {}});// 下一页$(.nextPage).bind(click, function () {var pageCount $(.flipbook).turn(pages); //总页数var currentPage $(.flipbook).turn(page); //当前页if (currentPage pageCount) {$(.flipbook).turn(page, currentPage 1);} else {}});}//返回到目录页$(.return).bind(click, function () {$(document).confirm(您确定要返回首页吗?, {}, function () {$(.flipbook).turn(page, 1); //跳转页数}, function () {});});function gotopage(pageindex) {$(.flipbook).turn(page,pageindex);}/script
实现效果演示 小结
以上提供的代码仅供参考turn.js 我花了一些时间进行了改造我们也可以根据自己的需要对样式、控制进行改造。其它的一些细节我们可以进一步调整如图片生成质量、权限控制等。
另外还可以实现下载、评价、点赞、收藏等其它功能这里就不再一一介绍。 以上就是自己的一些分享时间仓促不妥之处还请大家批评指正
