The absence of a form data boundary in the content-type of the POST request header

I have encountered an issue with my file upload code in AngularJS. The boundary is not being added to the content-type property in the request header, causing my C# web-api function to fail in detecting the image.

Here's the post request using angularjs:

var formData = new FormData($('#testform')[0]);

$http({
    url: serviceBase + 'api/Client/' + item.practiceID + '/SavePhoto',
    method: "POST",
    data: formData,
    headers: { 'Content-Type': false },       
    transformRequest: function (data) { return data; }
}).success(function (response) {      
}).error(function () {  
});

This is what the request looks like:

Request URL:http://localhost:56769/api/Client/178/SavePhoto
Request Headers
Provisional headers are shown
Accept:application/json, text/plain, */*
Authorization:Bearer JfDnrAIkSttZ8GnHa-Wo9wBH-HVWpbiUgGSic11DF_OlTgseuTPgTisxybvEyw2fEyer1FJ7DjKWqK15P-ZdhO_X1aHp7-GiIW2Q4BTF5svTyJKWtM2jk-XEN6qXuEIhAi6-phryd_LlGLOlLMYMKhQZGULxdyk_dUvDGt6bY5Z0L-LbV5uc74q3MyLMMj_vypNgbFCAxGEAGeeeGlP7jwlyyz7EY-eRfRhXxjFqOjI
Content-Type:false
Origin:http://localhost:58431
Referer:http://localhost:58431/index.html
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36
Request Payload
------WebKitFormBoundary6padOMi9aJxqx34h
Content-Disposition: form-data; name="profile-photo"; filename="Jellyfish.jpg"
Content-Type: image/jpeg
------WebKitFormBoundary6padOMi9aJxqx34h--

Can anyone offer insight into why the boundary might be failing to generate in the content-type parameter?

javascriptc#angularjsforms

Answer №1

Experiment with setting the Content-Type header to undefined rather than false:

headers: { 'Content-Type': undefined }

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Implementing the slideToggle function with Angular directives

Hi there! I have successfully implemented the slideToggle function using Angular and jQuery. To ensure that this function only affects a specific HTML element, I am currently passing a parameter within the ng-click function. While my code is functioning as ...

jqueryangularjsslideslidetoggleangularjs-directive

In JavaScript, not all elements are removed in a single iteration, even if the condition is consistently met

I'm currently attempting to compare two arrays containing multiple objects and remove elements based on a condition. To my surprise, while testing in Chrome's console, I noticed that the first array (arr1) is not being emptied even though I am us ...

javascriptarrayssplice

Python Mechanize file uploading capabilities

Hey there! I've been experimenting with mechanize and Python to upload a file to a website. I've had some success so far, but now I'm facing a challenge at the upload page. I understand that mechanize doesn't support JavaScript, but I&a ...

javascriptpythonfileuploadmechanize

Exploring the functionality of a personalized hook using the useSelector method

I have developed a custom hook and I am in the process of testing it independently. However, I am encountering an issue where I need to wrap the hook inside a Provider to proceed further. The error message I am getting is displayed below: Error: could not ...

javascriptreactjsreact-hooksreact-testing-library

execute a function upon selecting a radio button

Below is the HTML code that includes two radio buttons. The default checked button is the "lease" option. <input id="quotation_request_payment_option_lease" class="choose_payment_option" name="quotation_request[payment_option]" type ...

javascriptjqueryhtmljquery-events

The node.js oauth-1.0a implementation is successful in authenticating with Twitter API v1.1, however, it encounters issues

Having come across this function for generating an oauth-1.0a header: // auth.js const crypto = require("crypto"); const OAuth1a = require("oauth-1.0a"); function auth(request) { const oauth = new OAuth1a({ consumer: { key ...

javascriptnode.jstwittertwitter-oauthoauth-1.0a

Is the Ajax response value consistently 1?

I am facing an issue where a JavaScript in an HTML page is sending two variables to a PHP script, which then echoes one of the variables at the end. However, the response value always remains 1. Despite trying methods like alerting, console.log, and puttin ...

javascriptphpajax

What are the best practices for utilizing "async/await" and "promises" in Node.js to achieve synchronous execution?

I'm fairly new to the world of web development and still grappling with concepts like promises and async/await. Currently, I'm working on a project to create a job posting site, but I've hit a roadblock trying to get a specific piece of code ...

javascriptnode.jsasync-awaites6-promise

Ways to deactivate the three-way data binding feature in Firebase

Currently using AngularJS 1.3 in combination with Angularfire and Firebase has been a successful experience for me. I have created some factories to manage the firebase object, and the three-way data binding feature is truly impressive. However, as I plan ...

angularjsfirebaseangularfire

Error Encountered during Selenium Testing: Method Not Permitted

I am currently in the process of mastering how to create Selenium tests using C#, following the guidelines stated here. Here is the setup function: [SetUp] public void SetupTest() { selenium = new DefaultSelenium("TestServer", 4444, "*iex ...

javac#selenium

Using the React Hook useCallback with no dependencies

Is it beneficial to utilize useCallback without dependencies for straightforward event handlers? Take, for instance: const MyComponent = React.memo(() => { const handleClick = useCallback(() => { console.log('clicked'); }, []); ...

javascriptreactjsreact-hooks

steps to initiate re-render of rating module

My first experience with React has been interesting. I decided to challenge myself by creating a 5-star rating component. All logs are showing up properly, but there seems to be an issue with the component not re-rendering when the state changes. Thank you ...

javascriptreactjs

Utilizing HTML and JavaScript to dynamically switch stylesheets based on the width of

When it comes to using stylesheets for mobile and non-mobile devices, there is a need for different approaches. The idea of comparing browser height and width in JavaScript seems like a good one, but the implementation may not always work as expected. ...

javascripthtmlcssstylesheet

Update a particular form field value prior to submission

Currently, I am working on a User registration page that includes the functionality for users to upload their own avatar picture. My approach involves uploading the picture, then calling a function on change to convert the picture into a UInt8Array before ...

angularforms

Having trouble retrieving the toDataURL data from a dynamically loaded image source on the canvas

Currently, I am working on a project that involves a ul containing li elements with images sourced locally from the "/images" folder in the main directory. <section class="main"> <ul id="st-stack" class="st-stack-raw"> ...

javascriptjqueryhtmlcanvastodataurl

The close button within the modal is malfunctioning even with the implementation of the on() function

My "show more" button triggers the modal to pop up, but when I click on the X button in the top left corner, it doesn't close as expected. However, clicking outside of the box or pressing the "esc" key does work. I suspect that the issue lies with th ...

javascriptjquerycssbootstrap-5

Deciphering embedded struct data in GoLang

A specific struct in my code contains an array of another struct, for example: type Struct1 struct { Value string Items []Struct2 } type Struct2 struct { Value string } While using gorilla schema to decode Form values into S ...

angularjsformsparsinggostruct

Instead of using an ID in javaScript, opt for $(this) instead

Is there a way to utilize $(this) instead of an ID in the option select function in javaScript? var tot = 5 * ($( "#firstOne option:selected" ).text()); In the scenario mentioned above, I aim to substitute $(this) for #firstOne, allowing this functional ...

javascriptjquery

Exploring the functionalities of the execPopulate() method

I'm hitting a roadblock with using execPopulate. I've gone through the documentation, but it's just not clicking for me. Could someone clarify when exactly execPopulate() should be used after populate() and when it's unnecessary? In s ...

javascriptnode.jsmongodbexpressmongoose

Utilizing AngularJS to filter through multiple select input options

It's surprising that there is a lack of documentation or discussions on this more advanced filtering feature for AngularJS, which is crucial for any UI development. I am looking to filter out select options that include the current item. How can we r ...

selectfilterangularjs