クライアントサイドのファイル入力をサーバサイドのクラウドアップロードに接続する方法は？

Question

私たちは曇りのアップロードに取り組んでいます。クラウド上のnpmパッケージによるサーバー上のクラウドメソッドと、入力側からファイルを取得するクライアント上の別のコンポーネントの2つの部分が書かれています。

このファイルをサーバーに渡しているとき、雲のアップロード方法は機能しません。 Webからの通常の画像を使用している場合、このメソッドは正常に動作しています。つまり、このメソッドは一般的に動作しています。

したがって、クライアントからサーバー側の方法に適切にファイルを送信する方法を把握する必要があるようです。残念ながら、これを行う方法は曇ったドキュメントにはっきりと記載されていません。彼らが言うのは、パスとして 'your_image_file.jpg'のようなものです。パスの問題は、正確なイメージパスを取得するセキュリティ上の理由から、ブラウザ側からは不可能だということです。あなたはこれまでこれをどのようにしていますか？私たちのアプリではjQueryを使用しないので、クライアント側のアップロードやjQueryプラグインは使用しないことに注意してください。 （Cloudinaryサンプルプロジェクトからのリンク付き。）

Answer 1

inputタグ（linkを参照）を設定

：

<input id="photo_image" name="image" type="file" /> 

、サーバー側では、cloudinaryにファイルをアップロード（linkを参照してください） ：

var imageFile = req.files.image.path; 
// Upload file to Cloudinary 
cloudinary.uploader.upload(imageFile, {tags: 'express_sample'}) 
     .then(function (image) { 
      console.log('** file uploaded to Cloudinary service'); 
      console.dir(image); 
      photo.image = image; 
      // Save photo with image metadata 
      return photo.save(); 
     }) 
     .then(function (photo) { 
      console.log('** photo saved') 
     }) 
     .finally(function() { 
      res.render('photos/create_through_server', {photo: photo, upload: photo.image}); 
     });