function displayHtmlWithImageStream(bodyHtml) {

var imgReg = /<img.*?(?:>|\/>)/gi;

var arr = bodyHtml.match(imgReg);

if (arr != null) {

for (var i = 0; i < arr.length; i++) {

replaceImageUrlWithStream(bodyHtml, arr, i);

}

}

}

function replaceImageUrlWithStream(bodyHtml, arr, i) {

$scope.body = bodyHtml;

var images = arr[i];

var srcReg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i;

var src = images.match(srcReg);

var url = src[1];

var type = 'image/' + url.split('.').pop();

var imgDataObject = {};

assetHelper.getAsset(url, imgDataObject, getAssetSuccess, getAssetError);

function getAssetSuccess(data) {

var imgDataUrl = data.url;

$scope.body = $scope.body.replace(url, 'data:' + type + ';base64,' + imgDataUrl);

}

}

function getAssetError(url, reason) {

$scope.body = $scope.body.replace(url, '#');

}

function getAsset(url, assetModel, success, fail) {

serviceBase.get({ url: url, responseType: 'arraybuffer' })

.success(function (response) {

assetModel.url = base64ArrayBuffer(response);

success(assetModel);

})

.error(function (url, reason) {

fail(url, reason);

});

}

// Converts an ArrayBuffer directly to base64, without any intermediate 'convert to string then

// use window.btoa' step. According to my tests, this appears to be a faster approach:

// http://jsperf.com/encoding-xhr-image-data/5

function base64ArrayBuffer(arrayBuffer) {

var base64 = '';

var encodings = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';

var bytes = new Uint8Array(arrayBuffer);

var byteLength = bytes.byteLength;

var byteRemainder = byteLength % 3;

var mainLength = byteLength - byteRemainder;

var a, b, c, d;

var chunk;

// Main loop deals with bytes in chunks of 3

for (var i = 0; i < mainLength; i = i + 3) {

// Combine the three bytes into a single integer

chunk = (bytes[i] << 16) | (bytes[i + 1] << 8) | bytes[i + 2];

// Use bitmasks to extract 6-bit segments from the triplet

a = (chunk & 16515072) >> 18; // 16515072 = (2^6 - 1) << 18

b = (chunk & 258048) >> 12; // 258048   = (2^6 - 1) << 12

c = (chunk & 4032) >> 6; // 4032     = (2^6 - 1) << 6

d = chunk & 63;               // 63       = 2^6 - 1

// Convert the raw binary segments to the appropriate ASCII encoding

base64 += encodings[a] + encodings[b] + encodings[c] + encodings[d];

}

// Deal with the remaining bytes and padding

if (byteRemainder == 1) {

chunk = bytes[mainLength];

a = (chunk & 252) >> 2; // 252 = (2^6 - 1) << 2

// Set the 4 least significant bits to zero

b = (chunk & 3) << 4; // 3   = 2^2 - 1

base64 += encodings[a] + encodings[b] + '==';

} else if (byteRemainder == 2) {

chunk = (bytes[mainLength] << 8) | bytes[mainLength + 1];

a = (chunk & 64512) >> 10; // 64512 = (2^6 - 1) << 10

b = (chunk & 1008) >> 4; // 1008  = (2^6 - 1) << 4

// Set the 2 least significant bits to zero

c = (chunk & 15) << 2; // 15    = 2^4 - 1

base64 += encodings[a] + encodings[b] + encodings[c] + '=';

}

return base64;

}

用JS获取Html中所有图片文件流然后替换原有链接的更多相关文章

  1. js获取URL中的参数

    js获取URL中的一些参数的意思 location对象 含有当前URL的信息. 属性 href 整个URL字符串. protocol 含有URL第一部分的字符串,如http: host 包含有URL中 ...

  2. 文件_ _android从资源文件中读取文件流并显示的方法

    ======== 1   android从资源文件中读取文件流并显示的方法. 在android中,假如有的文本文件,比如TXT放在raw下,要直接读取出来,放到屏幕中显示,可以这样: private ...

  3. js获取jsp中的变量值

    js获取jsp中的变量值,有两种方式: 1.jsp标签获取属性 var message = '<%=request.getAttribute("message")%>' ...

  4. js 获取url中的参数 修改url 参数 移除url参数

    js 获取url中的参数 修改url 参数 移除url参数 var jsUrlHelper = { getUrlParam : function(url, ref) { var str = " ...

  5. 背水一战 Windows 10 (90) - 文件系统: 获取 Package 中的文件, 可移动存储中的文件操作, “库”管理

    [源码下载] 背水一战 Windows 10 (90) - 文件系统: 获取 Package 中的文件, 可移动存储中的文件操作, “库”管理 作者:webabcd 介绍背水一战 Windows 10 ...

  6. js获取url中参数名也参数值

    要撮利用js获取url中参数名也参数值这个不多见了,但我今天需要这样操作,下面我来给大家介绍一下具体的实例方法.   在已知参数名的情况下,获取参数值,使用正则表达式能很容易做到. js的实现方法如下 ...

  7. js获取url中的参数,并保证获取到的参数不乱码

    //网上比较经典的js获取url中的参数的方法 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...

  8. 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数

    一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...

  9. JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )

    1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...

随机推荐

  1. 非常精彩的Silverlight 2控件样式

    概述 大家是否觉的现在Silverlight 2提供的默认的控件不能满足自己的要求?好在Silverlight的控件可以运用皮肤,微软Silverlight控件的设计者的主管Corrina开发了几套非 ...

  2. 一步一步学Silverlight 2系列(26):基本图形

    概述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, ...

  3. Oracle备份与恢复:冷备份恢复

    模拟数据库数据文件丢失的情况下,通过丢失之前的数据文件物理备份做恢复: 说明:数据文件丢失前一刻的所有归档日志都存在. 环境:oracle10g +rhel5 1.关闭数据库,copy system0 ...

  4. [原创]java调用PageOffice生成word

    一.在开发OA办公或与文档相关的Web系统中,难免会遇到动态生成word文档的需求,为了解决工作中遇到导出word文档的需求,前一段时间上网找了一些资料,在word导出这方面有很多工具可以使用,jac ...

  5. Android Studio手动下载配置Gradle的方法

    1 问题 (1) android sutdio第一次打开一个工程巨慢怎么办? (2) 手动配置Gradle Home为什么总是无效? (3) 明明已经下载了Gradle,配置了gradle home, ...

  6. html 样式之style属性的使用

    转自:https://www.ggbiji.com/html-style.html html中的style属性是用来改变html元素的样式的,样式是 在html 4 引入的,它是改变 html元素样式 ...

  7. 设计模式-策略模式---Strategy(对象行为型)

    策略模式 1.概念 分别封装起来,让他们之间可以相互替换,此模式让算法的变化独立于使用算法的客户. 2.代码实现:(模拟鸭子应用)https://git.oschina.net/ipnunu/Desi ...

  8. 51nod 1051 最大子矩阵和(DP)

    题意 略 分析 一道经典的DP题,但是我弱到差点做不出来,真的垃圾 设置\(sum(i,j)代表1-i行第j列的前缀和\),然后枚举行i和行j,再枚举列k,做一遍类似一维的最大子段和即可 #inclu ...

  9. python __builtins__ property类 (55)

    55.'property',  获取对象的所有属性 class property(object) | property(fget=None, fset=None, fdel=None, doc=Non ...

  10. bzoj 1031: [JSOI2007]字符加密Cipher【后缀数组】

    算是SA的裸题了 把串复制一遍接在原串后面,然后求SA,然后按着SA的顺序输出尾字符即可 #include<iostream> #include<cstdio> #includ ...