Post attachment in Service Now

Question

I'm in a quandary on how to get this working. In Postman, I can upload an attachment without any issue. I'm uploading a simple text file. The code from postmanshows this:

var form = new FormData();
form.append("uploadFile", "C:\\temp\\test.txt");

var settings = {
  "async": true,
  "crossDomain": true,
  "url": "https://xxxxxxx.service-now.com/api/now/attachment/file?table_name=problem&table_sys_id=oiui5346jh356kj3h634j6hk&file_name=Toast",
  "method": "POST",
  "headers": {
    "Accept": "application/json",
    "Content-Type": "application/x-www-form-urlencoded",
    "Authorization": "Basic xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx==",
    "Cache-Control": "no-cache",
    "Postman-Token": "39043b7f-8b2c-1dbc-6a52-10abd25e91c1"
  },
  "processData": false,
  "contentType": false,
  "mimeType": "multipart/form-data",
  "data": form
}

$.ajax(settings).done(function (response) {
  console.log(response);
});

When I use this on an .asp page I get a 400 error and a response from the console that says: "Failed to create the attachment. File part might be missing in the request." How do you get the file you want attach into the code correctly. I thought hard coding it in would have worked. How do you get the code to find the file on the local users pc. Once I get this working I eventually want to have a file input button to select the file.

Thanks, Scott

Answer 1

Your code looks fine except this line:

form.append("uploadFile", "C:\\temp\\test.txt");

Passing the file name as the second parameter won't work, according to the documentation of FormData.append here, you need to pass some blob/file object pointing to the document it self (not a string)

Now there are 2 possible scenarios:

Scenario 1

The user selects the file manually using a browse button

Here you need to add the input to your page and a trigger to upload the file when it's selected, something like below maybe:

uploadDataFile();

function uploadDataFile(fileInput) {
  // creates the FormData object
  var form = new FormData();
  // get the first file in the file list of the input 
  // (you will need a loop instead if the user will select many files)
  form.append("uploadFile", fileInput.files[0]);
  // ... the rest of your AJAX code here ...
}

<input type="file" onchange="uploadDataFile(this)" />

Scenario 2

Uploading the file directly without user intervention

Here you need to construct the file object manually same as in this answer and then you will add it normally to your data object

function uploadDataFile() {
  // creates the file object
  var fileObject = new File (...);
  // creates a data object and appends the file object to it
  var form = new FormData();
  form.append("uploadFile", fileObject);
  // ... the rest of your AJAX code here ...
}

One final note

Please pay attention to the browser compatibility for FormData & File objects