api介面圖片上傳
Ⅰ 如何在手機瀏覽器中運用HTML5的文件API實現上傳多圖功能
Html5終於解決了上傳文件的同時顯示文件上傳進度的老問題。現在大部分的網站用Flash去實現這一功能,還有一些網站繼續採用Html <form>with enctype=multipart/form-data,但是需要修改伺服器端可用才能顯示給用戶文件上傳的進度。本質上你需要做的工作是在伺服器端接收一個文件時,你發送給它一個位元組流,所以你需要知道你已經接收到多少位元組並以某種方式傳達這些信息給客戶端瀏覽器,在這個過程一直在不斷的進行文件的上傳。這種方式運行的非常好,不像Flash上傳那這樣充滿了問題(特別是處理大文件上傳的時候),然而這種方法是相當復雜的並且聽起來不容易理解,因為你本質上是接管了整個伺服器端的處理(獲取位元組流的時候)同時包括了在伺服器端實現multipart/form-data協議,伴隨一系列的其他事情。
使用Html5 上傳文件
XMLHttpRequest 在Html5 規范中已經有全新的變化,規定了XMLHttpRequest Level 2規范(目前最新版本)包含下列新的特性:
處理位元組流,例如作為上傳或者下載的File,Blob,FormData對象
上傳或者下載中的進度事件
跨站點請求
允許創建匿名請求
可以設置請求超時
在這篇文章中我們將能夠更清楚的看到#1和#2兩個特性。通常,上傳文件用XMLHttpRequest並且提供上傳進度信息給最終的用戶,需要注意的是這種方式解決了不需要伺服器端做任何改變,至少是目前處理multipart/form-data協議。所以伺服器端的處理邏輯保留不變,這使得開發者適應這種技術相當容易。
圖1:文件上傳畫面-准備上傳 圖2:顯示上傳完成畫面
注意:上面的圖片中,信息提示區域是提供給用戶的:
當前選中文件的信息
文件名
文件大小
文件類型
上傳完成多少的百分比進度條
上傳速度或者上傳帶寬
距離上傳完成大概還有多長時間
已上傳文件大小
伺服器端的響應
上面第6項或許看起來不重要,但事實上是相當重要的。因為我們用XMLHttpRequest,上傳發生在後台,頁面沒有發生跳轉等任何變化,所以對於你用它處理其他一些事情來說是一個非常好的特性。
Html5 Progress Event
對於Html5 Progress Events規范,Html5 Progess Events提供了下列與本次討論相關的信息
total - 總的位元組數
loaded - 到目前為止上傳的位元組數
lengthComputable - 可計算的已上傳位元組
請注意到我們需要用兩個信息去計算要顯示給用戶的其他所有信息。要計算出來其他的信息通過上面我們得到信息是相當容易的,但是那需要一些額外的代碼並且創建一個定時器。
Html5 Progress Event 應該是什麼
考慮到有一部分人想更好的提供給用戶所有的信息,所以Html5 Progress Event應該更好的滿足需要,因為它給瀏覽器供應商提供這些額外信息是相當簡單的,所以建議progress event應該修改成如下:
total - 總的位元組數
loaded - 到目前為止上傳的位元組數
lengthComputable - 可計算的已上傳位元組
transferSpeed long類型
timeRemaining javaScript 日期對象
Html5 上傳 用XMLHttpRequest
瀏覽器支持情況
支持這一特性的瀏覽器最低版本
Firefox 4.0 beta 6
Chrome 6
Safari 5.02
IE 9 Beta and Opera 10.62 不支持這一特性
簡單的示例
下面是一個完整的Html頁麵包含了實現文件上傳並帶有進度提示的JavaScript代碼,只是實現了基本的功能,感興趣的可以自己做擴展。 需要吧上傳介面修改成自己服務的。
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html>
<head>
<title>Upload Files using XMLHttpRequest - Minimal</title>
<script type="text/javascript">
function fileSelected() {
var file = document.getElementById('fileToUpload').files[0];
if (file) {
var fileSize = 0;
if (file.size > 1024 * 1024)
fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
else
fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
document.getElementById('fileName').innerHTML = 'Name: ' + file.name;
document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize;
document.getElementById('fileType').innerHTML = 'Type: ' + file.type;
}
}
function uploadFile() {
var fd = new FormData();
fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]);
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress, false);
xhr.addEventListener("load", uploadComplete, false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", "upload.do");//修改成自己的介面
xhr.send(fd);
}
function uploadProgress(evt) {
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
}
else {
document.getElementById('progressNumber').innerHTML = 'unable to compute';
}
}
function uploadComplete(evt) {
/* 伺服器端返回響應時候觸發event事件*/
alert(evt.target.responseText);
}
function uploadFailed(evt) {
alert("There was an error attempting to upload the file.");
}
function uploadCanceled(evt) {
alert("The upload has been canceled by the user or the browser dropped the connection.");
}
</script>
</head>
<body>
<form id="form1" enctype="multipart/form-data" method="post" action="Upload.aspx">
<div class="row">
<label for="fileToUpload">Select a File to Upload</label><br />
<input type="file" name="fileToUpload" id="fileToUpload" onchange="fileSelected();"/>
</div>
<div id="fileName"></div>
<div id="fileSize"></div>
<div id="fileType"></div>
<div class="row">
<input type="button" onclick="uploadFile()" value="Upload" />
</div>
<div id="progressNumber"></div>
</form>
</body>
</html>
Ⅱ restful api上傳文件
不太清楚你寫這個借口的目的是什麼,一般我們做上傳都是前端通過控制項上傳後得到路徑,然後調用一個方法將路徑保存就可以了。你這個借口的目的是什麼?
先調用介面獲得路徑是保存路徑不一樣的情況才這樣做的。如果上傳的路徑是一樣的就沒有那個必要再去調用一次了
Ⅲ php怎麼把遠程圖片通過api介面傳到另外一個站點上
本地傳圖片到伺服器叫上傳,伺服器從別的網站獲取圖片,這叫下載,這比上傳還簡單
$content = file_get_contents(圖片地址);
file_put_contents(保存的路徑文件名, $content);
Ⅳ php手機站,怎麼上傳圖片給伺服器(提交給介面api處理)
上傳操作可以使用FTP來實現,用php即可調用。
FTP 是File Transfer Protocol(文件傳輸協議)的英文簡稱,而中文簡稱為「文傳協議」。用於Internet上的控制文件的雙向傳輸。同時,它也是一個應用程序(Application)。基於不同的操作系統有不同的FTP應用程序,而所有這些應用程序都遵守同一種協議以傳輸文件。在FTP的使用當中,用戶經常遇到兩個概念:"下載"(Download)和"上傳"(Upload)。"下載"文件就是從遠程主機拷貝文件至自己的計算機上;"上傳"文件就是將文件從自己的計算機中拷貝至遠程主機上。用Internet語言來說,用戶可通過客戶機程序向(從)遠程主機上傳(下載)文件。
Ⅳ 我有一個http的API介面,有一參數imgfile,就是上傳本體圖片,給的示例是multipar
<form id="form1" enctype="multipart/form-data" >
<input type="file" />
<input type="submit" value="提交" />
</form>
Ⅵ API介面是什麼
API(或應用程序介面)是用於在軟體 App 之間以形式化的方式來回傳遞數據的介面。
常見的API類型很多,有生活服務類、金融科技類、應用開發類等等。用聚合數據的API舉例,生活服務類:
簡訊API服務-支持三大運營商,虛擬運營商簡訊發送,電信級運維保障,獨享專用通道,3秒可達,99.99%到達率,支持大容量高並發——超低資費
新聞頭條-最新新聞頭條,各類國內、國際、體育、娛樂、科技等資訊,更新周期5-30分鍾
空氣質量-支持全國大部分城市空氣質量查詢,可實時查詢空氣質量,小時粒度,實時給出空氣質量AQI指數,並給出空氣質量級別和首要污染物。
全國停車場實時數據查詢-根據經緯度精準查詢全國60個城市10萬個停車場實時數據,包含停車場位置,車位數,剩餘車位、費用等信息。
語音圖像垃圾分類識別-通過提交語音垃圾名稱或上傳垃圾物品圖片自動識別垃圾名稱並檢索相關聯的垃圾分類信息,海量垃圾分類,毫秒級響應。
金融科技類:
身份證實名認證-身份證二要素官方實名核驗,傳入姓名、身份證號,校驗此二要素是否一致。直連官方權威渠道, 精準實時核驗,毫秒級響應,零緩存,99.99%准確率。
銀行卡四元素校驗-檢測輸入的姓名、手機號碼、身份證號碼、銀行卡號是否一致,毫秒級響應、直聯保障,支持全國所有銀聯卡,實時驗證科學嚴謹,數據100%可靠。
三網手機實名制認證-通過傳遞姓名+身份證號碼+手機號,校驗信息是否一致,直連運營商大數據,毫秒級響應,精準核驗,准確率99.99%——品質之選。
商標信息查詢-覆蓋2000多萬條各類商標信息,可通過查詢商標名/注冊號/申請人,獲得含有該關鍵字的商標列表信息。
應用開發類:
搜狗關鍵詞收錄量-根據關鍵詞返回搜狗關鍵詞收錄量、抓取時間
whois反查-根據電話、郵箱、注冊人反查Whois信息(最多100條數據)
網安域名備案查詢-根據域名返回查詢網安域名的備案信息
主辦單位備案查詢-根據公司名稱返回查詢所有備案信息
Ⅶ php怎麼通過api介面上傳圖片
require_once "../common_mysql.php";
require_once MESSAGE_PATH . 'zh/zh_calendar_message.php';
require_once "function_common/user_function.php";
require_once "function_common/public_function.php";
global $DB;
$sql_time = microtime ( true );
//$uid = $self_userid;
//保存圖片
$json_result ['status'] = 0;
$path = 'upfile';
$json_result ['status'] = 0;
$json_result ['successmsg'] = '上傳失敗';
if (isset ( $_FILES ['imageZip'] )) {
$upfile = 'upfile/' . $_FILES ['imageZip'] ['name'];
if (! @file_exists ( $path )) {
@mkdir ( $path );
}
$result = @move_uploaded_file ( $_FILES ['imageZip'] ['tmp_name'], $upfile );
if (! $result) {
$json_result ['status'] = 0;
$json_result ['successmsg'] = '上傳失敗';
$json_result ['datas'] = array ('savePath' => $upfile );
exit ( json_encode ( $json_result ) );
}
}
$json_result ['status'] = 1;
$json_result ['datas'] = array ('savePath' => $upfile );
Ⅷ HTTPRESTAPI如何一次上傳多張圖片
API介面是一個請求上傳一個文件,所以如果需要上傳多張圖片的話,那就要創建多個請求。
創建多個請求一般有串列上傳和並發上傳,這個可以根據需要來實現一下。
Ⅸ 本地路徑的api上傳圖片到oss雲中圖片還會經過自己的伺服器嗎
是不會經過index的伺服器的,是直接通過介面保存到OSS