C
C#2mo ago
TrattTratt

ASP.NET core, send more data with formData

Hi, I want to be sending an string as well as the other data im sending. Is that possible? Its uploading an img to azure storage account but I need to add an more info to the fileEntity so that I can get the filepath to the specific product, therefore I need to send the productId from the razor page to the other project where I upload the file.
No description
No description
24 Replies
TrattTratt
TrattTratt2mo ago
No description
Angius
Angius2mo ago
You can have as much stuff in the form data as you want Just create some class/record/whatever to bind the action to, and have it contain an IFormFile property
record MyCoolData(IFormFile File, string Name, int Count);

[Function("Upload")]
public async Task<IActionResult> Run([...] MyCoolData data)
{
var file = data.File;
// ...
}
record MyCoolData(IFormFile File, string Name, int Count);

[Function("Upload")]
public async Task<IActionResult> Run([...] MyCoolData data)
{
var file = data.File;
// ...
}
TrattTratt
TrattTratt2mo ago
thanks, but I dont understand where to put it <script> const handleSubmit = async (e) => { const status = document.getElementById("status"); status.innerHTML = ""; const formData = new FormData(); formData.append("file", e.target["file"].files[0]); //here I would like to be adding a string that I can get from my fileUpload function const res = await fetch("https://fileprovider-fixo.azurewebsites.net/api/Upload?code=5SrFWL5wQu0H1nPZ8JdATKlnyWVBLzAhwPnSjSHn8N2RAzFu1W-3fQ%3D%3D&containerName=products", { method: "post", body: formData, }) if (res.status == 200) { const result = await res.json(); } else { status.innerHTML = Något gick snett med bilduppladdningen. } } </script> [Function("Upload")] public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req) { try { if(req.Form.Files["file"] is IFormFile file) { var containerName = !string.IsNullOrEmpty(req.Query["containerName"]) ? req.Query["containerName"].ToString() : "files"; var fileEntity = new FileEntity { FileName = _fileService.SetFileName(file), ContentType = file.ContentType, ContainerName = containerName }; can I just do it like this, and where do I get the data in my Run function, formData.append("coolvalue", "testvaluelol");
Angius
Angius2mo ago
const formData = new FormData();
formData.append("file", e.target["file"].files[0]);
formData.append("unga", "bunga");
formData.append("uga", "chaka");
formData.append("gupo", true);
formData.append("zipzoop", 872);
const formData = new FormData();
formData.append("file", e.target["file"].files[0]);
formData.append("unga", "bunga");
formData.append("uga", "chaka");
formData.append("gupo", true);
formData.append("zipzoop", 872);
Yep In your run function, you get it from the parameter(s)
record MyCoolData(IFormFile File, string Unga, string Uga, bool Gupo, int Zipzoop);

[Function("Upload")]
public async Task<IActionResult> Run([...] MyCoolData data)
{
var file = data.File;
// ...
}
record MyCoolData(IFormFile File, string Unga, string Uga, bool Gupo, int Zipzoop);

[Function("Upload")]
public async Task<IActionResult> Run([...] MyCoolData data)
{
var file = data.File;
// ...
}
TrattTratt
TrattTratt2mo ago
public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req) , should I remove all these parameters?
Angius
Angius2mo ago
Keep the attribute if it's needed Actually
TrattTratt
TrattTratt2mo ago
like so? record MyCoolData(IFormFile File, string Unga, string Uga, bool Gupo, int Zipzoop); public class Upload(ILogger<Upload> logger, FileService fileService) { private readonly ILogger<Upload> _logger = logger; private readonly FileService _fileService = fileService; [Function("Upload")] public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req, MyCoolData data)
Angius
Angius2mo ago
Yeah Something like that Might need a [FromForm] attribute on MyCoolData data
TrattTratt
TrattTratt2mo ago
on the record or parameters?
TrattTratt
TrattTratt2mo ago
No description
Angius
Angius2mo ago
On the parameter And the record should be public, as per the error
TrattTratt
TrattTratt2mo ago
thanks, now I get when trying to run it. System.NullReferenceException: 'Object reference not set to an instance of an object.' data was null. public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req,[FromForm] MyCoolData data) { try { if(req.Form.Files["file"] is IFormFile file) { var containerName = !string.IsNullOrEmpty(req.Query["containerName"]) ? req.Query["containerName"].ToString() : "files"; var fileEntity = new FileEntity { FileName = _fileService.SetFileName(file), ContentType = file.ContentType, ContainerName = containerName }; var testValueContent = data.TestValue; might be something here? const formData = new FormData(); formData.append("file", e.target["file"].files[0]); formData.append("TestValue", "contentvalue"); //here I would like to be adding a string that I can get from my fileUpload function const res = await fetch("http://localhost:7036/api/Upload?containerName=products", { method: "post", body: formData, })
qqdev
qqdev2mo ago
$code
MODiX
MODiX2mo ago
To post C# code type the following: ```cs // code here ``` Get an example by typing $codegif in chat For longer snippets, use: https://paste.mod.gg/
qqdev
qqdev2mo ago
Can you try to use that to structure your messages? Helps a lot with readability :heartowo:
Angius
Angius2mo ago
Huh, seems AZ functions don't support parameter binding the same way regular ASP Core does Seems form fields are accessible via req.Form["field"] So
const formData = new FormData();
formData.append("file", e.target["file"].files[0]);
formData.append("unga", "bunga");
formData.append("gupo", true);
formData.append("zipzoop", 872);
const formData = new FormData();
formData.append("file", e.target["file"].files[0]);
formData.append("unga", "bunga");
formData.append("gupo", true);
formData.append("zipzoop", 872);
[Function("Upload")]
public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req)
{
var file = req.Form.Files["file"];
var unga = req.Form["unga"];
var gupo = req.Form["gupo"];
var zipzoop = req.Form["zipzoop"];
// ...
}
[Function("Upload")]
public async Task<IActionResult> Run([HttpTrigger(AuthorizationLevel.Function, "post")] HttpRequest req)
{
var file = req.Form.Files["file"];
var unga = req.Form["unga"];
var gupo = req.Form["gupo"];
var zipzoop = req.Form["zipzoop"];
// ...
}
You can make a proper binder though, apparently https://stackoverflow.com/a/60284398/6042255
Unknown User
Unknown User2mo ago
Message Not Public
Sign In & Join Server To View
TrattTratt
TrattTratt2mo ago
<TargetFramework>net8.0</TargetFramework> <AzureFunctionsVersion>v4</AzureFunctionsVersion>
Unknown User
Unknown User2mo ago
Message Not Public
Sign In & Join Server To View
TrattTratt
TrattTratt2mo ago
im not sure
Unknown User
Unknown User2mo ago
Message Not Public
Sign In & Join Server To View
TrattTratt
TrattTratt2mo ago
its working! thanks a lot $code
MODiX
MODiX2mo ago
To post C# code type the following: ```cs // code here ``` Get an example by typing $codegif in chat For longer snippets, use: https://paste.mod.gg/
TrattTratt
TrattTratt2mo ago
var testData = req.Form["testData"];
var testData = req.Form["testData"];