0

我正在尝试使用 XMLHttpRequest 从共享点库中获取图像。但是在转换一个奇怪的字符串时失败了

����JFIFS���E������..

返回图像。

我设法获得了我的共享点文件的 URL，当我把它放在浏览器中时，它会自动下载图像。我还获得了 accessToken 以获得对文件的权限。

我尝试使用外部脚本中的 base64 编码器来转换 responseText，但无法显示为图像。顺便说一句，window.atob()orwindow.btoa()似乎对我的 responseText 没有任何作用。

我不确定我从要处理的 responseText 收到什么样的格式。因为我尝试手动将图像转换为base64进行测试，这样开始

/9j/4AAQSkZJRgABAQAAAQABAAD/2wB..

. 但是，我使用我在网上找到的 base64encoder 得到的字符串是这样开始的

/f39/QAQSkZJRgABAQAAAQABAAD9/QBDAAs..

<div><img id="imgplaceholder" alt="place here"/></div>
<script>
var url =...;
var accessToken = ...;
var xhr = new XMLHttpRequest();
xhr.open("GET",url,true);
xhr.setRequestHeader("Accept","application/json; odata=verbose");
xhr.setRequestHeader("Authorization", "Bearer " + accessToken);
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        var data = xhr.responseText;
        //or var data = base64Encode(data);
        document.getElementById("imgplaceholder").src = "data:image/jpeg;base64," + data;
    }else{
        alert(xhr.status + ":\n " + xhr.responseText);
    }
} 
</script>

我希望图像显示在 中，但没有任何反应。我也尝试过使用ajax，但注意到工作。请问有人可以帮我吗？

我正在关注这个https://sharepoint.stackexchange.com/questions/231251/fetch-and-display-image-from-sharepoint-list-javascript

4

1 回答 1

0

希望下面的脚本对您有所帮助。

<script type="text/javascript">        
    function Uint8ToBase64(u8Arr) {
        var CHUNK_SIZE = 0x8000; //arbitrary number
        var index = 0;
        var length = u8Arr.length;
        var result = '';
        var slice;
        while (index < length) {
            slice = u8Arr.subarray(index, Math.min(index + CHUNK_SIZE, length));
            result += String.fromCharCode.apply(null, slice);
            index += CHUNK_SIZE;
        }
        return btoa(result);
    }
    $(function () {
        var url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/GetFileByServerRelativeUrl('" + _spPageContextInfo.siteServerRelativeUrl + "/MyDoc/panda.jpg')/openbinarystream";
        var xhr = new window.XMLHttpRequest();
        xhr.open("GET", url, true);
        //Now set response type
        xhr.responseType = 'arraybuffer';
        xhr.addEventListener('load', function () {
            if (xhr.status === 200) {
                var sampleBytes = new Uint8Array(xhr.response);
                var imageBase64 = Uint8ToBase64(sampleBytes);
                document.getElementById("imgplaceholder").src = "data:image/jpeg;base64," + imageBase64;
            }
        })
        xhr.send();
    })

</script>
<div><img id="imgplaceholder" alt="place here" /></div>
于 2019-01-25T03:37:32.187 回答