<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8" />

    <title>Document</title>

</head>

<body>

    <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/jpg"*/);

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

        }

        function main() {

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

            img.crossOrigin="anonymous";

            img.src = 'http://wechat.daopeng365.com/moni/taiyan.jpg';

            img.onload =function() {

                var datafe = getBase64Image(img); 

            }

            document.body.appendChild(img);

        }

        main();

    </script>

</body>

</html>

　　

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

  1. js将图片转为base64编码，以字符串传到后台存入数据库

    (前台在中approve_edit.html中,后台不变) 链接参考:http://www.cnblogs.com/Strom-HYL/p/6782176.html 该链接文中并没有用到easyUI的 ...

  2. 使用JS将图片转为Base64

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. canvas将图片转为base64

    最简例子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta ...

  4. JS 图片转Base64

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

  5. 011_如何decode url及图片转为base64文本编码总结

    一.咱们经常会遇到浏览器给encode后的url,如何转换成咱们都能识别的url呢?很简单,talk is easy,Please show me your code,如下所示: (1)英文decod ...

  6. H5 Js图片转base64编码

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

  7. html5 图片转为base64格式异步上传

    因为有这个需求(移动端),所以就研究了一下,发现还挺不错的.这个主要是用了html5的API,不需要其他的JS插件,不过只有支持html5的浏览器才行,就现在而言应该大部份都支持的.<!DOCT ...

  8. js 图片与base64互相转换

    js将图片转化为base64 参考地址:http://www.cnblogs.com/mr-wuxiansheng/p/6931077.html var img = "imgurl" ...

  9. jquery 图片转为base64

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

随机推荐

  1. Ubuntu 16.04安装ANSYS 2019 R1

    参考:<ANSYS15.0 for Linux下载及安装教程> 参考链接: https://wenku.baidu.com/view/92bdf21b312b3169a451a4b5.ht ...

  2. Mikrotik: Setup SSTP Server for Windows 10 Client

    原文: http://www.dr0u.com/mikrotik-setup-sstp-server-for-windows-10-client/ Basic how-to on SSTP for a ...

  3. 《HeadFirts设计模式》笔记

    定义 在某种情境下,针对某些问题的某种解决方案. 设计模式 1.可拓展性强,方便维护,能够应付变化. 何时使用设计模式 设计之前,还有在重构的时候. OOP 可复用,可扩充,可维护 设计模式原则 1. ...

  4. 深入理解 JavaScript 中的 class

    在 ES6 规范中,引入了 class 的概念.使得 JS 开发者终于告别了,直接使用原型对象模仿面向对象中的类和类继承时代. 但是JS 中并没有一个真正的 class 原始类型, class 仅仅只 ...

  5. GKE logging查看

    用命令行方式可以查看GKE的log,比如: gcloud logging read 'resource.type="k8s_container" AND resource.labe ...

  6. ASP.NET Core Windows服务开发技术实战演练

    一.课程介绍 人生苦短,我用.NET Core!大家都知道如果想要程序一直运行在Windows服务器上,最好是把程序写成Windows服务程序:这样程序会随着系统的自动启动而启动,自动关闭而关闭,不需 ...

  7. 《Linux就该这么学》培训笔记_ch14_使用DHCP动态管理主机地址

    <Linux就该这么学>培训笔记_ch14_使用DHCP动态管理主机地址 文章最后会post上书本的笔记照片. 文章主要内容: 动态主机地址管理协议 部署dhcpd服务程序 自动管理IP地 ...

  8. 在电脑上部署网站lls 浏览器上访问

    在win7 上安装,首先是要进入lls中进行设置,这是第一种方法: 通过图形化的操作方式进行设置, 这个界面中的东西都比较重要,电脑出现问题的话一般在这都可以进行调整,程序和功能可以用来管理你安装的软 ...

  9. Github 上的个人项目开源心得

    原文链接 https://elfgzp.cn/2019/12/09/gortal-site-project 由于最近在 Github 发了一个个人开源项目 - 「gortal」一个使用 Go 语言开发 ...

  10. Git系列 —— github提交一个空目录

    转载自github提交一个空目录 github默认不上传空目录,有的时候需要空目录来保持程序的结构. 两种场景 1.始终保持空目录,即时里面有文件,也全部忽略掉. 建立一个.gitignore文件放到 ...