Hai iam 目前正在处理一个页面以从 json 中获取图像并希望存储在本地.. 这是我的代码...
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="eventorig.json"></script>
</head>
<body>
<img class="imageClass" src=""></img>
</body>
<script>
var url;
$(".imageClass").attr("src",localStorage.UrlImage);
for(var i in jsonData)
{
for(var j in jsonData[i].Events)
{
for(var key in jsonData[i].Events[j].Images)
{
url=jsonData[i].Events[j].Images[key].ImageUrl;
if(typeof(Storage)!=="undefined")
{
localStorage.UrlImage=url;
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support
web storage...";
}
}
}
console.log($(".imageClass").attr("src"));
}
</script>
</html>
下面是我的json
var jsonData={"ResponseCode":0,
"ApiVersion":0,
"Data":
{"Events":
[
{
"Id":1124,
"ImageCaption":"Hip flask",
"ImageUrl":"https://s3-ap-southeast-
2.amazonaws.com/drugdetectionapp-
media/1004/alcohol_para.jpg",
"Description":"des",
"DateUpdated":"2013-11-06T16:55:55"
},
]
我正在从中获取图像,但我无法将其存储在本地 我从那里搜索了很长时间,我只使用 Canvas 获得解决方案。我在这里寻找 Canvas 以外的解决方案 有可能吗??...等待您宝贵的命令谢谢
最佳答案
您可以尝试通过二进制 XMLHttpRequest 下载图像,然后将原始二进制数据转换为 base64 并存储。
注意同源策略,参见 http://en.wikipedia.org/wiki/Same-origin_policy
代码应该类似于这样:
var req = new XMLHttpRequest();
req.open("GET", https://s3-ap-southeast-2.amazonaws.com/drugdetectionapp-media/1004/alcohol_para.jpg", true);
req.responseType = "arraybuffer";
req.onload = function (event) {
var buffer = req.response;
if (buffer) {
var byteArray = new Uint8Array(buffer);
// Maybe you could also use buffer directly here...
var b64 = btoa(byteArray);
localStorage.setItem("imageData", b64);
}
};
req.send(null);
关于javascript - 将图像存储到 localStorage,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20141549/