? 最近公司有一個中的需求，是將html表單轉換成pdf 。
? 無非方式就只有兩種帚稠，前端的方式咱就不說了谣旁，您能看到這里，必然是采用了市場占有率最高的wkhtmltopdf滋早。
? 優(yōu)缺點都很明顯榄审，廢話不多說，直接說我踩過的坑和填過的坑杆麸。
? No1.? 有登陸權限驗證的頁面需要打印為pdf 瘟判。如果你要打印的頁面是基于權限認證的，那你打印出來角溃，必然是跳轉到認證頁面的pdf拷获。
? ? ? ? ? ?看到這里，不要懵逼减细。
? ? ? ? ? wkhtmltopdf 支持賬號密碼和驗證碼登陸匆瓜，同時也支持采用cookie 的方式進行登陸。大部分時候采用cookies 登陸即可未蝌。
? ? ? ? ? 具體的實現方式如下：
ProcessStartInfo psi =?new?ProcessStartInfo();
psi.FileName =?"wkhtmltopdf.exe";
string?cookieArgs =?"";
var?cookies = HttpContext.Current.Request.Cookies;
if?(cookies !=?null)
{
????var?sb =?new?System.Text.StringBuilder();
????// you probably only need the ".ASPXFORMSAUTH"
????// and "ASP.NET_SessionId" cookies
????// but I pass everything just in case
????foreach?(string?key?in?cookies.AllKeys)
????{
????????string?value = cookies[key].Value;
????????sb.AppendFormat("--cookie {0} {1} ", key, value);???????????????????
????}
????cookieArgs = sb.ToString();
}
psi.Arguments = urlToPrint +?" -q "?+ cookieArgs +?" -";
Process.Start(psi);
?No2.打印的內容不全驮吱。?
這時候要分析具體原因，在wkhtmltopdf 里有一個參數是--window-status ,這個參數可以支持ajax異步請求 的萧吠。
做法是： 在調用wkhtmltopdf 時左冬，傳入參數 ，比如 傳入 “? ?--window-status? completed”? ?,然后在ajax 完成回調時 纸型，也將document 的window.status = "completed",這樣的話拇砰，就會完全支持異步調用。有兩點需要注意：1.每個參數之間必須有空格狰腌，不然一定會出現你想到的問題除破。2.window.status 的值必須與傳入的參數值一樣，否則的話琼腔，就會一直處于等待狀態(tài)瑰枫。
No3. 空白頁面，網頁顯示完好無損丹莲，但打印出來的卻是空白頁面光坝。? ? ??
? ? ?這是最大的一個坑，我研究了一天才踩平了甥材。到現在還有一些疑問的地方盯另，等到時候我在去重新踩 。說一下坑在哪里哈.
? ? ? wkhtmltopdf 的工具是基于qt webkit 的擂达。所以基本上目前的流行玩法都是支持的土铺。但特么的也有例外胶滋，由于官網已經很久沒有更新，我去github上看到的更新也是很久之前的悲敷。
? ? ?如果是普通的mvc 和html 頁面是完全沒有問題的究恤。但單頁面應用程序的坑就大了。
? ? 我當時用的版本是angular js 后德，在頁面顯示完美部宿，但在pdf 打印出來確實空白的。
? ? ?起初我認為問題出現在wkhtmltopdf 瓢湃，它并不支持單頁面應用程序理张。但我用vue 測試的沒有問題。于是我重新測試angular js 绵患，我在github 看了每一個提問者的問題雾叭。發(fā)現一個提問者講到，他用的angular js? 1.4的版本出現了問題落蝙，回撤到1.3.5 則正常织狐。于是我發(fā)現新大陸一樣，將angular js?的版本也回車到了1.3.5 筏勒，發(fā)現打印出來的頁面不在是空白頁面移迫，是有內容的頁面。由于我頭一次接觸angluar js 管行，我問同事才得知厨埋，angluar js 1.4版本跨度比較大，改變了好多的內容捐顷，包括請求方式都發(fā)生了很大的變化荡陷。這也就解釋了，為啥使用angular js 打印的是空白頁套菜，因為angular js 1.4以上的版本亲善，你用wkhtmltopdf 根本就調用不到后臺的內容设易，壓根就不會發(fā)起請求逗柴。
? ? ? 別急，到這里顿肺，坑還沒結束戏溺，雖然能請求后端了，但是我發(fā)現屠尊，打印出來的內容卻缺少了很多東西旷祸，這時候就尷尬了，angular js 1.4 以上的 渲染的內容沒有問題讼昆，但不能向后臺發(fā)起請求托享，angular js 1.3.5能發(fā)起請求，但問題是打印的時候渲染不出內容。 經過我和同事的一步步調試闰围，發(fā)現問題竟然在css 赃绊，一個叫overflow 的標簽直接影響內容。 具體詳情請參考前輩的：http://www.reibang.com/p/57c897cfaa27
? ? 周六折騰了一天羡榴，總算是搞定了碧查。希望對大家能有所幫助，如果有什么問題校仑，大家及時留言忠售。我會盡快的幫助大家解決。
