? ? 我們?cè)谧錾蟼魑募臅r(shí)候大多數(shù)時(shí)候使用input:type=file加上后端文件操作就能滿足大多數(shù)的項(xiàng)目需求。
? ? 有時(shí)候需要多圖上傳或者預(yù)覽的時(shí)候可能要多幾步操作或者使用插件绳慎,但是有些時(shí)候你會(huì)遇到一些難以名狀的困難敷存。
? ? 比如你在二次開發(fā)的時(shí)候遇到一個(gè)混亂的程序員寫了一大堆混亂的代碼用了一個(gè)非常笨重的插件,你想在這樣的代碼上再修改文件上傳那就特別特別難受了柴我。
? ? 這時(shí)候你可以--直接傳數(shù)據(jù)流
? ? 1解寝、前端
? ? 前端首先排除FormData對(duì)象,這個(gè)反正不行艘儒,使用FileReader對(duì)象
? ? var fileObj = $('input[name="thumbImg"]')[0].files[0];
? ? var reader = new FileReader();
? ? var myData = new FormData();
? ? reader.readAsDataURL(fileObj);
? ? reader.onloadend = function(){
? ? ? ? ? myData.append('img',this.result);
? ? }
? ? reader.onerror=function(){
? ? ? ? alert('縮略圖讀取錯(cuò)誤聋伦,請(qǐng)換種姿勢(shì)重試一次夫偶!');
? ? }
? ? $.ajax({
? ? ? ? url:"ajax.php",
? ? ? ? type:"post",
? ? ? ? contentType: false,
? ? ? ? processData: false,
? ? ? ? cache: false,
? ? ? ? data:myData,
? ? ? ? success:function(r){
? ? ? ? ? ? var operation = {//操作對(duì)象集
? ? ? ? ? ? ? ? 1:function(){
? ? ? ? ? ? ? ? ? ? alert('保存成功');
? ? ? ? ? ? ? ? ? ? location.reload();
? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? 2:function(){
? ? ? ? ? ? ? ? ? ? alert("文件格式錯(cuò)誤!");
? ? ? ? ? ? ? ? },
? ? ? ? ? ? };
? ? ? ? ? ? operation[r]();
? ? ? ? },
? ? ? ? error:function(){
? ? ? ? ? ? alert("網(wǎng)絡(luò)錯(cuò)誤嘉抓!");
? ? ? ? }
? ? })
2索守、后端
? ? if (!file_exists('shipinimg')) {
? ? ? ? @mkdir('shipinimg');
? ? }
? ? $content = $_POST['img'];
? ? list($type, $data) = explode(',', $content);
? ? if (strstr($type, 'image/jpeg') != '') {
? ? ? ? $ext = '.jpg';
? ? } elseif (strstr($type, 'image/gif') != '') {
? ? ? ? $ext = '.gif';
? ? } elseif (strstr($type, 'image/png') != '') {
? ? ? ? $ext = '.png';
? ? }
? ? $imgname = 'shipinimg/' . time() . '_img' . $ext;
? ? $res = file_put_contents($imgname, base64_decode($data));
后端只需要file_put_contents()就可以了