Help with Fetch & Json

My apologies in advance for what is likely a basic question. Fetch and Json are new to be, as is the Corvid development environment. I am working to send JSON login information to another server via a fetch post. I have a short function (below) to do that. It calls another function that builds an array of login credentials it retrieves from a collection. I have verified that the login credentials are returned correction. No errors are reported in the debugger from this code.

How do I get at the response from the server? Nothing I have tried seems to work. Below is my current attempt.

export async function TestCode(event) {
let loginarray = await getLoginCredentials();
console.log(loginarray); // I have verified login credtials coming back correctly.
let url = [the url I am posting to];

await fetch(url, {
method: ‘post’, data: JSON.stringify({
loginarray
})
.then((response) => {

let txt = response.statusText;
console.log("Response : " + txt); // nothing gets to the log from here no errors in debugging
}
)
}

)
}

Have you already read through the Wix API Reference for Wix Fetch and the Wix Support pages about it?
https://www.wix.com/corvid/reference/wix-fetch.html
https://support.wix.com/en/article/corvid-accessing-third-party-services-with-the-fetch-api
https://support.wix.com/en/article/corvid-web-modules-calling-server-side-code-from-the-front-end

Also, have a look at this tutorial from Yisrael, as it should explain a good deal to you, it is viewable in your Wix Editor already made up with code all setup too.
https://www.wix.com/corvid/forum/corvid-tips-and-updates/example-myapi-and-myapiclient

1 Like

Yes and yes to the support pages. But, as I said, this enviroment and language is new to me. About 30% does not land well. I have looked at @yisrael-wix 's example. However, when I try to view the example, all I see is the following:


Nothing else loads. I have no context. That is the entirety. I am sure it is useful, because others have referenced it. But, I cannot really make use of it, for some reason.

I did some additional reading on asynchronous code. I think that is a part of the issue I am having. I have made some adjustments to my code and now see where I need to put my code to capture the server response. But, the response I am getting back is nothing.

I have stripped the code to the bare basics to help me better understand. This is the current version:

export async function TestCode(event) {
let loginarray = await getLoginCredentials();
let jsonarray = JSON.stringify(loginarray);
console.log(loginarray); // I have verified login credentials coming back correctly.
let url = [the url I am posting to];
console.log(jsonarray);
fetch(url, {
“method”: “post”, body: jsonarray
})
.then((httpResponse) => {
console.log(httpResponse);
})
}

final console.log() is empty.

@mike70099
When you open the example up in your Wix Editor, you will need to enable Corvid (Dev Mode - Enable Corvid), then you will be able to see all the code in the http-functions.js file in the backend.

Also as you are talking about and using asynchronous code, then have a read of this page about working with promises.
https://support.wix.com/en/article/corvid-working-with-promises

@givemeawhisky Thanks again. When I open it in the Wix editor and look at the code, I don’t think it is going to help me. I am needing examples of the fetch. All I see in this example are responses to fetches. Even searching the code for “fetch” I find only one instance. It is the first line that reads, “// This backend file exposes an API that replies to requests (fetch) from a client app.”

I take that to mean this backend that I am looking at is responding to the fetch. I’m clearly looking in the wrong place.

@givemeawhisky My bad. Sorry. I later saw there are 2 example apps. I found the app doing the fetching. Digging through the code still. But, I don’t think it answers the very basic question that I have.

Look at my above code. Look at just these two lines:

.then((httpResponse) => {
console.log(httpResponse);

I believe this should collect the response from the fetch() post and put it in the console.log. Right? If the response comes back in json, I should still expect to see something in the log, right?

@mike70099 As always, StackOverflow has the clearest/easiest to understand answers:
https://stackoverflow.com/a/42493030

1 Like

@skmedia Thanks much. That is similar to what I ended up doing. 2 aspects about it: 1) adding a 2nd .then() to ensure the json is decoded. 2) I also added a JSON.stringify() to make the console.log() readable. Thanks again.