Azure Function httptrigger working from Postman but not HTTPClient

Question

I have a working ASP.NET Core Web API that I'm currently refactoring to an Azure Function. An image is uploaded in the front end, sent to the Azure Function as a POST request where it is uploaded to Azure Blob Storage. Right now my Azure Function works completely fine when testing with Postman but does nothing when I actually use my client application. A postman request will hit my breakpoint in the azure function but a c# httpclient request does not.

FRONT END CODE

 public partial class ImageUpload
    {
        [Inject]
        public HttpClient HttpClient { get; set; }
        public string ImgUrl { get; set; }
        private async Task HandleSelected(InputFileChangeEventArgs e)
        {
            var imageFile = e.File;
            if (imageFile == null)
                return;
            var resizedFile = await imageFile.RequestImageFileAsync("image/png", 300, 500);
            using (var ms = resizedFile.OpenReadStream(resizedFile.Size))
            {
                var content = new MultipartFormDataContent();
                content.Headers.ContentDisposition = new ContentDispositionHeaderValue("form-data");
                content.Add(new StreamContent(ms, Convert.ToInt32(resizedFile.Size)), "image", imageFile.Name);
                var response = await HttpClient.PostAsync("url/to/my/azure/function/api", content);
                ImgUrl = await response.Content.ReadAsStringAsync();
            }

        }
    }

Azure Function API

public static class Upload
    {
        [FunctionName("Upload")]
        public static async Task<IActionResult> Run(
            [HttpTrigger(AuthorizationLevel.Function, "post", Route = null)] HttpRequest req,
            ILogger log)
        {
      
                var formCollection = await req.ReadFormAsync();
                var file = formCollection.Files.First();
                if (file.Length > 0)
                {
                    var container = new BlobContainerClient("connection string to blob storage", "upload-container");
                    var createResponse = await container.CreateIfNotExistsAsync();
                    if (createResponse != null && createResponse.GetRawResponse().Status == 201)
                        await container.SetAccessPolicyAsync(Azure.Storage.Blobs.Models.PublicAccessType.Blob);
                    var blob = container.GetBlobClient(file.FileName);
                    await blob.DeleteIfExistsAsync(DeleteSnapshotsOption.IncludeSnapshots);
                    using (var fileStream = file.OpenReadStream())
                    {
                        await blob.UploadAsync(fileStream, new BlobHttpHeaders { ContentType = file.ContentType });
                    }
                return (ActionResult)new OkObjectResult(blob.Uri.ToString());
                }
            return new BadRequestObjectResult("Error");
        }
    }

Can anyone point me in the right direction of what I'm messing up?

Answer 1

Add this setting to the local.settings.json

  "Host": {
    "LocalHttpPort": 7071,
    "CORS": "*"
  }