2015-09-04 261 views
1

我已經創建了一個Node.js Webservice,它將Json對象放在帖子正文中以及我需要傳遞圖像/視頻的相同對象中(不確定是否可能)媒體文件和相同的媒體文件需要上傳到Azure Blob存儲。將圖像,視頻上傳到Node.js WebService並存儲在Azure Blob存儲中

Azure存儲爲我們上傳流的庫提供了庫。但是,在上傳到Azure blob存儲之前,如何將文件從Apps上傳到node.js服務器。

該概念必須在Windows,Android和IOS平臺上運行。

回答

0

也許你可能會考慮使用multipart/form-data而不是JSON,因爲有一個好的庫(expressjs/multer,假設你使用express)來處理node.js中的文件上傳。

只要你從multer文件,其餘的可以像下面很簡單:

app.post('/profile', upload.single('avatar'), function (req, res, next) { 
    blobService.createBlockBlobFromLocalFile('avatars', req.file.originalname, req.file.path, function(error, result, response) { 
    }); 
}); 

對於iOS和Android,也有很多庫,允許multipart/form-data要求如AFNetworking的在iOS中爲OkHttp

+0

我試着上傳圖片和視頻它的工作原理,但它可以同時發送媒體文件,並可以將數據可以是字符串格式,也可以直接在同一請求中使用json – Sharath

+0

您可能需要將它們編碼爲base64,這會花費額外的開發工作量,網絡帶寬和計算時間。 –

+0

我嘗試使用下面顯示的概念嘗試了它在爲數據和多個圖像工作的小提琴手。所以使用它是好的.... --------------------------- acebdf13572468 Content-Disposition:form-data; NAME = 「圖像」; filename =「31 august 2015.png」 Content-Type:image/png <@INCLUDE * C:\ 2015.png * @> ----------------- ---------- acebdf13572468 Content-Disposition:form-data; name =「jsondata」 Content-Type:application/json {「name」:「some name」,「age」:24,「dob」:「15/April/1989」} ------ --------------------- acebdf13572468-- – Sharath

2

如果您的服務器託管在Web應用程序上並假設它是由expressjs構建的,@Alex Lau提供了一個很好的觀點。

另外,這裏還有另外兩個用於快速處理上傳文件的庫。我想給你一些代碼段來處理上傳文件並投入Blob存儲在expressjs這些庫:

1,connect-busboy

var busboy = require('connect-busboy'); 
var azure = require('azure-storage'); 
var fs = require('fs'); 
var path = require('path'); 
var blobsrv = azure.createBlobService(
    accountname, 
    accountkey 
) 

router.post('/file', function (req, res, next) { 
    var fstream; 
    var uploadfolder = path.join(__dirname, '../files/'); 
    if (mkdirsSync(uploadfolder)) { 
     req.pipe(req.busboy); 
     req.busboy.on('file', function (fieldname, file, filename) { 
      console.log("Uploading: " + filename); 
      fstream = fs.createWriteStream(uploadfolder + filename); 
      file.pipe(fstream); 
      fstream.on('close', function() { 
       //res.redirect('back'); 
       blobsrv.createBlockBlobFromLocalFile('mycontainer',filename,uploadfolder + filename, function (error, result, response) { 
        if (!error) { 
         res.send(200, 'upload succeeded'); 
        } else { 
         res.send(500, 'error'); 
        } 
       }) 
      }); 
     }); 
    } 
}) 

function mkdirsSync(dirpath, mode) { 
    if (!fs.existsSync(dirpath)) { 
     var pathtmp; 
     dirpath.split("\\").forEach(function (dirname) { 
      console.log(dirname); 
      if (pathtmp) { 
       pathtmp = path.join(pathtmp, dirname); 
      } 
      else { 
       pathtmp = dirname; 
      } 
      if (!fs.existsSync(pathtmp)) { 
       if (!fs.mkdirSync(pathtmp, mode)) { 
        return false; 
       } 
      } 
     }); 
    } 
    return true; 
} 

2,formidable

​​

如果您正在使用帶Node.js的移動應用程序作爲後端來處理這些工作流程,我們可以創建自定義API並以base64代碼傳輸媒體內容。

在移動應用:

var azure = require('azure'); 
var fs = require('fs'); 
var path = require('path'); 
exports.register = function (api) { 
     api.post('upload',upload); 
} 
function upload(req,res){ 
     var blobSvc = azure.createBlobService(
      req.service.config.appSettings.STORAGE_ACCOUNTNAME, 
      req.service.config.appSettings.STORAGE_ACCOUNTKEY 
     ); 
     var decodedImage = new Buffer(req.body.imgdata, 'base64'); 
     var tmpfilename = (new Date()).getTime()+'.jpg'; 
     var tmpupload = 'upload/'; 
     mkdirsSync(tmpupload); 
     var filePath = tmpupload+tmpfilename; 
     fs.writeFileSync(filePath,decodedImage); blobSvc.createBlockBlobFromFile(req.body.container,tmpfilename,filePath,req.body.option,function(error,result,response){ 
      if(!error){ 
       res.send(200,{result:true}); 
      }else{ 
       res.send(500,{result:error}); 
      } 
     }) 
} 

在移動應用程序中,我使用的標誌性的框架集成NG-科爾多瓦插件來處理照相機事件。 這裏是控制器和服務器腳本片段。爲了您的信息:

控制器JS:

$scope.getpic = function(){ 
    var options = { 
     quality: 10, 
     destinationType: Camera.DestinationType.DATA_URL, 
     sourceType: Camera.PictureSourceType.CAMERA, 
     allowEdit: false, 
     encodingType: Camera.EncodingType.JPEG, 
     targetWidth: 100, 
     targetHeight: 100, 
     popoverOptions: CameraPopoverOptions, 
     saveToPhotoAlbum: false 
    }; 
    $cordovaCamera.getPicture(options).then(function(imageData) { 
     console.log(imageData); 
     return blobService.uploadBlob(objectId,imageData); 
    }, function(err) { 
     // error 
    }).then(function(res){ 
     console.log(JSON.stringify(res)); 
    }); 
    }; 

服務器JS(blobService):

factory('blobService',function($q){ 
     return{ 
       uploadBlob:function(container,imgdata,option){ 
        var q = $q.defer(); 
        mobileServiceClient.invokeApi('blobstorage/upload',{ 
          method:"post", 
          body:{ 
            container:container, 
            imgdata:imgdata, 
            option:{contentType:'image/jpeg'} 
          } 
        }).done(function(res){ 
          console.log(JSON.stringify(res.result)); 
          if(res.result.blob !== undefined){ 
            q.resolve(res.result.blob); 
          } 
          if(res.result.url !== undefined){ 
            q.resolve(res.result.url); 
          } 
        });     
        return q.promise; 
       } 
     } 
})