Refactor from fetch to await that can yield same result

Question

So I moved over a non-reusable fetch request code snippet to my API:

let response = await fetch(visitURL, {
 method: 'POST',
 headers: {
  'Content-Type': 'application/json',
  'Authorization': 'Bearer ' + userJWT
 },
 body: JSON.stringify(endingVisit)
});
if (response.ok) {
  let {visitId, createdAt} = await response.json();
  const viewVisitDto = new ViewVisitDto(`${visitId}${createdAt}${visitorId}${doctorId}${oldPatientId}`);
return viewVisitDto;
} else {
  throw new Error("deactivated!")
}

I was able to get this far:

axios.post(visitURL, {
  headers,
  body: JSON.stringify(visit)
}).then((response) => {
  console.log(response);
}).catch((error) => {
  console.log(error);
})

But does not exactly give me the visitId and createdAt from the response and I cannot use a response.ok nor a response.json(). Essentially I need to pull out that visitId and createdAt that should be coming back in the response.

I also tried just using node-fetch library, but although in VS code it seems to accept it, TypeScript is not happy with it even when I do install @types/node-fetch and even when I create a type definition file for it, my API just doesn't like it.

I'm not sure what it is that you are trying to ask, but `node-fetch` has recently switched to ES6 module format in their package, so you need to downgrade to the previous major version (2.x.x, I believe) in order to be able to use it with TypeScript and `@types/node-fetch`. (Or convert your project into a module, which is probably less convenient.) — hayavuk, Oct 22 '21 at 23:01
"is not happy with it"/"doesn't like it" isn't exactly the best error report I've ever seen. What is the question? You can `await axios.post(...)` just like you awaited `fetch`. The API of the response is different, so you may have to do some work and look up the documentation to see what `response` gives you... — Heretic Monkey, Oct 22 '21 at 23:23
Don't get it? Why not just use the fetch version if it works?.. `non-reusable fetch request code` not even sure what that means. — Keith, Oct 22 '21 at 23:23
@hayavuk, it does not like version `2.6.5` either, meaning TypeScript is still complaining and I installed the `@types/node-fetch` and I added a `.d.ts` file. I even restarted the editor. — Daniel, Oct 22 '21 at 23:32
@Daniel does the `@types/node-fetch` version match the version of the `node-fetch` package? — hayavuk, Oct 22 '21 at 23:38
@hayavuk, so no matching version of `@types/node-fetch`. This can't be right, but it is because `@types/node-fetch` did not start to match `node-fetch` until version `3.0.0` So version `3.0.0` does not support `import/export` ES6 module system? — Daniel, Oct 22 '21 at 23:44
It's this thing: https://stackoverflow.com/a/62554884/12563460 — hayavuk, Oct 22 '21 at 23:52
@hayavuk, looks like version `3.0.0` works, except now I am getting `[ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts"` — Daniel, Oct 23 '21 at 00:00

score 0 · Answer 1 · answered Oct 22 '21 at 23:00

Guessing what you are after is

// don't know axios, but if it returns a promise await it
const dto = await axios.post(visitURL, {
      headers,
      body: JSON.stringify(visit)
    }).then((response) => {
      // parse response
      return {resonse.visitId, resonse.createdAt}
    }).then(({visitId, createdAt}) => {
      // form dto (where are other vals)?
      return new ViewVisitDto(`${visitId}${createdAt}${visitorId}${doctorId}${oldPatientId}`);
    }).catch((error) => {
      console.log(error);
    })

However - you don't mention where doctorId and oldPatientId come from... You try providing more info, including output of the console.log's and the surrounding code

yeah it seems like `response` objest does not have that `createdAt` in there, I am getting `object literal cannot have multiple properties with the same name in strict mode`. — Daniel, Oct 22 '21 at 23:35

Refactor from fetch to await that can yield same result

1 Answers1