HTML5 Upload 不在服务器上存储文件答案

【问题标题】：HTML5 Upload doesn't storing file on ServerHTML5 Upload 不在服务器上存储文件
【发布时间】：2016-01-30 17:41:11
【问题描述】：

我使用上传 api 开发了一个 XMLHTTPRequest Formdata Uploader。我的 Javascript 运行没有错误，上传状态以正确结束上传完成。我正在使用 windows Server 2008 和 ASP Classic。但我认为，ASP Classic 不是问题。我想，我有数据传输问题。下面是我的代码。

        function sendForm(form, btn) {
        for (x=0; x < document.getElementById("auswahl").files.length; x++){    
            uploadFiles(document.getElementById("auswahl"));
        }
    }
    var url= "http://www.centil-europe.ch/db/Images/test/";
    //$(document).ready(function(){
    //  document.getElementById('upload').addEventListener('change', function(e) {
        function uploadFiles(filecntrl){
            var file = filecntrl.files[0];
            var xhr = new XMLHttpRequest();
            xhr.file = file; // not necessary if you create scopes like this
            xhr.addEventListener('progress', function(e) {
                var done = e.position || e.loaded, total = e.totalSize || e.total;
                console.log('xhr progress: ' + (Math.floor(done/total*1000)/10) + '%');
            }, false);
            if ( xhr.upload ) {
                xhr.upload.onprogress = function(e) {
                    var done = e.position || e.loaded, total = e.totalSize || e.total;
                    console.log('xhr.upload progress: ' + done + ' / ' + total + ' = ' + (Math.floor(done/total*1000)/10) + '%');
                };
            }
            xhr.onreadystatechange = function(e) {
                if ( 4 == this.readyState ) {
                    console.log(['xhr upload complete', e]);
                }
            };
            xhr.open('post', url, true);
            xhr.setRequestHeader("Content-Type","multipart/form-data");
            var formData = new FormData();
            formData.append("thefile", file);
            xhr.send(formData);
        }
    //  }, false);
    //});

还有 HTML 部分

        <BODY bgcolor="#FFFFFF" link="#999900" vlink="#CCCC33" alink="#999966">
    <table cellSpacing="0" cellPadding="4" width="767" align="center" height="100" border="0" bgcolor="#FFFFFF">
      <tbody>
        <tr>
          <td vAlign="middle" width="100%" height="100" bgcolor="#F5F5F5">
        <FORM METHOD="POST" ENCTYPE="multipart/form-data" id="iduploadfrm">
            <Input Type="hidden" Name="ID" value="<%=ID%>">

            <TABLE BORDER=0 class="Tabelle">
        <tr>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td><b>File zum uploaden ausw&auml;hlen:</b><br>
            <input type=FILE size=50 name="FILE1" class="Textfield" id="auswahl" multiple>
          </td>
        </tr>
        <tr><td><!--//Database&nbsp;<INPUT TYPE=RADIO NAME="saveto" value="database">//-->
        </td>
        </tr>
        <tr align="right"> 
          <td> 
            <INPUT TYPE=SUBMIT VALUE="Upload!" class="Button">
          </td>
        </tr>
        </TABLE>
            <!-- The table listing the files available for upload/download -->
        <table role="presentation" class="table table-striped" id="tblpresentation">
        <tbody class="files">
            <tr class="template-upload fade in" id="filetbl" style="visibility:hidden">
                <td width="17%">
                    <span id="idimage" class="preview"></span>
                </td>
                <td width="16%">
                    <p class="name">&nbsp;</p>
                    <strong class="error text-danger"></strong>
                </td>
                <td width="26%">
                    <p class="size" id="size">&nbsp;</p></td>
                <td width="41%">
                    <button class="btn btn-primary start" id="idstart" onClick="sendForm(document.getElementById('iduploadfrm'),this);">
                        <span>Start</span>
                    </button>
                    <button class="btn btn-warning cancel">
                        <i class="glyphicon glyphicon-ban-circle"></i>
                        <span>Cancel</span>
                    </button>
                </td>
            </tr>
        </tbody>
    </table>
    </FORM>
    </table>

我有一个带有按钮的预览图像表。单击此按钮时，事件会以按钮为参数调用函数 sendForm。稍后我会检查，单击按钮 id 以分别为每个预览图像上传图像。因此，此函数以文件控制为参数调用 uploadFiles 函数。代码运行没有任何问题，但图像未存储在服务器目录中。请问有什么问题可以告诉我吗？

在服务器端，文件夹具有 IIS，而 Network_Service 具有读写权限。

非常感谢任何解决方案勒内

【问题讨论】：

“我在想，我遇到了数据传输问题”——你对这个假设做了什么？您是否查看了浏览器开发者工具的“网络”选项卡并发现该文件不在请求中？
是的，如前所述，我已经检查过上传状态，例如 40% 70%、100% 和上传成功是否正确返回。数据类型可能有问题吗？我认为该文件必须传输二进制文件并在新文件中写入服务器端？

标签： javascript jquery html asp-classic

【解决方案1】：

你说过：

xhr.setRequestHeader("Content-Type","multipart/form-data");

...这将覆盖默认标头并破坏分隔符信息（因此服务器将不知道一个部分在哪里结束，下一个部分开始）。

不要那样做。

【讨论】：