成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

文件下載和打印

idealcn / 1555人閱讀

摘要：由四個(gè)部分組成前綴指示數(shù)據(jù)類型的類型如果非文本則為可選的標(biāo)記數(shù)據(jù)本身將數(shù)據(jù)轉(zhuǎn)換成格式的后通過(guò)標(biāo)簽導(dǎo)出將圖片下載成打印組件化后，需要通過(guò)插入樣式的方法保證樣式不會(huì)覆蓋

文件下載 一、調(diào)用后端接口下載

通過(guò) window.open(url) 下載;

通過(guò) window.location = url 下載

通過(guò) iframe 下載

    const iframe = document.createElement("iframe");
    document.body.appendChild(iframe);
    iframe.src = url;
    iframe.style.display = "none";

通過(guò)點(diǎn)擊鏈接下載

function download(fileName, url) {

    if (!fileName) return;

    console.log(url);
    const link = document.createElement("a");
    const evt = document.createEvent("MouseEvents");

    link.href = url;
    link.setAttribute("download", fileName);

    evt.initEvent("click");

    link.dispatchEvent(evt);
}
二、前端直接下載到本地

將數(shù)據(jù)轉(zhuǎn)換成 Data URLs 后通過(guò)a標(biāo)簽導(dǎo)出(以)。

（Data URLs 由四個(gè)部分組成：前綴(data:)、指示數(shù)據(jù)類型的MIME類型、如果非文本則為可選的base64標(biāo)記、數(shù)據(jù)本身：）

    data:[][;base64],
    const data = resolveDate(this.data, this.headersMapping);
    download("test.csv", `data:"attachment/csv",ufeff${encodeURIComponent(data)}`);
    // data:"attachment/csv",?%E5%A7%93%E5%90%8D%2C%E5%B9%B4%E9%BE%84%2C%E7%94%B5%E8%AF%9D%0D%0A%E5%BC%A0%E4%B8%89%2C21%2C13122223839%0D%0A%E6%9D%8E%E5%9B%9B%2C13%2C13198739339%0D%0A%E7%8E%8B%E4%BA%94%2C23%2C13198340239%0D%0A%E6%9D%8E%E9%9B%B7%2C42%2C13198783839%0D%0A%E5%BC%A0%E6%A2%85%E6%A2%85%2C5%2C13198783839%0D%0A%E5%B0%8F%E6%98%8E%2C22%2C13139083839%0D%0A%E5%B0%8F%E7%BA%A2%2C13%2C13198783839%0D%0A%E5%B0%8F%E7%BB%BF%2C11%2C13198783839

將數(shù)據(jù)轉(zhuǎn)換成 blob 格式的 url 后通過(guò) a 標(biāo)簽導(dǎo)出

    const data = resolveDate(this.data, this.headersMapping);
    const url = window.URL.createObjectURL(new window.Blob([`ufeff${data}`]));
    // blob:http://localhost:8081/9b0d2867-ada2-4db1-b090-d0e8d44e0ae0
    downloadFile("test.csv", url);

將 canvas 圖片下載成 png

    const imageData = this.canvas.toDataURL();
    // data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAACWCAYAAAA8AXHiAAANmklEQVR4Xu2dB6w9RRXGP4zBBhor9hoQCwh2I3axiwV7FzH2XgB7QQQbViwk2BWDDey9VxALVoxEgwr2QgKKGs2P/2zcXO67d3dnz5nZveckN+8ld+bMzLff3Z09bbZTSCBggMB2BjpDZSCgIFaQwASBIJ...QkTBIJYJrCG0iBWcMAEgSCWCayhNIgVHDBBIIhlAmsoDWIFB0wQCGKZwBpKg1jBARMEglgmsIbSIFZwwASBIJYJrKE0iBUcMEEgiGUCaygNYgUHTBAIYpnAGkqDWMEBEwSCWCawhtIgVnDABIEglgmsoTSIFRwwQSCIZQJrKA1iBQdMEAhimcAaSv8H1TBWtQk/HwUAAAAASUVORK5CYII=
    downloadFile("test.jpg", imageData);
    const imageData = this.canvas.toDataURL().replace("image/png","image/octet-stream");
    // data:image/octetstream;base64,JrKE0iBUcM...ygNYgUHTBnDABIEd3dnz5nZveckN+8ld+bMzLff3Z09bbZTSCBggMB2BjpDZSCgIFaQwASBIJ...QkTBIJYJrCG0iBWcMAEgSCWCayhNIgVHDBBIIhlAmsoDWIFB0wQCGKZwBpKg1jBARMEglgmsIbSIFZwwASBIJYJrKE0iBUcMEEgiGUCaygNYgUHTBAIYpnAGkqDWMEBEwSCWCawhtIgVnDABIEglgmsoTSIFRwwQSCIZQJrKA1iBQglgmsoTSIFRwwQSCIZQJmcAaSv8H1TBWtQk/HwUAAAAASUVORK5CYII=
    downloadFile("test2.png",  imageData);
