<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8" />

    <title>Document</title>

</head>

<body>

	<img src="" alt="" />

    <script type = "text/javascript">

        function getBase64Image(img) {

            var canvas = document.createElement("canvas");

            canvas.width = img.width;

            canvas.height = img.height;

            var ctx = canvas.getContext("2d");

            ctx.drawImage(img, 0, 0, img.width, img.height);

            var dataURL = canvas.toDataURL("image/png");

            return dataURL // return dataURL.replace("data:image/png;base64,", "");

        }

        function main() {

            var img = document.createElement('img');

            img.src = 'images/1 (2).jpg';

            img.onload =function() {

                var data = getBase64Image(img);

                console.log(data);

            }

            document.body.appendChild(img);

        }

        main();

    </script>

</body>

</html>

js图片转换为base64的更多相关文章

  1. js 图片转换为base64

    <input id="file" type="file"> <img id="img" style="max-h ...

  2. js 图片转换为base64 (2)

    <input type="file" id="testUpload"> <img src="" id="img& ...

  3. js 图片转换base64 base64转换为file对象

    function getImgToBase64(url,callback){//将图片转换为Base64 var canvas = document.createElement('canvas'), ...

  4. JS 图片转Base64

    JS 图片转Base64 有时候需要向HTML中插入一张图片,可苦于上线后找不到一个合适的网盘来存储这些图片,有没有一种办法能将图片转换成文字,然后直接插入HTML中呢,通过Base64编码就可以解决 ...

  5. 将图片转换为base64 格式

    1.页面上的图片,转换成base64格式,可以通过canvas 的 toDataURL 例子:给定图片的url 将图片转换为base64 var imageSrc = "../images/ ...

  6. JAVA 将图片转换为Base64编码

    这里使用的jar包是commons-codec-1.10.jar; 示例代码 import java.io.FileInputStream; import java.io.FileOutputStre ...

  7. H5 Js图片转base64编码

    <!Doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. C# 图片转换为base64

    WebRequest webRequest = WebRequest.Create("验证码url"); WebResponse webResponse = webRequest. ...

  9. 【PHP】图片转换为base64，经过post传输后‘+’会变成 ‘空格’

    图片转换为base64,经过post传输后‘+’会变成 ‘空格’, 需要用PHP 处理一下 $str= $_POST['img_data']; $str= str_replace(' ','+',$s ...

随机推荐

  1. opencv3 学习三 - 图像输入输出显示等

    程序如下 #include "opencv2/opencv.hpp" using namespace cv; int main() { Mat file1 = imread(&qu ...

  2. python3 练习题100例 （九）

    题目九:题目:古典问题:有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第三个月后每个月又生一对兔子,假如兔子都不死,问每个月的兔子总数为多少?程序分析:兔子的规律为数列1,1,2,3,5 ...

  3. 分享一个强大的makedown编辑器

    Yosoro 官网地址 https://yosoro.coolecho.net/ 很强大,支持直接粘贴图片,是直接上传到github仓库. 可直接导出md,html,pdf格式,特别方便 找了好几天的 ...

  4. Scala学习笔记（五）—— 元组和集合

    1. 映射 映射Java中的Map,即Key/Value的数据形式 映射的创建,有以下两种方法 scala> val map =Map("Lisa" -> 90 , & ...

  5. AtCoder Regular Contest 100 E - Or Plus Max

    一道很好的dp题 dp[K]存的是 i满足二进制1属于K二进制1位置 最大的两个Ai 这样dp[K]统计的两个数肯定满足(i | j) <= K 然后不断做 update(dp[i | (1&l ...

  6. fedora19之后的版本安装mysql

    正准备学习linux平台的mysql,却发现在fedora21平台下安装mysql总是失败,查了些资料,总结如下: 错误示范: 按照安装软件的经验,习惯性输入以下的命令: $sudo dnf inst ...

  7. 北京Uber优步司机奖励政策（12月28日）

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  8. 成都Uber优步司机奖励政策（1月17日）

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  9. 长沙Uber优步司机奖励政策（1月11日~1月17日）

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  10. 【LG1393】动态逆序对

    [LG1393]动态逆序对 题面 洛谷 题解 \(CDQ\)分治,按照时间来分治 应为一个删除不能对前面的操作贡献,所以考虑一个删除操作对它后面时间的操作的贡献 用上一个答案减去次贡献即可 代码 #i ...