1溉潭、封裝工具函數(shù)殊轴，將url地址呵曹，轉(zhuǎn)換為base64格式輸出

function getBase64(url, callback) {
        //通過構(gòu)造函數(shù)來創(chuàng)建的 img 實(shí)例殊橙，在賦予 src 值后就會(huì)立刻下載圖片殖妇，相比 createElement() 創(chuàng)建 <img> 省去了 append()，也就避免了文檔冗余和污染
        var Img = new Image(),
          dataURL = '';

        //Img.src = url +"?v=" + Math.random(); // 處理緩存,fix緩存bug,有緩存改橘，瀏覽器會(huì)報(bào)錯(cuò);
        //Img.setAttribute("crossOrigin", 'Anonymous') // 解決控制臺(tái)跨域報(bào)錯(cuò)的問題
      //下面已修正ios的兼容微信打開失敗的原因
        Img.setAttribute("crossOrigin", 'Anonymous') // 解決控制臺(tái)跨域報(bào)錯(cuò)的問題
        Img.src = url +"?v=" + Math.random(); // 處理緩存,fix緩存bug,有緩存滋尉，瀏覽器會(huì)報(bào)錯(cuò);

        Img.onload = function () { //要先確保圖片完整獲取到，這是個(gè)異步事件
          var canvas = document.createElement("canvas"), //創(chuàng)建canvas元素
            width = Img.width, //確保canvas的尺寸和圖片一樣
            height = Img.height;
          canvas.width = width;
          canvas.height = height;
          canvas.getContext("2d").drawImage(Img, 0, 0, width, height); //將圖片繪制到canvas中
          dataURL = canvas.toDataURL('image/jpeg'); //轉(zhuǎn)換圖片為dataURL
          callback ? callback(dataURL) : null; //調(diào)用回調(diào)函數(shù)
        };
      }

getBase64('http://p1.pstatp.com/large/435d000085555bd8de10', (dataURL) => { console.log(dataURL) })

如果圖片是oss 要在后臺(tái)設(shè)置白名單 否則提示跨域
參考網(wǎng)站https://blog.csdn.net/qq_42991509/article/details/100925856

以上辦法飞主，ios的微信生成失敗狮惜，參考文章https://blog.csdn.net/DavidFFFFFF/article/details/95217076

有沒有注意到crossOrigin屬性是在src屬性之后賦值的；/(ㄒoㄒ)/~~
crossOrigin屬性必須在src屬性之前賦值
crossOrigin屬性必須在src屬性之前賦值
crossOrigin屬性必須在src屬性之前賦值
盡管沒有找到準(zhǔn)確的文檔明確指定crossOrigin屬性必須在src屬性之前賦值碌识，但是要適配IOS確實(shí)要這么做碾篡；
大家如果對 crossorigin 有疑問可以看一下MDN對crossorigin的解釋：
————————————————
版權(quán)聲明：本文為CSDN博主「DavidFFFFFF」的原創(chuàng)文章，遵循CC 4.0 BY-SA版權(quán)協(xié)議筏餐，轉(zhuǎn)載請附上原文出處鏈接及本聲明开泽。
原文鏈接：https://blog.csdn.net/DavidFFFFFF/java/article/details/95217076

如果在微信調(diào)試的話，可以使用這個(gè)捕捉錯(cuò)誤信息

                try {
                    // 將canvas對象轉(zhuǎn)化為image/png
                    dataURL = canvas.toDataURL('image/jpeg')
                    alert(dataURL)
                } catch (err) {
                    alert(err)
                }