2016-10-18 6 views
0

私は画像をアップロードするためにasp.netコアとウェブAPIを使用しています。プロパティ "Alternate"をサーバー上のイメージファイルに追加する方法は?

クライアントで
[Produces("application/json")] 
[Route("api/Upload")] 
public class UploadApiController : Controller 
{ 
    private readonly IHostingEnvironment _environment; 

    public UploadApiController(IHostingEnvironment environment) 
    { 
     _environment = environment; 
    } 

    [HttpPost] 
    public async Task Post(ICollection<IFormFile> files) 
    { 
     //... 
    } 
} 

// Files is an array that contains all temporary images for uploading. 
let Files = []; 

let image_preview = function (file) { 
    file['Alternate'] = 'alternate_text'; 
    Files.push(file); 

    // other implements... 
}; 

$('button#upload').click(function() { 
    let formData = new FormData(); 

    for (let i = 0; i < Files.length; i++) { 
     formData.append('files', Files[i]) 
    } 

    let xhr = new XMLHttpRequest(); 
    xhr.open('POST', '/api/upload', true); 

    xhr.onload = function() { 
     console.log('uploading...') 
    }; 

    xhr.send(formData); 
}); 

スナップショット:

1

私の質問を:ICollection<IFormFile> filesに新しいプロパティ "代替" を追加する方法を検出するには、サーバー上の

から送信されるプロパティAlternateクライアント(formData)?

答えて

0

質問How to add property “Alternate” to an image file on server?の回答ではありませんが、問題を解決しているようです(代替テキストで画像ファイルを送信しているようです)。サーバー上で

:クライアントで

using Newtonsoft.Json; 

[HttpPost] 
public async Task Post(ICollection<IFormFile> files, IList<string> alts) 
{ 
    IDictionary<string, string> _alts = new Dictionary<string, string>(); 

    foreach (var alt in alts) 
    { 
     IDictionary<string, string> temp = JsonConvert.DeserializeObject<Dictionary<string, string>>(alt); 

     foreach (var item in temp) 
     { 
      _alts.Add(item.Key, item.Value); 
     } 

    } 
} 

for (let i = 0; i < Files.length; i++) { 
    formData.append('files', Files[i]); 

    let name = Files[i]['name'], 
     alt = {}; 

    alt[name] = 'alt_text'; 

    formData.append('alts', JSON.stringify(alt)); 
} 

Files[i]['name']は常に主であり、我々は「場合(誰かによってハッキング)を変更することはできませんので、私たちは辞書に重複するキーを取得することはありませんでしょう前に重複アップロードファイルをチェックしました。

次に、Keyのファイル名(files)を_altsにマージして代替テキストを取得することができます。

スナップショット:

2

UPDATE:スナップショット内のコードが間違っていました。

関連する問題