Html5+ajax+webapi File Upload

The overall idea is to convert the file into a Base64 string to the background, and then convert the Base64 string to binary, to the file.

<! DOCTYPE HTML Public"-//W3C//DTD XHTML 1.0 transitional//en" "HTTP://WWW.W3.ORG/TR/XHTML1/DTD/XHTML1-TRANSITIONAL.DTD">"http://www.w3.org/1999/xhtml">"Content-type"Content="text/html; Charset=utf-8"/> <title>???? HTML5 File???? forPic2base64</title> <script src="Scripts/jquery-1.8.2.js"></script> <style> </style> <script>window.onload=function() {var input= document.getElementById ("Demo_input"); var result= document.getElementById ("result"); var Img_area= document.getElementById ("Img_area"); if(typeof (FileReader) = = ='undefined') {result.innerhtml="?????????????????? FileReader?????????????????????"; Input.setattribute ('Disabled','Disabled'); } Else{Input.addeventlistener (' Change', ReadFile,false); }        }        functionReadFile () {var file= this.files[0]; var reader=new FileReader ();            Reader.readasdataurl (file); Reader.onload=function(e) {Result.value=This.result; $.ajax ({type:"POST", URL:"Mysterious url/api/tabcompany/postuploadcompanywechatimg.", data: {"Base64": Result.value,"type":". jpg"},//all uploaded files are unified for this object. Result.value no longer intercepts.typefor file type, band. Success:function(data) {alert ("6666666");                                    alert (data); },                    Error:function(XMLHttpRequest, Textstatus, Errorthrown) {alert (xmlhttprequest.status);                        alert (xmlhttprequest.readystate);                    alert (textstatus);                          }                }); }        }    </script>type="file"Value="SDGSDG"Id="Demo_input"/> <textarea id="result"Rows= -cols= -></textarea> <p id="Img_area"></p></body>
The back-end code is as follows
    Public stringpostuploadcompanywechatimg ([frombody]file base64) {quence=Newconsenquance (); Try            {                stringType =Base64.type; stringBase64str = Base64.base64.Split (',')[1]; byte[] data =convert.frombase64string (BASE64STR); stringSavepath ="/filecompanywecha/";//Virtual path , the virtual path in the project. In general, we use this method, we must save the resulting Word document in a folder in the project for future use                stringPath = Resumepath;//System.Web.HttpContext.Current.Server.MapPath (savepath);//convert the corresponding virtual path to a physical path                if(!System.IO.Directory.Exists (path))                {directory.createdirectory (path); } Savepath+ = Guid.NewGuid (). ToString () +type; stringFilePath = Resumepath + Savepath;//System.Web.HttpContext.Current.Server.MapPath (savepath);FileStream FS; if(System.IO.File.Exists (FilePath)) {FS=NewFileStream (FilePath, filemode.truncate); }                Else{FS=NewFileStream (FilePath, filemode.createnew); } BinaryWriter BR=NewBinaryWriter (FS); Br. Write (data,0, data.                Length); Br.                Close (); Fs.                Close (); if(System.IO.File.Exists (FilePath)) {quence. Result=true; Quence. Returnstr=Savepath; }                Else{quence. Result=false; Quence. ErrMsg="Server failed to create document"; }            }            Catch(Exception ex) {quence. Result=false; Quence. ErrMsg=Ex.            Message; }            returnJsonhelp.jsonserializer<consenquance>(quence); }
Parameter entity class public class file
{
public string base64 {get; set;}
public string type {get; set;}
}
Use this code. There are no cross-domain issues.
Ajax solving cross-domain issues is a very depressing thing.
It is also worth mentioning that. The WEBAPI POST request is different from the webservice.
Html5+ajax+webapi File Upload