HTML5 Upload不会在Server上存储文件

时间:2015-10-30 10:16:26

标签: javascript jquery html5 asp-classic

我使用upload api开发了一个 XMLHTTPRequest Formdata Uploader。 我的Javascript运行没有错误,上传状态结束正确 上传完成。我正在使用 Windows Server 2008 ans 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-Part

        <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为每个预览图像单独上传图像。因此,此函数使用file-control作为参数调用uploadFiles函数。代码运行没有任何问题,但图像不存储在服务器目录中。请随便告诉我,我有问题吗?

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

非常感谢任何解决方案 勒

1 个答案:

答案 0 :(得分:0)

你说过:

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

...将覆盖默认标头并销毁分隔符信息(因此服务器不会知道某个部分的结束位置和下一个部分的开始位置。)

不要那样做。