0

Really fast, this question may have already been asked, but I am not totally clear on the terminology and have had no success when searching for a solution.

I am attempting to create a simple web application that can receive get and post requests. Then, I would like to take the information I receive from these requests and use them in a javascript file embedded in html that is displayed. I think it may be more clear with code. This is my app.js:

var express = require('express');
var app = express();
var assert = require('assert');



app.use(express.static('javascript'));
app.get('/', function(req, res) {
    res.render('index.jade');
});

app.listen(3000);

I would then like to be able to take information received from a get or post request, specifically in JSON format, and then be able to use it in javascript that I have linked to index.jade. To make matters slightly more confusing in index.jade the only line is:

include map.html

So ideally I would be able to get the information to javascript in that html file.

I want to be able to pretty continuously update map.html using javascript based on frequent get and post commands.

This could be a very simple solution, I am pretty new with web application programming in general, and I have been struggling with this problem. Thanks in advance, and ask if you need any clarification.

eweiner
  • 37
  • 6

3 Answers3

3

I think you need to understand what you are doing. You are creating a web server using node.js. Express framework simplifies that for you. The official documentation of express is pretty great. You should refer that especially this link.

Now, in your application, you need to create endpoints for GET and POST requests. You have already created one endpoint "/" (root location) that loads your home page which is the contents of the file index.jade. A small example is :

 app.get('/json', function (req, res) {
      res.setHeader('Content-Type', 'application/json');
      res.send(JSON.stringify({ a: 1 }));
 });

Jade is a templating engine which resolves to HTML. You should refer its documentation as well. Since as you said, you are not very familiar with these, you could simply use HTML as well.

After this tasks are quite simple. In your javascript, using ajax calls you can access the GET or POST endpoints of your server and do the desired actions.

Hope it helps!

hkasera
  • 2,118
  • 3
  • 23
  • 32
  • So I think that my question is a little different, the javascript that I want to refer to is a separate file referred to in map.html. In other words I want to be able to use information that the node server receives in the map.html. To do this do I have to make a second request to the server or is there a way to share the data in a database or something? My comment on skywritergr gives a little more insight into what I want, Thanks! – eweiner Jan 27 '16 at 15:59
  • Alright! I am glad you got your answer with the help of skywritergr. – hkasera Jan 28 '16 at 04:04
2

The way I get it you want to be able to call an endpoint (lets assume /awesome) pass some info and then write to a Javascript file that you can then reference in your html.

Something like the below would write a main.js file in your public folder. You can make it write whatever you want.

var fs = require('fs');
fs.writeFile("/public/main.js", "console.log('Hello!')", function(err) {
if(err) {
    return console.log(err);
}
console.log("The file was saved!");
});

You can then reference /public/main.js in your html.

Check that: Writing files in Node.js

If I misunderstood your intentions, apologies. :)

skywritergr
  • 148
  • 1
  • 1
  • 14
  • I think that you almost get it, but I am using a javascript file in map.html already to render a google map, and I will be receiving updates to the location of markers on a map through GET and POST requests. I refer to the file in map.html using src="/javascript/map.js", is there any way that I could store the location of markers as a new json file or something and access it in map.js? – eweiner Jan 27 '16 at 16:02
  • You can always use the above to write to a locations.json file and then call that within your initial script. So do something like: 1. call backend API that writes the JSON 2. on successful write return a {success: true} to the front end. 3. Use a callback on the front-end that on success will read the JSON and update your map. I bet there are more optimal ways to achieve what you want within the Google maps API. – skywritergr Jan 27 '16 at 16:05
  • So I guess my question is how do I write a {success:true} to the front end from the backend, that is the crux of my question. – eweiner Jan 27 '16 at 16:08
  • return res.json will do the trick. Check http://expressjs.com/en/api.html#res.json (if you are using v.4) – skywritergr Jan 27 '16 at 16:11
1

So you want to reviece continuously data from the server maybe web sockts are an option for you http://socket.io/docs/

This way u will open a stable connection from the client to the server. This is a great way if u want to get updates done by other clients.

If you want to trigger the changes by the client then ajaxs calls(http://www.w3schools.com/ajax/) as hkasera mentioned are the way to go.

Lukas Bonzelett
  • 308
  • 2
  • 13