一種上傳圖片的方法及系統(tǒng)的制作方法
【專利摘要】本發(fā)明公開一種上傳圖片的方法及系統(tǒng)，用于基于AJAX實現(xiàn)從第一服務(wù)器上傳圖片到第二服務(wù)器，第一服務(wù)器包括第一圖片存儲目錄，第一圖片存儲目錄至少包括第一文件夾以及與第一文件夾不同的第二文件夾，第一服務(wù)器與第二服務(wù)器互相連接，該方法包括：獲得至少兩張待上傳圖片；所述至少兩張待上傳圖片包括從位于一上傳頁面的文件目錄區(qū)域中的所述第一文件夾和所述第二文件夾中選擇的需要上傳的圖片；將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域；在第二服務(wù)器的第二圖片存儲目錄中確定用于存儲所述待上傳圖片的上傳文件夾；將圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾。
【專利說明】一種上傳圖片的方法及系統(tǒng)
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及互聯(lián)網(wǎng)應(yīng)用領(lǐng)域，尤其涉及一種上傳圖片的方法及系統(tǒng)。
【背景技術(shù)】
[0002]隨著近些年信息化的迅猛發(fā)展，互聯(lián)網(wǎng)應(yīng)用越來越受人們的喜愛，像電子商務(wù)、BBS論壇、以及各門戶網(wǎng)站等都離不開批量對文件的上傳下載，對普通上載做了一些擴展。
[0003]互聯(lián)網(wǎng)的飛躍發(fā)展，各網(wǎng)絡(luò)上的圖片越來越多，報紙上圖片的篇幅越來越多，面積越來越大，位置也越來越重要，圖片之所以有著如此魅力，是因為圖片具有具像性、獨特性、多元性，這些往往是任何文字所無法替代的。
[0004]"讀圖時代"已經(jīng)來臨，越來越多的圖片要展示，離不開批量圖片的上傳，它為大量的圖片提供了再增值的機會。
[0005]AJAX, ( “Asynchronous JavaScript and XML，，，異步 JavaScript 和 XML),是指一種創(chuàng)建交互式網(wǎng)頁應(yīng)用的網(wǎng)頁開發(fā)技術(shù)。AJAX不是一種新的編程語言，而是一種用于創(chuàng)建更好更快以及交互性更強的Web應(yīng)用程序的技術(shù)。
[0006]現(xiàn)目前，大多使用AJAX批量上載都使用jsp提供的一個file類瀏覽打開一個窗口選擇所要上傳的文件，類似如下常用書寫的方法:
[0007]〈form action = " " method = " post " name = " MainForm " ENCTYPE="multipart/form-data77 >
[0008]〈input type = " file" name = " file" id = " file" />
[0009]〈/form〉發(fā)明人在發(fā)明過程中，發(fā)現(xiàn)現(xiàn)有的方案中至少存在以下問題:
[0010]首先，要批量上傳，得增加一個相應(yīng)的窗口，如下所示:
[0011]〈input type = " file" name = " file" id=" file" /> 窗口，這樣不利于定義用戶上傳的數(shù)量；
[0012]其次，現(xiàn)有技術(shù)中基于AJAX上傳圖片時不能在同一個窗口下選擇不同位置的文件，效率低下。

【發(fā)明內(nèi)容】

