How to await a json return value (the return takes at least 30 seconds) before logging it? javascript/react/express

问题

This is a follow up to these threads:

How to set state of a react component with a specific item from a returned json object?

How to return json data to a react state?

I am using web3 to sign a transaction on Ethereum, which then sends a json object with transaction data. The json takes at least 30 seconds to return.

I am trying to console.log() the data with the following code:

axios.post(
    "http://compute.amazonaws.com:3000/users", 
    {
        value: "value",
        fileName: "fileName",
        hash: "hash"
    }
)
.then(res => { console.log(res.data);});

There is no log appearing in the console.

The above is actually part of a bigger function, which I have made async and added await. This did not produce any results or errors:

const onSuccess = async payment => {
      axios.post(
        "http://ec2-54-67-28-69.us-west-1.compute.amazonaws.com:3000/users",
        {
        value: "value",
        fileName: "fileName",
        hash: "hash"
        }
      );
      await (res => {
        console.log(res.data);
      });

I think the issue is that Ethereum takes some time to mine the transaction. I need to wait for the json response before logging it.

My express server is having no issues, the json is successfully logged on the server.

Any ideas? Thanks!

回答1:

First block of code seems working, may be you want to attach .catch to it as error handler.

axios.get('https://jsonplaceholder.typicode.com/todos/1')
  .then(response => console.log(response.data))
  .catch(function(error) {
    console.log(error);
  });

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

In second part I think you are doing await wrong. You are awaiting on a function which never gets called. Await is supposed to be listening on something that gets called in below instance a promise returned by axios

const samplePayload = {
  "userId": 100,
  "id": 100,
  "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
  "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
};


// Using GET here for demo but you can swap it with POST
const onSuccess = async payment => {
  return await axios.get(
    "https://jsonplaceholder.typicode.com/posts", samplePayload
  ).then(res => {
    console.log(res.data);
  });
}

console.log(onSuccess());

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

I hope that clarifies.

回答2:

Your second is wrong, you are never getting the response

const onSuccess = async payment => {
  const res = await axios.post(
    "http://ec2-54-67-28-69.us-west-1.compute.amazonaws.com:3000/users",
    {
    value: "value",
    fileName: "fileName",
    hash: "hash"
    }
  );
  console.log(res.data);
  return res.data
}

Also, as Rikin said, your first code seems ok. Try adding the .catch

来源：https://stackoverflow.com/questions/53750439/how-to-await-a-json-return-value-the-return-takes-at-least-30-seconds-before-l

标签

javascript

json

axios

ethereum

web3