Unable to upload a new file using the response from the Get Customization API

I am using the Get Customization REST API (Endpoint: /k/v1/app/customize).
This is returning correctly.
However, when I try to use the returned fileKeys, I get an error saying, The specified file (id: XXXXXXXX) not found..

I am trying to use the Get Customization API’s response to upload a new file.

The file that I upload via the Upload File API works without problem.

Goal

My goal is to add a customization file, however with out the other file keys for the current customization is overwrites the current files that are attached to the app.

Script

#save() {
  // Upload file
  this.#upload().then(data => {
    // Attach file to app
    this.#attachFile(data.fileKey).then(resp => {
      console.log(resp)
    }).catch(err => {
      console.error(err)
    })
  }).catch(err => {
    console.error(err)
  })
}

#getCustomizations() {
  return new Promise((resolve, reject) => {
    kintone.api(
      kintone.api.url('/k/v1/app/customize'),
      'GET',
      { app: this.#appID },
      resp => resolve(resp),
      err => reject(err)
    )
  })
}

#createBlob() {
  // Create file
  const CONTENT = "const TEST_VAR = true;"
  return new Blob([CONTENT], {
    type: "text/javascript"
  })
}

#upload() {
  return new Promise((resolve, reject) => {

    const FORM_DATA = new FormData()

    FORM_DATA.append('__REQUEST_TOKEN__', this.#requestToken);
    FORM_DATA.append("file", this.#createBlob(), "CustomizationConfigLib_Configs.js")

    var url = `https://${location.host}/k/v1/file.json`;
    var xhr = new XMLHttpRequest();
    xhr.open('POST', url);
    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    xhr.onload = function () {
      if (xhr.status === 200) {
        resolve(JSON.parse(xhr.responseText));
      } else {
        reject(JSON.parse(xhr.responseText));
      }
    };
    xhr.send(FORM_DATA);
  })
}

    async #attachFile(fileKey) {
  const BODY = await this.#getCustomizations()
  BODY.app = this.#appID
  BODY.desktop.js.push({
    type: "FILE",
    file: { fileKey }
  })

  console.log(BODY)

  return new Promise((resolve, reject) => {
    kintone.api(
      kintone.api.url('/k/v1/preview/app/customize'),
      'PUT',
      BODY,
      resp => resolve({ resp, revision: BODY.revision }),
      err => reject(err)
    );
  })
}

Problem

Everything works, except I get the error for the fileKey not found.

I have checked and know that the fileKey in question is referencing the already attached customization file.

Hello @TylerR ,

Welcome to the Kintone Developer Forum & thank you for posting your question!
Thank you for posting your script & error message!

Few questions to better help you out:

Could you kindly elaborate on what is your goal?
Specifically, what do you mean by this sentence:

Thank you ~

I am playing around with the different APIs. Just testing them out and learning what tools Kintone has.

My goal is to add a JS file dynamically to the desktop customization for an App.

Hello @TylerR

If you obtain a filekey by a method other than the Upload File API and upload files, an error you saw will occur.

You must use the Upload File API to obtain filekeys.

To attach files in Kintone

I’m sure you already know this, but as a note for everyone else, to attach files in Kintone, you must use the Upload File API to upload on your Kintone environment first.

And then, you must attach the file to a record, or else the file will be deleted after 3 days if the Add Record API or Update Record API is not used.

I hope this helps.

Ok, so I would first have to download the current customizations, then upload them all to gain the fileKeys for and then I could upload without loosing the currently attached files.

Is this correct?

Hello @TylerR

Theoretically, yes.
Use the Download File API to download the file and upload them.