需求場景：使用者使用瀏覽器訪問引用，突發異常，但沒及時保留現場，線下質控人員為了能復現缺陷可絞盡腦汁，研發團隊也是針對場景進行日誌分析，鏈路重放...可是就是沒現場。
針對這類場景，除了研發團隊對前後臺鏈路及引數加上日誌追蹤外，如果能加上現場操作圖，用於幫助定位問題，那就更直觀了。於是，問題來了，如何在html5頁面上實現把網頁儲存為。
眾所周知，html5中可以使用canvas物件進行動態頁面繪製，同時可以操作頁面物件，序列化dom元素等等。
應對方案：採用html2canvas進行網頁元素截圖。
1、引入js，
2、使用html2canvas向html中追加新dom，演示**如下：
html2canvas(document.getelementbyid('id'))html2canvas(document.getelementbyid("target"),html2canvas使用記錄
該外掛程式，我使用的是1.0.0 rc.4版本，網上提到的舊版本的一些問題，基本都得到了解決，比如手機端截圖模糊問題，跨域快取問題，都沒有出現 注意1 對高度高於視窗的內容截圖時，要確保滾動條在頂部，否則擷取的頂部會出現空白 2 在本地測試時候，如果使用的是本地，需要通過url形式訪問此頁面，如果直...
記錄乙個html2canvas 使用中遇到的問題
import html2canvas from html2canvas const converttoimage container,options return html2canvas container,opts then canvas 將element drawer中的乙個dom元素通過htm...
小技巧 H5禁止手機虛擬鍵盤彈出
本文首發於我的部落格 工作中遇到如下需求，點選輸入框彈出自定義彈窗，輸入框是input標籤 但是在移動端，input會預設觸發手機的虛擬鍵盤，如何阻止手機虛擬鍵盤彈起呢？目前我試過有兩個方案，乙個是給input新增readonly屬性,另乙個就是在input事件處理方法前面新增一句document....