根据图片地址src转base64格式

本地地址转换不需要考虑跨域问题
但图片是网上的链接需要解决浏览器提示的跨域问题
本人解决方法是chrome右键属性打开目标加–args --disable-web-security --user-data-dir=D:\MyChromeDevUserData
重新打开有提示就设置成功可以进行下一步

具体代码实现如下

<script>// 获取要装换的地址var img = document.querySelector('img').src// 图片地址转base64的方法function getBase64Image(img) {var canvas = document.createElement('canvas')canvas.width = img.widthcanvas.height = img.heightvar ctx = canvas.getContext('2d')ctx.drawImage(img, 0, 0, img.width, img.height)var ext = img.src.substring(img.src.lastIndexOf('.') + 1).toLowerCase()var dataURL = canvas.toDataURL('image/' + ext)return dataURL}var image = new Image()image.src = img// console.log(image.src)// 解决 canvas 将图片转为base64报错: Uncaught DOMException: Failed to execute 'toDataURL' on//  'HTMLCanvasElement': Tainted canvases may not be exportedimage.setAttribute('crossOrigin', 'anonymous')image.onload = function () {var base64 = getBase64Image(image)console.log(base64)let img = document.getElementById('img')// base64可以直接当做图片的src去赋值img.setAttribute('src', base64)}</script>

根据图片地址src转base64格式相关推荐

vue项目，把图片文件流转为base64格式以图片形式展示在前端
问题描述前台需要展示图片,期望后台直接返回图片地址,但是后台给的是的文件流而不是一个图片地址,需要把文件流转为base64的格式展示出来. 请求后台接口时,返回图片内容如下: 上图不是base64格 ...
input元素选择图片，并转换为base64格式在img标签显示
#input元素选择图片,并转换为base64格式在img标签显示 <body><input type="file"><img src="& ...
小程序字符串提取图片地址src导致苹果手机体验版白屏
小程序开发中想把一段html字符串里图片的src取出来,这段html字符串如下图: var srcReg = /(?<=(src="))[^"]*?(?=")/ig ...
img src 引入base64格式数据显示图片
看到公司项目里用 base64 传输数据到页面! 其中 jsp这么写的: <td><c:choose> <c:when test="${photo ...
PHP将图片验证码转换成base64格式
框架 TP5.0 对应的图形验证码包 composer require topthink/think-captcha v1.0.8 按照官方的描述其实是直接响应图片的可以查看entry方法: retu ...
JAVA 图片地址路径转换 Base64 工具类
工具类代码: import sun.misc.BASE64Encoder; import java.io.ByteArrayOutputStream; import java.io.FileInput ...
C++读写图片数据转成Base64格式
转载:http://www.cnblogs.com/jeray/p/8746976.html 转载:https://www.cnblogs.com/lujin49/p/4957742.html 转载: ...
php+打开图片二进制文件,php图片文件、二进制流、base64格式相互转化
1,php 图片文件.二进制流.base64格式相互转化$image = 'E:/www/logo.png'; //图片文件地址 $type = getimagesize($image)['mime ...
使用Js将图片转换为base64格式-在线示例
图片转base64-在线工具 <!Doctype html> <html><head><meta charset="utf-8" /> ...

根据图片地址src转base64格式

根据图片地址src转base64格式相关推荐

最新文章

热门文章