用JS获取Html中所有图片文件流然后替换原有链接
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中所有图片文件流然后替换原有链接的更多相关文章
- js获取URL中的参数
js获取URL中的一些参数的意思 location对象 含有当前URL的信息. 属性 href 整个URL字符串. protocol 含有URL第一部分的字符串,如http: host 包含有URL中 ...
- 文件_ _android从资源文件中读取文件流并显示的方法
======== 1 android从资源文件中读取文件流并显示的方法. 在android中,假如有的文本文件,比如TXT放在raw下,要直接读取出来,放到屏幕中显示,可以这样: private ...
- js获取jsp中的变量值
js获取jsp中的变量值,有两种方式: 1.jsp标签获取属性 var message = '<%=request.getAttribute("message")%>' ...
- js 获取url中的参数 修改url 参数 移除url参数
js 获取url中的参数 修改url 参数 移除url参数 var jsUrlHelper = { getUrlParam : function(url, ref) { var str = " ...
- 背水一战 Windows 10 (90) - 文件系统: 获取 Package 中的文件, 可移动存储中的文件操作, “库”管理
[源码下载] 背水一战 Windows 10 (90) - 文件系统: 获取 Package 中的文件, 可移动存储中的文件操作, “库”管理 作者:webabcd 介绍背水一战 Windows 10 ...
- js获取url中参数名也参数值
要撮利用js获取url中参数名也参数值这个不多见了,但我今天需要这样操作,下面我来给大家介绍一下具体的实例方法. 在已知参数名的情况下,获取参数值,使用正则表达式能很容易做到. js的实现方法如下 ...
- js获取url中的参数,并保证获取到的参数不乱码
//网上比较经典的js获取url中的参数的方法 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...
- 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数
一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
随机推荐
- 【Codeforces 776B】Sherlock and his girlfriend
[题目链接] 点击打开链接 [算法] 将所有质数染成1,合数染成2即可 [代码] #include<bits/stdc++.h> using namespace std; #define ...
- MongoDb复制集实现故障转移,读写分离
前言 数据库技术是信息系统的一个核心技术,发展很快,各种功能类型数据库层出不穷,之前工作中使用过关系型数据库(mysql.oracle等).面相对象数据库(db4o).key-value存储(Memc ...
- Com组件介绍
COM组件简介 面向对象的思想难以适应这种分布式软件模型,于是组件化程序设计思想得到了迅速的发展. 按照组件化的程序设计的思想,复杂的应用程序被设计成一些小的,功能单一的组件模块,这些组件模块可以运行 ...
- ML一些零散记录
朴素贝叶斯的假定条件:变量独立同分布 一般情况下,越复杂的系统,过拟合的可能性就越高,一般模型相对简单的话泛化能力会更好一点,增加隐层数可以降低网络误差(也有文献认为不一定能有效降低),提高精度,但也 ...
- codeforces 126B
Asterix, Obelix and their temporary buddies Suffix and Prefix has finally found the Harmony temple. ...
- 利用记事本和cmd进行java编程(从安装IDE--编译--运行)
java 最大特点---跨平台 所谓的跨平台性,是指软件可以不受计算机硬件和操作系统的约束而在任意计算机环境下正常运行.这是软件发展的趋势和编程人员追求的目标.之所以这样说,是因为计算机硬件的种类繁多 ...
- 02_通过scrollview实现内容滚动
在ScrollView里面放一个Button和TextView程序直接就挂了. ScrollView它只限制了有几个孩子,没限制有几个孙子.给Button和TextView套上一个爹LinearLay ...
- NYOJ7——街区最短路径问题
街区最短路径问题 时间限制:3000 ms | 内存限制:65535 KB 难度:4 描述:一个街区有很多住户,街区的街道只能为东西.南北两种方向.住户只可以沿着街道行走.各个街道之间的间隔相等 ...
- NYOJ1——A+B Problem NYOJ2——括号配对问题
A+B Problem 时间限制:3000 ms | 内存限制:65535 KB 难度:0 描述:此题为练手用题,请大家计算一下a+b的值 输入:输入两个数,a,b 输出:输出a+b的值 样 ...
- 洛谷P2564 [SCOI2009]生日礼物(单调队列)
传送门 准确的来说这个应该叫尺取法? 先对所有的点按$x$坐标进行排序 我们维护两个指针$l,r$,每一次令$r$不断右移直到所有颜色齐全,再不断右移$l$直到颜色数不足,那么此时$[l-1,r]$这 ...