JavaScript 之 使用 XMLHttpRequest 上传文件

1    <div id="div1">

2             <input type="file" id="uploadfile" style="width: 100px; height: 25px;" />

3             <input id="b1" type="button" value="上传" style="display: inline-block; width: 40px; height: 25px;" />

4         </div>

js脚本：

https://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html

http://dev.w3.org/2006/webapi/FileAPI/

 1 window.onload = function () {

 2     document.getElementById("uploadfile").addEventListener("change", function () {

 3         //1、获取所选的文件 暂时只选一个

 4 

 5         var filereader = new FileReader();

 6         filereader.onloadend = function (event) {

 7             console.log("a");

 8             var filedata = event.target.result;

 9             var request = new XMLHttpRequest();

10             request.open("POST", "Handler1.ashx", true);

11             var formdata = new FormData();

12             formdata.append(file.name, file);

13             request.send(formdata);

14         }

15         filereader.onloadstart = function (event) {

16             console.log("b");

17 

18         }

19         var file = document.getElementById("uploadfile").files[0];

20         var fileblob = filereader.readAsArrayBuffer(file);

21     }, true);

22 }

C#

 1 using System;

 2 using System.Collections.Generic;

 3 using System.Linq;

 4 using System.Web;

 5 using System.Text;

 6 using System.IO;

 7 using System.Data;

 8 namespace WebApplication1

 9 {

10     /// <summary>

11     /// Handler1 的摘要说明

12     /// </summary>

13     public class Handler1 : IHttpHandler

14     {

15         public byte[] buffer = null;

16         public FileStream filestream = null;

17         public void ProcessRequest(HttpContext context)

18         {

19 

20             int length = Convert.ToInt32(context.Request.Files[0].InputStream.Length);

21             buffer = new byte[length];

22 

23             //context.Request.InputStream.Read(buffer, 0, length);

24             context.Request.Files[0].InputStream.Read(buffer, 0, length);

25 

26             string direcotry = System.Environment.CurrentDirectory;

27             direcotry = context.Request.Path;

28             direcotry = context.Request.MapPath("\\");

29             string filename = context.Request.Files[0].FileName;//文件名

30             string hzm = filename.Substring(filename.LastIndexOf("."));//后缀名

31 

32             filestream = new FileStream(direcotry + DateTime.Now.Ticks.ToString() + hzm, FileMode.Create);

33             filestream.Write(buffer, 0, buffer.Length);

34             filestream.Flush();

35             filestream.Close();

36             context.Response.ContentType = "text/plain";

37             context.Response.Write("Hello World");

38         }

39 

40         public bool IsReusable

41         {

42             get

43             {

44                 return false;

45             }

46         }

47     }

48 }