Understand MISSING_PARAMS

[VincentTam]

Problem

During setup, one might run into MISSING_PARAMS.

Raison d'être

Among the issues found with this error code:
https://github.com/eduardoboucas/staticman/issues?q=MISSING_PARAMS
none of them gives a simple explanation of this error.

Goal

Get response 200 or 302 from the API instance.

Discussion

Comparison with URL encoded form

When the content type is URL encoded form (x-www-urlencoded), the following request works.

options[slug]=test-slug
fields[name]=arbit
fields[email]=se@sldfk.sdf
fields[message]=testsklfdj

<form method="POST" action="https://{your-API-instance}/v3/entry/{git-provider}/{user}/{repo}/master/comments">
  <input name="options[redirect]" type="hidden" value="https://{user}.{git-provider}.io/{repo}/">
  <input name="options[slug]" type="hidden" value="test-slug">
  <label>Name: <input name="fields[name]" type="text"></label><br>
  <label>Email: <input name="fields[email]" type="email"></label><br>
  <label>Message: <br><textarea name="fields[message]" rows="12" cols="36"></textarea></label><br>
  <input type="submit" value="Submit">
</form>

🔗 https://git.io/smdemo

Conversion to JSON string

One might want to use JSON.stringify to convert the form data to a JSON-friendly string.

var form = document.querySelector('.new-comment');
var formData = new FormData(form);
JSON.stringify(Object.fromEntries(new FormData(form)))

ℹ️ I learnt using Object.fromEntries() withnew FormData() from Go Make Things.

The last line gives a condensed object which can be prettified to the object shown in the first screenshot.

{
  "options[redirect]":"https://vincenttam.github.io/TestStaticmanLab/",
  "options[slug]":"test-slug",
  "fields[name]":"arbit",
  "fields[email]":"se@sldfk.sdf",
  "fields[message]":"testsklfdj"
}

💡 I omit options[redirect] in the JSON for simplicity.

The server responses with MISSING_PARAMS.

{
    "success": false,
    "errorCode": "MISSING_PARAMS",
    "data": ["fields"]
}

The API server is expecting something like

{
  "fields": {
    "key1": "value1",
    "key2": "value2"
}

instead of

{
  "fields[key1]": "value1",
  "fields[key2]": "value2"
}

Solution

The solution is illustrated in screenshot in the goal. The request JSON's field has to represent an object containing the key-value pairs. For a sample implementation, you may consult @'s functions at
https://github.com/onweru/hugo-swift-theme/blob/7a42577d943fc6e267be410683a551b8367df563/assets/js/index.js#L281
in a repo that I was invited as a collaborator.