1. 程式人生 > >純前端實現上傳圖片到本地或伺服器,並根據時間建立資料夾,無需後臺

純前端實現上傳圖片到本地或伺服器,並根據時間建立資料夾,無需後臺

1.我們平時接觸到的介面都是後臺需要你給他傳遞幾個引數,你就把引數對應的值 給他們就行了 

$.ajax({
    type: "get",
    url: URl,
    dataType: "json",
    data:{
        'page':'0',
        'rows':'1',
        'Name':''
    },
    success: function (d) {

 2.當你給後臺傳圖片時,你傳的是一個檔案 而不再是普通的string型別的值。而是file型別  也就是檔案型別

 我們要做的只是把這個formData傳給後臺就完成了,一般正常情況下前端做到這一步就搞定了。

3.延伸:不要後臺,我們自己把圖片傳到我們的電腦或伺服器上,此時需要用到一些php程式碼幫助我們搞定

//新建一個upload.php的檔案

<?php
header("Content-Type:text/html; charset=utf-8");

$filename = $_FILES['file']['name'];
//根據日期在物件路徑下建立資料夾
$time = date("Ymd");
 $dir = iconv("UTF-8", "GBK", "../images/icon/".$time);
//檢測資料夾是否存在
        if (!file_exists($dir)){
            mkdir ($dir,0777,true);
            echo '建立資料夾成功';
        } else {
            echo '需建立的資料夾已經存在';
        }
//往資料夾中上傳圖片
//iconv("UTF-8","")是為了防止有漢字的時候出現亂碼
if ($filename) {
    move_uploaded_file($_FILES["file"]["tmp_name"],
      "../images/icon/".$time."/".iconv("UTF-8","gb2312",preg_replace('# #','',$filename)));

}

?>

 4.此時把ajax路徑換成我們的upload.php路徑即可實現上傳,當我們把專案部署到伺服器時,即可實現上傳圖片到伺服器功能,中間完全不需要後臺幫助。

如有疑問,可以留言