XMLHttpRequest文件上传在IE11中不起作用

问题描述

我的页面上有以下JS.它在chrome和firefox上运行良好.但它不能在Internet Explorer 11上使用.我是Salesforce开发人员，并且对JavaScript的了解不多.您能帮我找到问题所在吗?预先感谢.

Hi I have the following JS on my page. It is working fine on chrome and firefox. but its not working on Internet Explorer 11. I'm a salesforce developer and I don't know much javascript. Can you please help me find where the issue is?Thanks in advance.

tests = {
        filereader: typeof FileReader != 'undefined',
        dnd: 'draggable' in document.createElement('span'),
        formdata: !!window.FormData,
        progress: "upload" in new XMLHttpRequest
    },
    support = {
        filereader: document.getElementById('filereader'),
        formdata: document.getElementById('formdata'),
        progress: document.getElementById('progress')
    },
    progress = document.getElementById('uploadprogress'),
    fileupload = document.getElementById('upload');

    "filereader formdata progress".split(' ').forEach(
        function (api) {
            if (tests[api] === false) {
                support[api].className = 'fail';
            } else {
                support[api].className = 'hidden';
            }
        }
    );

    function textBeforeDrag(flag){
        if(flag)
        {
            holder_txt1.className = '';
            holder_txt2.className = 'hidden';
        }else{
            holder_txt1.className = 'hidden';
            holder_txt2.className = '';
        }
    }

    function resetAll()
    {
        holder.className = holder_txt1.className = '';
        holder_txt2.className = uploadStatus.className = 'hidden';
    }

    function readfiles(files) {

        var goodSize = true;
        var formData = tests.formdata ? new FormData() : null;
        for (var i = 0; i < files.length; i++) {
            size = typeof ActiveXObject !== 'undefined' ?
                        getIEFileSize(files[i])
                        :
                        files[i].fileSize || files[i].size;
            goodSize = 5000000 > size;
            if(!goodSize)
            {
                alert(files[i].name +' is too large, please choose a file that is 5Mb or less');
                return;
            }
            goodSize = 26214400 > size+{!allAttSize};
            if(!goodSize)
            {
                alert(this.files[0].name +' is too large - Total Attachment Size should not exceed 25MB');
                return;
            }
            uploadStatus.className = '';
            holder.className = 'hidden';

            // now post a new XHR request
            if (tests.formdata) {
                var xhr = new XMLHttpRequest();

                var sfdcurl = 'https://'+sfdcHostName+'.salesforce.com/services/apexrest/DragAndDrop/v1?FileName='+encodeURIComponent(files[i].name)+'&cType='+encodeURIComponent(files[i].type)+ '&parId={!thisCase.id}';

                xhr.open('POST','/services/proxy' );

                xhr.setRequestHeader("Authorization","Bearer {!$Api.Session_ID}");
                xhr.setRequestHeader('SalesforceProxy-Endpoint', sfdcurl);
                xhr.setRequestHeader('X-User-Agent', 'DragAndDropAPI v1.0');

                xhr.onload = function() {
                    progress.value = progress.innerHTML = 100;
                };

                if (tests.progress) {
                    xhr.upload.onprogress = function (event) {
                        if (event.lengthComputable) {
                            var complete = (event.loaded / event.total * 100 | 0);
                            progress.value = progress.innerHTML = complete;
                        }
                    }
                }

                xhr.onreadystatechange=function()
                {
                    if (xhr.readyState==4 && xhr.status != 200)
                    {
                        if(xhr.responseText)
                            alert(xhr.responseText);
                        else
                            alert('Some error occurred while uploading file');

                        console.log(xhr);
                    }else{

                    }
                }
                xhr.send(files[i]);
            }
        }
        setTimeout(function(){addDroppedAttachment();},1000);
    }

    if (tests.dnd) {
        holder.ondragover = function () {
            this.className = 'hover';
            textBeforeDrag(false);
            return false;
        };
        holder.ondragend = function () {
            this.className = '';
            textBeforeDrag(true);
            return false;
        };
        holder.ondrop = function (e) {
            textBeforeDrag(true);
            this.className = '';
            e.preventDefault();
            readfiles(e.dataTransfer.files);
            resetAll();
        }
    } else {
        fileupload.className = 'hidden';
        fileupload.querySelector('input').onchange = function () {
            readfiles(this.files);
        };
    }

推荐答案

所在行:

var xhr = new XMLHttpRequest();

更改为:

var xhr = new ActiveXObject('Msxml2.XMLHTTP');

现在，您的文件上传工作仅在Internet Explorer 11中仅进行.

Now, your file upload work only in Internet Explorer 11.

也许，要让您上传文件以在所有导航器(支持XMLHTTPRequest)中工作，请尝试以下操作:

Maybe, for you file upload to work in all navigator's (that support XMLHTTPRequest), try this:

if('ActiveXObject' in window){
   return new ActiveXObject('Msxml2.XMLHTTP');
}else{
   return new XMLHttpRequest();
}

来源: http://www.purplesquirrels.com .au/2014/06/local-ajax-calls-ie11/.

这篇关于XMLHttpRequest文件上传在IE11中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！