Returning Dream text back to Server.JS


#1

So when you create a new Hello-Express project you get the Dream HTML setup. When the HTML is displayed using the sendFile the user can enter a new Dream and it’s displayed on the screen. What need to change so that the new Dream entered I can get that text back into the Server.JS program as a Variable?

The reason I ask is I have a project I am working on. The HTML display will be used in a WebView on Messenger. The HTML will have a wheel that spins and then stops. The spot it stops at is the prize they win. I am able to extract the prize in the HTML but want to pass that prize text back to the server.js program so I can use it for other apps. I think once I know how to pass the Dream text back I can apply this to my project.

Sorry for the beginner question - I am new to Node and JS so not sure how to get data back from an HTML display back in the server.js program that served up the HTML. I know sendFIile will not. I have Googled for hours looking for the process. I do see that res.Render might be the answer but couldn’t get it to work - got to be a simply solutions I am not finding. Thanks for the help!


#2

To send data back to the server, you need to use fetch or XMLHTTPRequest. Then, you’d have to add a route to your server.js file that stores the POSTed data somewhere.


#3

In server.js:

app.post("/dreams", function (request, response) {
  // store request.query.dream someplace
  response.sendStatus(200);
});

On the client:
var dream = “some dream”;
.post('/dreams?' + .param({dream: dream}), function() {
// success!
});


#4

Hey Tim thanks!

Being a newbie not sure on this - tried a few ways with no luck. The HTML side is where i am having issues to work.

So the initial request will come from FB Messenger to display the webview. I will call an endpoint (at present I have APP.GET - looks like I need to change that to APP.POST?). So then in the APP.POST you have above how am I putting up the Webview page? There is no sendFile?

On the client side - I am displaying a wheel to spin in the webview. There is a button that is pressed to spin the wheel. Once it stops there is a function that fires to display the prize won. That is what I want to send back to the server.js is the prize won. (like above the dream entered). I have tried to put in what you have and nothing happened. Am I calling the same End point /dreams? Or could I call a different endpoint because I have somethings I want to do once I get the prize back into server.js.

Sorry for the newbie questions - I have been a programmer for 20+ years though with COBOL and RPG - more work station based not internet based programming.


#5

I’d recommend looking through these docs on the fetch function available in the browser.


#6

I will take a deeper look - I had looked at it some the other day. Thanks!


#7

You can have more than one method with the same endpoint name.
GET is usually a request to retrieve data from the server,
POST is usually a request to add data to the server.

So keep your GET and add a POST. Feel free to use a different endpoint name if it makes sense, like /dream instead of /dreams.


#8

Hey All - thanks for all the replies. I used XMLHttpRequest and it’s working awesome! I am calling a different endpoint since I have to run a webhook as well to do some other things. Again thanks for the help!