How to receive a JSON file from a glitch-hello-website to a node.js app

Hi I’m trying to make a login thing in html and I’m trying to make it so basically you type your email in the box and then it emails you a code that you have to type to login, basically like glitch’s “magic email” login. I got the email system set up and here is what I’m trying to do. In my website the script does a http POST and the node.js app receives a JSON file so it can email someone. Then the node.js app can returns the code. I just need help on sending the JSON file and returning a 6 digit code. Please help!

Do you have some code we can work on, for the JSON sending part?

1 Like

Here is the Website code and Node.Js code

1 Like

Uhhh, what about the POST request part?

1 Like

I haven’t added that yet and that’s the part I need help on

2 Likes

Sorry for asking so many questions, but do you have the code that does this?

1 Like

No I don’t have the code for that yet.

1 Like

Now’s a good a time to start on that as any! Here’s a guide on how to POST a JSON file Using the Fetch API - Web APIs | MDN

You end up needing to do it from JavaScript, because forms tend to encode stuff in other formats, such as urlencoded.

I did that on my website but how do I set it to receive on my node.js app?

1 Like

what framework are you using on the server side? express?

1 Like

Yeah on node.js

1 Like

Express 4.x - API Reference they have a middleware for accepting JSON data. use that, and you can get the stuff with req.body Express 4.x - API Reference

Thanks but is it possible to send the JSON file from a glitch-hello-website to a node.js app?

1 Like

yup, you can use nodejs’s http or https module. or if you already have code what works with fetch in a browser, you can get the node-fetch package from npm to run it on the server

3 Likes

I’ve been trying to understand how to do it on that website you linked but I still don’t know.

uh-oh, I hadn’t linked to the websites about the latest understanding of what you’re trying to do! but here’s a link for that right now: node-fetch - npm

maybe see if you can get that snippet working in isolation and then integrate it into your node.js project.

also, to clarify: this is less “send from the static site” and more “request from the node.js app”

2 Likes

I looked on the site and I could figure out how to do it. I’m new to JavaScript btw

1 Like

cool, glad to hear that the example worked out. were you later able to use one of these techniques in your project?

Oops there was a typo I meant I couldn’t do it

1 Like

oh shoot :grimacing: maybe you could share how far you got and your thoughts on what’s going wrong with the latest attempt?

1 Like

I couldn’t find the part that I was supposed to use on the node.js side

“Part” isn’t entirely specific, but there are sort of two things to put on the node.js side. The first is the “npm package” node-fetch, which you kind of find by knowing the package name. That package name is “node-fetch,” so hooray, there it is. BTW in case you haven’t tried adding an npm package on Glitch before, they have a tutorial on how to do it: https://help.glitch.com/kb/article/42-how-do-i-add-an-npm-module-or-package-to-my-project/

The second thing to put on the node.js side is a piece of code that uses the package. I suggested that you try is to get sample piece of code from the node-fetch readme. It’s a little spread out throughout the documentation, but it’s here node-fetch - npm

const fetch = require('node-fetch');

and here node-fetch - npm

fetch('https://api.github.com/users/github')
    .then(res => res.json())
    .then(json => console.log(json));

I hope this helps on what it is to find the “parts” that you’d need to try this out.

There’s still a lot for you to do though. For one, see if you can figure out where to add this code in your project so that it runs.

1 Like

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.