打印 
...
.print {
    page-break-after: always;
}
@page {
    margin: 0;
}

組件化后，需要通過(guò)插入 page 樣式的方法保證樣式不會(huì)覆蓋

    const el = document.createElement("style");
    el.type = "text/css";
    el.appendChild(document.createTextNode("@page { margin: 0mm; size: 80mm 160mm; }"));
    document.head.appendChild(el);

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/105655.html

相關(guān)文章

  • 云計(jì)算將怎樣助力3D打印應(yīng)用普及？

    摘要：打印正在改變產(chǎn)品設(shè)計(jì)測(cè)試和制造的方式，而基于云計(jì)算的軟件也正在幫助打印實(shí)現(xiàn)它的潛力。在云計(jì)算的幫助下，任何能連上互聯(lián)網(wǎng)的人可以創(chuàng)造調(diào)整存儲(chǔ)和流設(shè)計(jì)，并將二者發(fā)送到世界上任何地方的打印機(jī)上。　　3D打印正在改變產(chǎn)品設(shè)計(jì)、測(cè)試和制造的方式，而基于云計(jì)算的軟件也正在幫助3D打印實(shí)現(xiàn)它的潛力。在云計(jì)算的幫助下，任何能連上互聯(lián)網(wǎng)的人可以創(chuàng)造、調(diào)整存儲(chǔ)和流設(shè)計(jì)，并將二者發(fā)送到世界上任何地方的3D打印機(jī)上...

    diabloneo 評(píng)論0 收藏0

  • 基于云計(jì)算的軟件實(shí)現(xiàn)3D打印的潛力

    摘要：打印正在改變產(chǎn)品設(shè)計(jì)測(cè)試和制造的方式，而基于云計(jì)算的軟件也正在幫助打印實(shí)現(xiàn)它的潛力。例如，一直在用基于云計(jì)算的軟件來(lái)為客戶定制化制造一款名為的產(chǎn)品。今年月，另外一家主要的打印公司宣布他們將追求一種新的基于云計(jì)算的軟件策略。　　3D打印正在改變產(chǎn)品設(shè)計(jì)、測(cè)試和制造的方式，而基于云計(jì)算的軟件也正在幫助3D打印實(shí)現(xiàn)它的潛力。在云計(jì)算的幫助下，任何能連上互聯(lián)網(wǎng)的人可以創(chuàng)造、調(diào)整存儲(chǔ)和流設(shè)計(jì)，并將二者...

    Tychio 評(píng)論0 收藏0

  • 如何通過(guò)ip連接主機(jī)-如何利用ip地址連接打印機(jī)？

    摘要：如何根據(jù)地址和子網(wǎng)掩碼算出可以連接的主機(jī)數(shù)，是類地址，默認(rèn)子網(wǎng)掩碼為即。所以，位于子網(wǎng)由劃分出來(lái)的第一個(gè)子網(wǎng)，子網(wǎng)號(hào)，主機(jī)地址范圍，定向廣播地址。如何根據(jù)IP地址和子網(wǎng)掩碼,算出可以連接的主機(jī)數(shù)？128＜172＜191，172.16.1.12是B類地址，默認(rèn)子網(wǎng)掩碼為/16 (即255.255.0.0)。將原來(lái)的B類網(wǎng)絡(luò)號(hào)進(jìn)行子網(wǎng)劃分后，子網(wǎng)掩碼變?yōu)?20，即網(wǎng)絡(luò)位(16位)向主機(jī)位(16位...

    keithyau 評(píng)論0 收藏0

  • 關(guān)于python的logging庫(kù)的總結(jié)

    摘要：確認(rèn)一切按預(yù)期運(yùn)行。表明發(fā)生了一些意外，或者不久的將來(lái)會(huì)發(fā)生問(wèn)題如磁盤(pán)滿了。由于更嚴(yán)重的問(wèn)題，軟件已不能執(zhí)行一些功能了。嚴(yán)重錯(cuò)誤，表明軟件已不能繼續(xù)運(yùn)行了。對(duì)于不能獲取的名稱，則記錄到模塊。 最近在寫(xiě)一些python腳本，總是使用print來(lái)打印信息感覺(jué)很low，所以抽空研究了一下python的logging庫(kù)，來(lái)優(yōu)雅的來(lái)打印和記錄日志： 一、簡(jiǎn)單的將日志打印到屏幕： import l...

    kaka 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<