[0013]本申請實施例提供一種上傳圖片的方法及系統(tǒng)，實現(xiàn)了基于AJAX批量上傳圖片時，可以改變盤符和文件路徑，選擇不同位置的文件進行批量上傳。
[0014]本申請實施例提供了一種上傳圖片的方法，用于基于AJAX實現(xiàn)從第一服務(wù)器上傳圖片到第二服務(wù)器，所述第一服務(wù)器包括第一圖片存儲目錄，所述第一圖片存儲目錄至少包括第一文件夾以及與所述第一文件夾不同的第二文件夾，所述第一服務(wù)器與所述第二服務(wù)器互相連接，所述方法包括:
[0015]獲得至少兩張待上傳圖片；所述至少兩張待上傳圖片包括從位于一上傳頁面的文件目錄區(qū)域中的所述第一文件夾和所述第二文件夾中選擇的需要上傳的圖片；
[0016]將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域；[0017]在所述第二服務(wù)器的第二圖片存儲目錄中確定用于存儲所述待上傳圖片的上傳文件夾；
[0018]將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾。
[0019]進一步的，所述第一服務(wù)器還包括與所述第一圖片存儲目錄不同的第三圖片存儲目錄，所述至少兩張待上傳圖片還包括:
[0020]從位于所述文件目錄區(qū)域中的所述第三圖片存儲目錄中的文件夾中選擇的需要上傳的圖片。
[0021]為了識別出所選圖片是否為想要上傳的圖片，所述上傳頁面還包括:
[0022]用于預(yù)覽圖片的圖片預(yù)覽區(qū)域。
[0023]所述圖片列表區(qū)域包括:
[0024]用于顯示所述待上傳圖片的存儲目錄的第一區(qū)域；以及
[0025]用于顯示所述待上傳圖片的上傳狀態(tài)的第二區(qū)域。
[0026]進一步的，在所述將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域之后，所述方法還包括:
[0027]添加新的需要上傳的圖片到所述圖片列表，所述新的需要上傳的圖片具體為從位于所述第一區(qū)域中的圖片存儲目錄選擇的圖片。
[0028]進一步的，在所述添加新的需要上傳的圖片到所述圖片列表之后，所述方法還包括:
[0029]對所述圖片列表中的待上傳圖片進行刪除、歸類或者排序。
[0030]其中，所述待上傳圖片的上傳狀態(tài)包括:
[0031]上傳中狀態(tài)、未上傳狀態(tài)、上傳成功狀態(tài)以及上傳失敗狀態(tài)。
[0032]所述將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾的過程中，所述待上傳圖片的其中一張圖片在上傳時顯示上傳中狀態(tài)，上傳成功后，無刷新顯示上傳成功狀態(tài)，并接著進行下一張圖片的上傳。
[0033]本申請實施例還提供一種上傳圖片的系統(tǒng)，用于基于AJAX實現(xiàn)從第一服務(wù)器上傳圖片到第二服務(wù)器，所述第一服務(wù)器包括第一圖片存儲目錄，所述第一圖片存儲目錄至少包括第一文件夾以及與所述第一文件夾不同的第二文件夾，所述第一服務(wù)器與所述第二服務(wù)器互相連接，所述系統(tǒng)包括:
[0034]獲得單元，用于獲得至少兩張待上傳圖片；所述至少兩張待上傳圖片包括從位于一上傳頁面的文件目錄區(qū)域中的所述第一文件夾和所述第二文件夾中選擇的需要上傳的圖片；
[0035]添加單元，用于將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域；
[0036]確定單元，用于在所述第二服務(wù)器的第二圖片存儲目錄中確定用于存儲所述待上傳圖片的上傳文件夾；
[0037]上傳單元，用于將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾。
[0038]進一步的，所述第一服務(wù)器還包括與所述第一圖片存儲目錄不同的第三圖片存儲目錄，所述添加單元將所述至少兩張待上傳圖片還包括:從位于所述文件目錄區(qū)域中的所述第三圖片存儲目錄中的文件夾中選擇的需要上傳的圖片。
[0039]本申請通過以上一個或多個實施例提供的技術(shù)方案，具有以下有益技術(shù)效果或者優(yōu)點之一:
[0040]本申請結(jié)合了 windows的FSO文件系統(tǒng)，用戶上傳選擇圖片文件可以像操作windows系統(tǒng)一樣進行文件夾列表方式單選或多選所要上傳的圖片文件，對本地圖片文件可以瀏覽，可以改變盤符和文件路徑，選擇不同位置的文件進行批量上傳，還可以查看每張圖的上傳狀態(tài)以及上傳成功的數(shù)量，滿足"讀圖時代"的圖片信息的上傳提高了效率；
[0041]本申請充分結(jié)合了 FTPPutFile、AJAX技術(shù)，上傳時顯示一個狀態(tài)，成功后由AJAX實現(xiàn)無刷新顯示另一狀態(tài)，并接著實現(xiàn)下一個文件的上傳，以此類推，實現(xiàn)無刷新上傳。
【專利附圖】

