How to add property "Alternate" to an image file on server? - asp.net

Question

I'm using asp.net core and web api for uploading images.
On server:
[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)
{
//...
}
}
On client:
// 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);
});
Snapshot:
My question: how to add new property "Alternate" to ICollection<IFormFile> files to detect property Alternate that is sent from client (formData)?

Answer 1

It's not the answer for question How to add property “Alternate” to an image file on server? but it seems like solving the problem (sending image file with alternate text).
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);
}
}
}
On client:
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));
}
We would never get duplicate key in the dictionary because Files[i]['name'] is always primary and cannot be changed (hacking by someone) if we've checked duplicate uploading file before.
Then, we can merge the file name (in files) with Key in _alts to get Alternate text.
Snapshot:
UPDATE: The code in the snapshot was wrong.