How do I access JSON component only?-CodePudding

I want to access only the component within a particular JSON header. The fetch code I have written is rendering a JSON output along with the variable name.

I wrote a fetch api and I am returning the response as follows:

fetchPreAuthnConfig: async (data) => {
    try {
      const response = await fetch(preAuthnEndpoint, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(data),
      });
      const configurations = await response.json();
      console.log(configurations);
      return configurations;
    } catch (error) {
      console.error('Error', error);
      return error;
    }
  },

But the json is returned along with the configurations header which is breaking my functionality on the other code block. The JSON response is as follows:

configurations:
  appClientId: "0oa7xxxxxxxxxxxx"
  applicationId: "0oa7xxxxxxxxxxxx"
  applicationLabel: "Application Name"
  createAccount: false
  displayName: "Application Name"
  emailToken: "{}"
  helpTemplateName: "help"
  hideResetAccountOption: false
  rewriteUrl: ""
  scope: "openid profile invites"
  serverTime: 1654682083399
  termsOnPasswdPage: false
  title: "Login"
  workflow: "Authorize"
  workflowHandlerEndpoint: ""
  workflowType: "LOGIN"

How can I refactor the above code so that the returned JSON is:

appClientId: "0oa7xxxxxxxxxxxx"
applicationId: "0oa7xxxxxxxxxxxx"
applicationLabel: "Application Name"
createAccount: false
displayName: "Application Name"
emailToken: "{}"
helpTemplateName: "help"
hideResetAccountOption: false
rewriteUrl: ""
scope: "openid profile invites"
serverTime: 1654682083399
termsOnPasswdPage: false
title: "Login"
workflow: "Authorize"
workflowHandlerEndpoint: ""
workflowType: "LOGIN"

Basically remove the configurations header.

CodePudding user response：

You need to access the key configurations in the JSON object, you can do it as follows:

const { configurations } = await response.json()