Uploading runs via API, getting 'Method Not Allowed' (status 405)

[slashinfty]

Hello,

I am trying to upload runs using Node.js and the node-fetch package, but it won't work. Here is the code:

// Import modules
import fetch from 'node-fetch';

// Import files
import { splits } from './Splits.js'

export const upload = async () => {
    const probe = await fetch(`https://splits.io/api/v4/runs`, {
        method: "POST"
    });
    const response = await probe.json();
    //console.log(response);

    if (response.status !== 201) {
        return 'Upload failed.';
    }

    const body = new URLSearchParams();
    for (const key in response.presigned_request.fields) {
        body.append(key, response.presigned_request.fields[key]);
    }
    body.append('file', JSON.stringify(splits));

    const post = await fetch(response.presigned_request.uri, {
        method: response.presigned_request.method,
        body: body
    });
    //console.log(post);

    return `Upload complete. Claim your splits: ${response.uris.claim_uri}`;
}

Using URLSearchParams() is recommended by the node-fetch devs and I can verify it is copying all the fields from the presigned request, and the splits import is a JSON object, but I'm getting this response from the final post:

Response {
  size: 0,
  [Symbol(Body internals)]: {
    body: PassThrough {
      _readableState: [ReadableState],
      _events: [Object: null prototype],
      _eventsCount: 6,
      _maxListeners: undefined,
      _writableState: [WritableState],
      allowHalfOpen: true,
      [Symbol(kCapture)]: false,
      [Symbol(kCallback)]: null
    },
    stream: PassThrough {
      _readableState: [ReadableState],
      _events: [Object: null prototype],
      _eventsCount: 6,
      _maxListeners: undefined,
      _writableState: [WritableState],
      allowHalfOpen: true,
      [Symbol(kCapture)]: false,
      [Symbol(kCallback)]: null
    },
    boundary: null,
    disturbed: false,
    error: null
  },
  [Symbol(Response internals)]: {
    type: 'default',
    url: 'https://s3.amazonaws.com/splits.io',
    status: 405,
    statusText: 'Method Not Allowed',
    headers: {
      allow: 'DELETE, GET, PUT',
      connection: 'close',
      'content-type': 'application/xml',
      date: 'Mon, 16 May 2022 18:37:55 GMT',
      server: 'AmazonS3',
      'transfer-encoding': 'chunked',
      'x-amz-id-2': '696PXRWqmIAyUVkx3i4torojOivWwfMEfdcY2WOn6CKvaSbrXzQfXEVgRnYGTszIor1ofcw8Y1Q=',
      'x-amz-request-id': 'BVDSRKNNSC2M1Y61'
    },
    counter: 0,
    highWaterMark: 16384
  }
}

I'm unsure how to proceed.

[glacials]

    body.append('file', JSON.stringify(splits));

The file field is expected to be a File type, not a string. I think this is why you need to use FormData instead of URLSearchParams, but I'm not familiar with Node recommendations specifically. If an example would help, you can look at how the Splits.io frontend uses this API:

splits-io/app/javascript/upload.js

Lines 21 to 51 in f6b4086

	const splitsioResponse = await fetch('/api/v4/runs', {
	method: 'POST',
	headers: headers,
	}).then(r => r.json())
	const formData = new FormData()
	for(const [k, v] of Object.entries(splitsioResponse.presigned_request.fields)) {
	formData.append(k, v)
	}
	formData.append('file', file)
	return fetch(splitsioResponse.presigned_request.uri, {
	method: splitsioResponse.presigned_request.method,
	body: formData
	}).then(function(s3Response) {
	if(s3Response.status === 400 && !options.bulk) {
	Turbolinks.visit('/cant-parse')
	}
	document.getElementById('droplabel').textContent = 'Uploading'
	if(!options.bulk) {
	Turbolinks.visit(splitsioResponse.uris.claim_uri)
	} else {
	return splitsioResponse.id
	}
	}).catch(function(error) {
	// If we are bulk uploading, let the uploadAll function handle the error
	window.isUploading = false
	document.getElementById('droplabel').innerHTML = `Error: ${error.message}.<br />Try again, or email [email protected]!<br />`
	document.getElementById('upload-spinner').hidden = true
	throw error
	})

[slashinfty]

It would appear that using the formdata-node package along with fs.readFileSync() instead of the JS object worked. Thanks!

Working code, in case it helps others in the future:

// Import modules
import * as fs from 'fs';
import fetch from 'node-fetch';
import { FormData } from "formdata-node"

// Import files
import { config } from '../index.js';
import { splits } from './Splits.js';

export const upload = async () => {
    const probe = await fetch(`https://splits.io/api/v4/runs`, {
        method: "POST"
    });
    const response = await probe.json();

    if (response.status !== 201) {
        return 'Upload failed.';
    }

    const body = new FormData();
    for (const key in response.presigned_request.fields) {
        body.set(key, response.presigned_request.fields[key]);
    }
    body.set('file', fs.readFileSync(`${config.splitsPath}/${splits.fileName}.json`));

    const post = await fetch(response.presigned_request.uri, {
        method: response.presigned_request.method,
        body: body
    });

    return `Upload complete. Claim your splits: ${response.uris.claim_uri}`;
}