續—Django+小程式實現刪除圖片功能
阿新 • • 發佈:2021-01-03
還是在圖片上傳功能的基礎上完成刪除圖片功能,跟下載圖片功能都差不多,具體操作如下
第一步:還是在backup.js中新增刪除圖片功能,具體如下:
// 刪除圖片 deleteBackup: function(imgItem){ wx.request({ url: imageUrl + '?md5=' + 'c272fb65f82896887eaf7d99bf90856d', //這裡的url跟上面的下載圖片中的url是一樣的 method : 'DELETE',//請求方法 //請求成功的回撥函式 success : function(res){ console.log(res.data)關於backup.js的刪除功能程式碼//這裡主要的作用:只要是刪除成功,就彈出小方框 wx.showToast({ title: '刪除成功', }) } }) }
第二步:執行程式,在執行時,可以發現有錯誤存在,但是可以刪除圖片,先看看問題,如下:
(1)在小程式所呈現的錯誤,如下:
(2)再看看Django所刪的圖片是否存在,並且有哪些問題存在,如下:
先看圖片是否已經刪掉了,注:在程式碼中所要刪除的圖片名為“c272fb65f82896887eaf7d99bf90856d.jpg”,再看Django中的images檔案是否存在,如下:
再看看Django報出什麼錯誤,如下:
(3)解決方法,如下:
可以從“File "D:\Python\小程式\git01\apis\viewss\image.py", line 133, in deleteresponse = self.wrap_json_response(code=ReturnCode.SUCCESS, message=message)UnboundLocalError: local variable 'message' referenced before assignment”看出在image.py中的133行中的message有問題,看看image.py中133行的錯誤,如下:
從上面的問題可以看出message是高亮顯示的,那怎麼解決的,解決方法是給message定義預設值即可(完成以後再次執行程式,可以正常運行了,沒有任何問題存在),定義方法如下:
關於最終的backup.js程式碼,如下:
const app = getApp() const imageUrl = app.globalData.serverUrl + app.globalData.apiVersion //這裡可以理解為路徑拼接 Page({ data: { // 需要上傳的圖片 needUploadFiles: [], // 已下載的備份圖片 downloadedBackupedFiles: [], }, // 選擇圖片上傳 chooseImage: function(e) { var that = this; wx.chooseImage({ sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有 sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有 success: function(res) { // 返回選定照片的本地檔案路徑列表,tempFilePath可以作為img標籤的src屬性顯示圖片 that.setData({ needUploadFiles: that.data.needUploadFiles.concat(res.tempFilePaths) }); } }) }, // 上傳圖片檔案 uploadFiles: function() { for(var i=0;i<this.data.needUploadFiles.length;i++){ var filePath= this.data.needUploadFiles[i] wx.uploadFile({ filePath: filePath, name: 'test', url: imageUrl, success: function(res){ //列印結果 console.log(res) } }) } }, // 下載圖片 downloadFile: function (imgItem) { var that = this wx.downloadFile({ url: imageUrl + '?md5=' + 'c272fb65f82896887eaf7d99bf90856d', //指定地址,獲取全域性變數中的imageUrl,在imageUrl的後面拼接圖片名稱 success : function(res){ //臨時路徑 var tmpPath = res.tempFilePath var newDownloadedBackupedfiles = that.data.downloadedBackupedFiles //把臨時路徑新增進去 newDownloadedBackupedfiles.push(tmpPath) that.setData({ downloadedBackupedFiles: newDownloadedBackupedfiles }) } }) }, // 刪除圖片 deleteBackup: function(imgItem){ wx.request({ url: imageUrl + '?md5=' + 'c272fb65f82896887eaf7d99bf90856d', //這裡的url跟上面的下載圖片中的url是一樣的 method : 'DELETE',//請求方法 //請求成功的回撥函式 success : function(res){ console.log(res.data) //這裡主要的作用:只要是刪除成功,就彈出小方框 wx.showToast({ title: '刪除成功', }) } }) } });完整的backup.js程式碼