zoukankan      html  css  js  c++  java
  • 文本域(input file)上传文件的深入探究

      最近在要做一个文件上传方面的功能,看了一些资料,有收获在这里跟大家分享一下。

      大家应该都知道html表单元素<input type="file"/>是用来上传文件的。但是它究竟是如何传递的后台,后台又如何将数据提取出来呢?我们一起来看看。

      首先我们写一个普通的表单提交。

      

    View Code
    1 <form id="testForm" action="upload.ashx" method="post" enctype="multipart/form-data">
    2 <input type="file" onchange="javascript:document.getElementById('testForm').submit();" runat="server" id="fileBox" name="fileBox"/>
    3 </form>

      然后新建一个一般处理程序upload.ashx,ProcessRequest内的代码如下。

      

     1             context.Response.ContentType = "text/plain";
    2 HttpRequest request = context.Request;
    3 int totalByets = request.TotalBytes;//传入数据流的总大小
    4 int readedBytes = 0;
    5 byte[] biData;
    6 string end = "";
    7 while (readedBytes < totalByets)
    8 {
    9 if ((totalByets - readedBytes) < 1024)
    10 biData = request.BinaryRead(totalByets);
    11 else
    12 biData = request.BinaryRead(1024);
    13 Encoding encod = Encoding.Default;
    14 readedBytes += 1024;
    15 end += encod.GetString(biData);
    16 }
    17 context.Response.Write(end);
    18 context.Response.End();

    我们新建一个文本文档test.txt。假设内容为“测试文档”。

    运行上面的网页,选择文件test.txt.我们将看到如下内容。

    ------WebKitFormBoundaryNfHsy1JK9aIAQ0SS
    Content-Disposition: form-data; name="file1"; filename="test.txt"
    Content-Type: text/plain
    
    测试文档
    ------WebKitFormBoundaryNfHsy1JK9aIAQ0SS--
    
    
    由此看见,由表单提交上来的数据流中包含了一些如文件名、文件类型等信息。同时这些信息是用一些特定的字符包裹的。如本例中的“------WebKitFormBoundaryNfHsy1JK9aIAQ0SS”。(可以用context.Request.ServerVariables[HTTP_CONTENT_TYPE]取到)
    同样如果是选择图片文件的话,情况类似。
    以上只是为了搞懂form传过来的数据结构。我们可以直接使用context.Request.Files来获取表单传递过来的文件。
  • 相关阅读:
    在IE和Firfox获取keycode
    using global variable in android extends application
    using Broadcast Receivers to listen outgoing call in android note
    help me!virtual keyboard issue
    using iscroll.js and iscroll jquery plugin in android webview to scroll div and ajax load data.
    javascript:jquery.history.js使用方法
    【CSS核心概念】弹性盒子布局
    【Canvas学习笔记】基础篇(二)
    【JS核心概念】数据类型以及判断方法
    【问题记录】ElementUI上传组件使用beforeupload钩子校验失败时的问题处理
  • 原文地址:https://www.cnblogs.com/hnlong1/p/2240494.html
Copyright © 2011-2022 走看看