zoukankan      html  css  js  c++  java
  • HTML2Canvas---合成海报遇到问题总结

    在使用HTML2Canvas合成图片项目中,通过不同手机测试,发现很多问题,总结一下,分享给大家。

    1. 在iPhone的safari浏览器上,合成海报分享到微信,会报“网络错误,无法分享”。

    解决方案:

    var userAgent = navigator.userAgent.toLowerCase();
    var bIsIphoneOs = userAgent.match(/iphone os/i) == "iphone os";
    
    
    
    if (bIsIphoneOs && userAgent.indexOf("safari") > -1 ) {
        this.imgUrl = URL.createObjectURL(this.base64ToBlob(canvas.toDataURL())) 
    }
    
    
    //base64转blob
                base64ToBlob(code) {
                    let parts = code.split(';base64,');
                    let contentType = parts[0].split(':')[1];
                    let raw = window.atob(parts[1]);
                    let rawLength = raw.length;
         
                    let uInt8Array = new Uint8Array(rawLength);
         
                    for (let i = 0; i < rawLength; ++i) {
                    uInt8Array[i] = raw.charCodeAt(i);
                    }
                    return new Blob([uInt8Array], {type: contentType});
                },

    2.  部分安卓手机,非微信,也有分享问题。

    var bIsAndroid = userAgent.match(/android/i)== "android";
     var	ua = navigator.userAgent.toLocaleUpperCase();
     var isWX = /micromessenger/i.test(ua);
    
    if(bIsAndroid && !isWX) {
         that.imgUrl =  URL.createObjectURL(that.base64ToBlob(canvas.toDataURL()))                     
    }else {
         that.imgUrl =  canvas.toDataURL()
    }
    
    
                       
    
  • 相关阅读:
    一周入门Linux 基础篇 虚拟机迁移和删除
    java修饰符的总结
    磁力种子搜索的网站
    python+爬虫+签名
    python中的matplotlib的一些基础用法
    K-means算法的实现
    Java的学习04
    Java的学习03
    Java的学习02
    Java的学习01
  • 原文地址:https://www.cnblogs.com/Super-scarlett/p/10856151.html
Copyright © 2011-2022 走看看