資訊專欄INFORMATION COLUMN
摘要：本示例將演示一個(gè)簡(jiǎn)單的上傳圖片到遠(yuǎn)程服務(wù)器，然后生成圖片路徑后通過(guò)提交的回調(diào)路徑返回給本地服務(wù)器，最后將圖片地址顯示在前端頁(yè)面。若將去掉還會(huì)看到服務(wù)器的返回信息。
本示例將演示一個(gè)簡(jiǎn)單的上傳圖片到遠(yuǎn)程服務(wù)器，然后生成圖片路徑后通過(guò)提交的回調(diào)路徑返回給本地服務(wù)器，最后將圖片地址顯示在前端頁(yè)面。
本項(xiàng)目應(yīng)用三個(gè)文件，即前端選取圖片的頁(yè)面，然后提交圖片到遠(yuǎn)程服務(wù)器處理文件，返回前端頁(yè)面的回調(diào)文件。
一、前端上傳圖片頁(yè)面upload_test.html
Upload Image
| 封面圖URL： | * |
|---|
這里需要注意當(dāng)回調(diào)頁(yè)面返回圖片地址到前端頁(yè)面時(shí)，需要iframe標(biāo)簽（這里我們將其隱藏），否則將會(huì)找不到要在頁(yè)面顯示的地方 。
和一般的。
而如果設(shè)置為iframe的name值，即"post_frame"的話,就會(huì)在該iframe內(nèi)打開，因?yàn)镃SS設(shè)置為隱藏，因而不會(huì)有任何動(dòng)靜。若將display:none去掉,還會(huì)看到服務(wù)器的返回信息。
上傳文件時(shí)，form表單的method、 enctype屬性必須和上面的代碼一樣，然后將target的值設(shè)為iframe的name，這樣就可以實(shí)現(xiàn)無(wú)刷新上傳文件。
當(dāng)選擇圖片提交時(shí)，還有一個(gè)隱藏域，即給遠(yuǎn)程服務(wù)器提交圖片時(shí)，還需要提交回調(diào)路徑，好讓圖片返回給本地服務(wù)器。（這里我們都是用本地服務(wù)器來(lái)進(jìn)行測(cè)試）
二、遠(yuǎn)程服務(wù)器圖片處理
upload_action.php
0)
{
$msg = "傳入?yún)?shù)錯(cuò)誤" . $file["error"] . " ";
exit($msg);
}
else
{
// chmod($uploadPath, 0666);
if(file_exists($uploadPath.$file["name"])){
$msg = $file["name"] . "文件已經(jīng)存在！";
exit($msg);
}
else
{
if(move_uploaded_file($file["tmp_name"], $uploadPath.$file["name"]))
{
$img_url = "http://localhost/url_test/".$uploadPath.$file["name"];
$img_url = urlencode($img_url);
$url = $callbackUrl."?img_url={$img_url}";
// 跳轉(zhuǎn)
header("location:{$url}");
exit();
}
else
{
exit("上傳失敗！");
}
}
}
圖片上傳到到該頁(yè)面后，保存并返回圖片地址給回調(diào)頁(yè)面。
三、回調(diào)頁(yè)面返回圖片地址到前端頁(yè)面回調(diào)頁(yè)面獲取到遠(yuǎn)程服務(wù)器傳來(lái)的圖片地址后，經(jīng)過(guò)"window.parent.XXX"返回給前端頁(yè)面。
callback.php
window.parent.document.getElementById("cover_img_url").value="{$img_url}";
";
如果我們的前端頁(yè)面upload_test.html沒(méi)有iframe標(biāo)簽，則不會(huì)返回找到ID為“cover_img_url”的輸入框的值，會(huì)跳轉(zhuǎn)到空白頁(yè)。
四、上傳到服務(wù)器的文件寫入日志記錄寫入日志：
$file = $this->file = $_FILES[$this->fileField];
// 要寫入文件的文件名（可以是任意文件名），如果文件不存在，將會(huì)創(chuàng)建一個(gè)
$log_file = "../log/log.txt";
$time = date("Y-m-d H:i:s", time());
$log_content = var_export($_FILES, true) ."Time:{$time}
";
file_put_contents($log_file, $log_content, FILE_APPEND);
// 結(jié)果記錄
array (
"name" => "myImage.jpg",
"type" => "image/jpeg",
"tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phpod5VA4",
"error" => 0,
"size" => 249318,
)
array (
"file" =>
array (
"name" => "myImage.jpg",
"type" => "image/jpeg",
"tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phppRvcVe",
"error" => 0,
"size" => 249318,
),
)Time:2016-09-10 17:32:30
其他上傳相關(guān)示例：
php+ajax實(shí)現(xiàn)圖片文件上傳功能實(shí)例
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/30433.html
摘要：背景最近有需求下載頭像到本地，以文件形式上傳到第三方，遇坑就填第一版將獲取的信息以字符串返回，而不是直接輸出因?yàn)橐獙懳募⒂脮r(shí)會(huì)將頭文件的信息作為數(shù)據(jù)流輸出適合調(diào)試配置手冊(cè)文檔地址配置項(xiàng)需要什么翻著找找遇到幾個(gè)問(wèn)題部分圖片所在主站防盜鏈機(jī)制 背景 最近有需求下載頭像到本地，以文件形式上傳到第三方，遇坑就填 curl 第一版 $ch = curl_init(); curl_setopt_...
摘要：七夕啦，作為開發(fā)，妹子沒(méi)得撩就撩下服務(wù)器吧，妹子有得撩的同學(xué)那就左擁妹子右抱服務(wù)器吧，況且妹子是要禮物的，服務(wù)器又不用。下面我們來(lái)看一些常用的情景，我們需要如何打扮自己配置參數(shù)才能正確撩妹正確撩到服務(wù)器。 七夕啦，作為開發(fā)，妹子沒(méi)得撩就撩下服務(wù)器吧，妹子有得撩的同學(xué)那就左擁妹子右抱服務(wù)器吧，況且妹子是要禮物的，服務(wù)器又不用。好啦，長(zhǎng)話短說(shuō)再長(zhǎng)說(shuō)，祭出今天的工具——CURL(Client...
摘要：第三種，使用格式，即在中請(qǐng)求參數(shù)處理跨域問(wèn)題當(dāng)然請(qǐng)求方式只能是。最后發(fā)現(xiàn)有網(wǎng)友說(shuō)版本不穩(wěn)定引起的，于是把百度地圖回退到了，結(jié)果還真是可以了。請(qǐng)問(wèn)在移動(dòng)端頁(yè)面中播放優(yōu)酷里面的視頻，怎樣實(shí)現(xiàn) 1.web掃碼登錄怎么實(shí)現(xiàn)，思路 步驟 WEB平臺(tái) 手機(jī) 第1步 生成二維碼 第2步 （ajax監(jiān)控后臺(tái)） 掃碼 第3步 ...
閱讀 2385·2021-11-18 10:07
閱讀 2336·2021-09-22 15:59
閱讀 3095·2021-08-23 09:42
閱讀 2296·2019-08-30 15:44
閱讀 1208·2019-08-29 15:06
閱讀 2335·2019-08-29 13:27
閱讀 1230·2019-08-29 13:21
閱讀 1431·2019-08-29 13:13
