ruby on rails 多圖上傳

成都創(chuàng)新互聯(lián)主要業(yè)務(wù)有網(wǎng)站營銷策劃、網(wǎng)站建設(shè)、成都做網(wǎng)站、微信公眾號(hào)開發(fā)、微信平臺(tái)小程序開發(fā)、H5開發(fā)、程序開發(fā)等業(yè)務(wù)。一次合作終身朋友，是我們奉行的宗旨；我們不僅僅把客戶當(dāng)客戶，還把客戶視為我們的合作伙伴，在開展業(yè)務(wù)的過程中，公司還積累了豐富的行業(yè)經(jīng)驗(yàn)、成都營銷網(wǎng)站建設(shè)資源和合作伙伴關(guān)系資源，并逐漸建立起規(guī)范的客戶服務(wù)和保障體系。 

一、首先說一下需要使用的插件以及gem包。

1.paperclip(gem,用于后臺(tái)文件處理，是一個(gè)很強(qiáng)大的工具)

2.swfupload(js/swf插件，用于前端頁面的文件選擇與提交上傳,自帶進(jìn)度條。)

二、運(yùn)行環(huán)境

1.ruby 1.9.3-p194

2.rails 3.2

三、準(zhǔn)備工作。

首先在項(xiàng)目中安裝用于處理上傳文件的包,或者工具。（當(dāng)然這個(gè)也可以自己手寫。）我這里使用的是paperclip，可以在rubygems.org這里搜索找到詳細(xì)的使用方法以及安裝過程。

然后我們在網(wǎng)站http://code.google.com/p/swfupload/中可以下載swfupload工具。在這個(gè)下載的包中我們可以看到有幾個(gè)我們需要用到的包，swfupload.js、swfupload.queue.js、swfupload.swfobject.js、

handlers.js、fileprogress.js，以及swfupload.swf文件。其中js文件可以放到assets/javascript下，swf文件可以在assets下新建一個(gè)文件夾存放。

準(zhǔn)備工作到這里就完成了。

四、使用步驟。

1.首先在views/demo.html.erb中加入js代碼。

var
function
var
"/assets/swfupload.swf"http://存放swf文件的地址
"swfuploadfile.js"http://文件上傳路徑。這里.js意思是，以js方式訪問。
"utf8""✓""authenticity_token""<%= form_authenticity_token %>"http://跟隨上傳文件一起的附帶參數(shù)<'paramsName','paramsValue'>
"100 MB"
"*.png;*.jpg;*.jpeg,*.pjpeg;*.bmp;*.gif"
"All Files"
"fsUploadProgress"
"btnCancel"
false
// Button settings 上傳按鈕的設(shè)置 其實(shí)就是初始化swf文件
"/assets/swfupload_button_back.png"http://swf文件的背景
"96"
"32"
"spanButtonPlaceHolder"
''
".theFont { font-size: 14;color:#000000; font-}"
// The event handler functions are defined in handlers.js
//主要用到這里的成功回調(diào) 可以自己寫回調(diào)方法，這個(gè)就是我加的。
// Queue plugin event
new

 //上傳成功后回調(diào)的方法

function
//它自己原有的方法是在handler.js中可以看一下。
//可以看到有一個(gè)file以及sercerData的參數(shù)，這個(gè)是成功后自動(dòng)給你返回的。具體從哪里給你返回的看下面。

然后在頁面中加入：

//上傳按鈕以及全部取消按鈕

之后再加入(前一句是顯示上傳的過程,包括進(jìn)度條。后面一句是上傳狀態(tài)，成功 或者失敗。)