通过AJAX获取OOS上的图片并且转换成BASE64

我这里有一个在上的html5页面（单.html页面，非php。。。等动态页面）

现在，在自己的 ecs服务器在上面有一个HTML5页面（纯.html页面，非php。。。等动态页面）。通过Ajax（XmlHttpRequest）请求存储于OSS上的图片时，因域名不同，会产生跨域错误。
需要AJAX去跨域请求oss上的图片资源，到本地进行BASE64编码但是请求的结果是被拒绝调用，最好能够给个简单的演示，十分感谢

我调用的代码如下：

代码如下

<script type="text/javascript">

function urlreadimg()
{

var eleAppend = document.getElementById("result");
var xhr = new XMLHttpRequest();
console.debug(" xhr.open");
xhr.open("GET","http://oss-cn-hangzhou.aliyuncs.com/friday-head/photo_11010119_1428718533175.jpg",true);
xhr.responseType = "blob";
xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
xhr.onreadystatechange=function()
{
if (xhr.readyState==4 && xhr.status==200)
{
// document.getElementById("myDiv").innerHTML=xhr.responseText;

console.debug("将this.response 赋值给BLOB");
  var blob = xhr.response;
  var img = document.createElement("img");
  img.onload = function(e) {
    window.URL.revokeObjectURL(img.src); // 清除释放
  };
   img.src = window.URL.createObjectURL(blob);
  eleAppend.appendChild(img);
}
}


xhr.send();

}




</script>

<p>

<input type="button" value="读取aliyun文件" onclick="urlreadimg()" />

</p>
<div id="result" name="result"></div>
<div id="result" name="results"></div>

看了几个帖子说要设置CORS 完全不懂的怎么弄。
还有个帖子说要弄python....完全没必要吧。
希望大神们给指导

展开

收起

新人-随意 2015-04-13 00:25:15 13649 0

4 条回答

写回答

取消提交回答

stonewen123

Re通过AJAX获取OOS上的图片并且转换成BASE64
最好把报的错给贴出来，好具体分析

2015-07-16 16:59:04

赞同展开评论打赏
废客泉

Re通过AJAX获取OOS上的图片并且转换成BASE64
看我的帖子：阿里云OSS跨域AJAX上传OPTIONS请求403问题的解决方案
http：//bbs.aliyun.com/read/250407.html

2015-07-16 16:52:46

赞同展开评论打赏
小马锅

Re通过AJAX获取OOS上的图片并且转换成BASE64
有和你一样的需求,等解决!

2015-07-16 10:44:34

赞同展开评论打赏
新人-随意

Re通过AJAX获取OOS上的图片并且转换成BASE64
friday-head 已经设置为公共读。

查到相关的帖子有这些

http://bbs.aliyun.com/read/132659.html?spm=5176.7114037.1996646101.10.5AguUI&pos=4

说要设置报文头。好像我设置了也无效。

这个帖子是说用python... 个人觉得没有这个必要。
http://bbs.aliyun.com/read/166928.html?spm=5176.7114037.1996646101.4.0bO9QD&pos=2

-------------------------

Re通过AJAX获取OOS上的图片并且转换成BASE64

2015-04-13 00:42:46

赞同展开评论打赏