PHP教程系列二 檔案上傳 1

2021-09-16 13:04:43 字數 3392 閱讀 3441

使用前後端分離的形式,乙個前端頁面檔案,乙個php檔案,用於接收檔案,乙個目錄用於存放檔案。

先放**,如下:

>

>

charset

="utf-8"

>

>

上傳title

>

>

//實現預覽功能

function

preview()

//大小的限制

var filesize = math.

round

(file.size /

1024

/1024);

if(filesize >=2)

//獲取img物件

var img = document.

getelementbyid

("image");

//建一條檔案流來讀取

var reader =

newfilereader()

;//根據url將檔案新增的流中

reader.

readasdataurl

(file)

;//實現onload介面

reader.

onload

=function

(e);

}//實現取消上傳功能

function

call()

function

upload()

else};

// 獲取上傳進度

xhr.upload.

onprogress

=function

(event)};

xhr.

send

(formdata);}

script

>

head

>

>

"fileload"

type

="file"

onchange

="preview();"

/>

"upload_btn"

type

="button"

value

="upload"

onclick

="upload();"

/>

type

="button"

value

="取消"

onclick

="call();"

/>

"j_upload_progress"

value

="0"

max="100"

>

progress

>

>

預覽h2

>

style

="width

: 400px;

height

: 400px;

border

: 1px solid #303030;

">

"image"

width

="100%"

height

="100%"

src="

" />

div>

body

>

html

>

頁面設計比較簡單,以實現功能為主要目的。效果如下圖:

其中file_type是從網路查詢的乙個判斷檔案型別的演算法,因為使用$_files變數中的檔案型別做判斷並不是十分準確,客戶端可以造假,file_type這個函式也不是很準備,但對於一般的應用足夠了。move_uploaded_file用於把檔案從臨時目錄移動我們的上傳目錄

[2]:

1 檔案上傳

當上傳乙個檔案時,會先將其作為臨時目錄傳到伺服器,如果不將其啟動到其它目錄,就會刪除。php上傳後端 upload.php uname post uname echo uname.1.首先判斷是否出錯 if files userfile error 0 2.判斷上傳型別是否符合規定 echo fil...

springboot系列16 檔案上傳

檔案上傳用到的場景也比較多,如頭像的修改 相簿應用 附件的管理等等,今天就來學習下在springboot框架下應用檔案上傳技術。org.springframework.boot spring boot starter web org.springframework.boot spring boot ...

SpringBoot (二) 檔案上傳

新建乙個springboot專案 springboot uploadfile 工程目錄 pom.xml依賴 org.springframework.boot spring boot starter web org.springframework.boot spring boot starter th...