【附圖說明】
[0042]圖1為本申請實施例提供的上傳圖片的方法流程圖；
[0043]圖2為基于AJAX批量上傳圖片的上傳主頁面；
[0044]圖3為批量上傳文件時，顯示上傳文件的完整路徑和當前上傳文件的狀態(tài)圖；
[0045]圖4為實現(xiàn)無刷新上傳的畫面圖；
[0046]圖5為本申請實施例還提供一種上傳圖片的系統(tǒng)框圖。
【具體實施方式】
[0047]本申請實施例提供一種上傳圖片的方法及系統(tǒng)，實現(xiàn)了基于AJAX批量上傳圖片時，可以改變盤符和文件路徑，選擇不同位置的文件進行批量上傳。
[0048]本申請實施例中的技術(shù)方案為了實現(xiàn)上述技術(shù)效果，總體思路如下:
[0049]本申請實施例基于windows控件，AJAX技術(shù)配合任意一應(yīng)用服務(wù)器和FTP (FileTransfer Protocol,文件傳輸協(xié)議)服務(wù)器即可實現(xiàn)遠程批量上傳。
[0050]本申請實施例基于AJAX技術(shù)批量上載圖片的實現(xiàn)方法就是利用API函數(shù)、FTPPutFile和Ajax實現(xiàn)無刷新批量上載。利用API函數(shù)實現(xiàn)與FTP服務(wù)器的連接與對話，可以根據(jù)主機服務(wù)器的地址和端口連接到Internet上任何一臺FTP服務(wù)器上，對FTP服務(wù)器進行圖片批量上載。
[0051]FTPPutFile方法負責將選擇的一個文件上傳到設(shè)定的FTP服務(wù)器上，上傳時顯示一個狀態(tài)，成功后由Ajax實現(xiàn)無刷新顯示另一狀態(tài)，并接著實現(xiàn)下一個文件的上傳，以此類推。
[0052]FTPPutFile 上傳標簽
[0053]FTPPutFile是用來向FTP服務(wù)器上傳文件，使用方法簡介如下，先引用:
[0054]〈OBJECTID="wfile"
CLASSID="CLSID:4CFElC4C-FE2E-4698-BE；BF-78FI802F23A4"
Style="display: none" VIEWASTEXT></OBJECT>
<script language="JavaScript">
//定義FTP服務(wù)器
var ftpurl="ftp://l27.0.0.1/目錄//FTP服務(wù)器的上傳文件路徑 var fi1ename="c:\testpic.jpg"; /7所要上傳的本地文件 vvfile.FTPPu1:File(ftpur],filename); //上傳文件 //可刪除本地臨時上傳的文件 Yar nfile = fs0.GetFile(filename): nfile.Delete(true): //刪除本地文件 </script>
[0055]FTPPutFile是用來向FTP服務(wù)器上傳文件，定義FTP服務(wù)器，以及FTP服務(wù)器的上傳文件路徑；運用FTPPutFile，可以對選擇的文件進行編輯，如刪除本地文件、上傳文件、可刪除本地臨時上傳的文 件等。
[0056]文件系統(tǒng)對象FSO的英文全稱是File System Ob ject，這種對象模型提出了有別于傳統(tǒng)的文件操作語句處理文件和文件夾的方法。通過采用object, method這種在面向?qū)ο缶幊讨袕V泛使用的語法，將一系列操作文件和文件夾的動作通過調(diào)用對象本身的屬性直接實現(xiàn)。
[0057]標簽示例:
[0058]
【權(quán)利要求】
1.一種上傳圖片的方法，用于基于AJAX實現(xiàn)從第一服務(wù)器上傳圖片到第二服務(wù)器，所述第一服務(wù)器包括第一圖片存儲目錄，所述第一圖片存儲目錄至少包括第一文件夾以及與所述第一文件夾不同的第二文件夾，所述第一服務(wù)器與所述第二服務(wù)器互相連接，其特征在于，所述方法包括: 獲得至少兩張待上傳圖片；所述至少兩張待上傳圖片包括從位于一上傳頁面的文件目錄區(qū)域中的所述第一文件夾和所述第二文件夾中選擇的需要上傳的圖片； 將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域； 在所述第二服務(wù)器的第二圖片存儲目錄中確定用于存儲所述待上傳圖片的上傳文件夾； 將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾。
2.如權(quán)利要求1所述的方法，其特征在于，所述第一服務(wù)器還包括與所述第一圖片存儲目錄不同的第三圖片存儲目錄，所述至少兩張待上傳圖片還包括: 從位于所述文件目錄區(qū)域中的所述第三圖片存儲目錄中的文件夾中選擇的需要上傳的圖片。
3.如權(quán)利要求1或2所述的方法，其特征在于，所述上傳頁面還包括: 用于預(yù)覽圖片的圖片預(yù)覽區(qū)域。
4.如權(quán)利要求3 所述的方法，其特征在于，所述圖片列表區(qū)域包括: 用于顯示所述待上傳圖片的存儲目錄的第一區(qū)域；以及 用于顯示所述待上傳圖片的上傳狀態(tài)的第二區(qū)域。
5.如權(quán)利要求4所述的方法，其特征在于，在所述將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域之后，所述方法還包括: 添加新的需要上傳的圖片到所述圖片列表，所述新的需要上傳的圖片具體為從位于所述第一區(qū)域中的圖片存儲目錄選擇的圖片。
6.如權(quán)利要求5所述的方法，其特征在于，所述添加新的需要上傳的圖片到所述圖片列表之后，所述方法還包括: 對所述圖片列表中的待上傳圖片進行刪除、歸類或者排序。
7.如權(quán)利要求6所述的方法，其特征在于，所述待上傳圖片的上傳狀態(tài)包括: 上傳中狀態(tài)、未上傳狀態(tài)、上傳成功狀態(tài)以及上傳失敗狀態(tài)。
8.如權(quán)利要求7所述的方法，其特征在于，所述將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾的過程中，所述待上傳圖片的其中一張圖片在上傳時顯示上傳中狀態(tài)，上傳成功后，無刷新顯示上傳成功狀態(tài)，并接著進行下一張圖片的上傳。
9.一種上傳圖片的系統(tǒng)，用于基于AJAX實現(xiàn)從第一服務(wù)器上傳圖片到第二服務(wù)器，所述第一服務(wù)器包括第一圖片存儲目錄，所述第一圖片存儲目錄至少包括第一文件夾以及與所述第一文件夾不同的第二文件夾，所述第一服務(wù)器與所述第二服務(wù)器互相連接，其特征在于，所述系統(tǒng)包括: 獲得單元，用于獲得至少兩張待上傳圖片；所述至少兩張待上傳圖片包括從位于一上傳頁面的文件目錄區(qū)域中的所述第一文件夾和所述第二文件夾中選擇的需要上傳的圖片; 添加單元，用于將所述至少兩張待上傳圖片添加到所述上傳頁面的圖片列表區(qū)域；確定單元，用于在所述第二服務(wù)器的第二圖片存儲目錄中確定用于存儲所述待上傳圖片的上傳文件夾； 上傳單元，用于將所述圖片列表中的所述至少兩張待上傳圖片上傳到所述上傳文件夾。
10.如權(quán)利要求9所述的系統(tǒng)，其特征在于，所述第一服務(wù)器還包括與所述第一圖片存儲目錄不同的第三圖片存儲目錄，所述添加單元將所述至少兩張待上傳圖片還包括:從位于所述文件目錄區(qū)域中的所述第三圖片存儲目錄中的文件夾中選擇的需要上傳的圖片。
【文檔編號】G06F17/30GK103577460SQ201210272749
【公開日】2014年2月12日 申請日期:2012年8月2日 優(yōu)先權(quán)日:2012年8月2日
【發(fā)明者】周宇 申請人:北大方正集團有限公司, 北京北大方正電子有限公司