canvas画图，toDataURL方法封装

URI（Uniform Resource Identifier）:统一资源标识符,服务器资源名被称为统一资源标识符 

URL（Uniform Resource Locator）:统一资源定位符，描述了一台特定服务器上某资源的特定位置

    function getBase64(url, callback) {
            //通过构造函数来创建的 img 实例，在赋予 src 值后就会立刻下载图片，相比 createElement() 创建 <img> 省去了 append()，也就避免了文档冗余和污染
            var Img = new Image()
            var dataURL = ''
            Img.setAttribute('crossorigin', 'anonymous') // 注意设置图片跨域应该在图片加载之前 (本地图片则不需要此设置)
            Img.src = url
            Img.onload = () => {
                //要先确保图片完整获取到，这是个异步事件
                var canvas = document.createElement("canvas") //创建canvas元素
                var width = Img.width //确保canvas的尺寸和图片一样
                var height = Img.height
                canvas.width = width
                canvas.height = height
                canvas.getContext("2d").drawImage(Img, 0, 0, width, height) //将图片绘制到canvas中
                dataURL = canvas.toDataURL("image/jpeg", 1) //转换图片为dataURL 图片质量0~1默认值0.92
                callback ? callback(dataURL) : null; //调用回调函数
            }
        }
        // 调用生成 URL（Uniform Resource Locator统一资源定位符
        // DataURL 格式：data:[<mediatype>][;base64],<data>
        getBase64('http://www.topfe.cn/wp-content/cache/Beginning/thumbnail/4dacbe492d7a-170x120.jpg', (dataURL) => {
            console.log(dataURL)
        })