简历生成平台项目开发-STEP4第二次项目例会讨论

时间:2023-03-08 22:35:46

时间:2016.7.15周五7点半

地点:图书馆

讨论主题:交流各自手头项目进展,确定下一步任务

内容:按照之前的讨论的任务大家各自汇报进度。

汇报人:谭卓、尹忠诚

  内容:1.基于富文本编辑器的模板,用户直接编辑。

      ~浏览器端生成(貌似不可行)

      ~直接打印页面(调研如何隐藏页眉页脚,貌似不可行) 见 http://*.com/questions/1960939/disabling-browser-print-options-headers-footers-margins-from-page/2780518

      富文本编辑器:

      以 ckeditor 为例,编辑器可以输出 html 代码,输出的 html 代码可以用来重现编辑器的内容。

      有些编辑器编辑效果很好,感觉体验超越了 word。

      初步选定 ckeditor,需要阅读其文档:http://docs.ckeditor.com/#!/guide

      富文本编辑器实现原理:https://developer.mozilla.org/en-US/docs/Rich-Text_Editing_in_Mozilla

      关键字:designMode, contentEditable

      2.拿到编辑器输出的 html,有两种方法输出 pdf

      服务端PDF生成两个东西:wkhtmltopdf、PhantomJS。

      这两个都是基于 webkit 的,能渲染 html,顺便输出 pdf,类似浏览器。

      网页端发来编辑器生成的 html,服务端在同样的环境运行页面,把收到的数据(html)填进去,重现出简历页面,输出 pdf。

      实验结果显示,PhantomJS 渲染结果更接近真实浏览器,就用它来输出 pdf。

      3.如何实现控制A4纸输出

      a.HTML/CSS

     

@page {
size: A4;
margin: 0;
} @media print {
html {
width: 210mm;
/* 高度比A4小1mm,因为页面可能稍微溢出一点,变成两页纸 */
height: calc(297mm - 1mm);
margin: 0;
}
} /* html 设成A4大小 */
html {
width: 210mm;
height: calc(297mm - 1mm);
margin: 0;
} /* 下面两个用于调试 */ /* 黑色框框是A4纸的边界 */
html {
border: 1px solid black;
} /* 红色框框是简历内容,即A4纸去掉页边距 */
body {
border: 1px solid red;
} body {
/* 简历页边距在这里设置 */
/* margin: 0cm 1cm 2cm 1cm; */
} /* the padding and border of that element no longer increase its width */
/* ref http://learnlayout.com/box-sizing.html */
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

      简历页面里,CSS 不能用 px 单位,px 是像素,要用 cm、em、% 等能决定实际大小的单位。

      引入第三方 CSS 时要注意。

      b.PhantomJS

      见代码 web2pdf.js

      

      c.wkhtmltopdf    

Windows:

wkhtmltopdf -L 0 -R 0 -T 0 -B 0 --page-size A4 --print-media-type --disable-smart-shrinking resume.html out.pdf

Linux:

wkhtmltopdf -L 0 -R 0 -T 0 -B 0 --page-size A4 --zoom 0.78125 --print-media-type --disable-smart-shrinking resume.html out.pdf

  汇报人:朱策

  根据之前的功能需求,暂时设计网站界面样式如 http://114.214.166.183/index.html 所示。

接下来任务:1.继续深入完成富文本编辑器与网站的融合,初步实现基本功能

      2.调研pdf生成对中文字体的支持

      3.浏览器端保存简历

      4.简历模板库调研

      5.技术文档的完善