Display dynamic webpage content based on URL parameter (Parse Cloud, Express, ejs)

Question

I'm new to programming and for this project I'm building a web app using Parse.com Cloud Code and Express. The structure looks like this:

app.js (Express related codes)
views/hello.ejs (template)
main.js (cloud functions)

I also have an iOS app that can post a link on Facebook that looks like this: myapp.parseapp.com/hello?objectid. When Facebook users click that link and get redirected to the web app, the web app will automatically res.render the template based on the provided objectid. The objectid is then used to get some data, which will be displayed on the page, from a Parse class using Parse.Query, but my obstacle is not about Parse.Query.

To check if objectid is successfully captured by the server, I tried the following codes to render the template and insert the objectid into the placeholder for the text variable, but the put objectid here is not changed to the provided objectid when page is loaded. Can anyone tell me what went wrong, or if I should do this in another approach?

hello.ejs (template):

<!DOCTYPE html>
<html>
  <head>
    <title>My Web App</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript">
        $.post('/hello', {oid: window.location.toString().split("?")[1]});
    </script>
  </head>
  <body>
    <p><%= text %></p>
  </body>
</html>

app.js (express):

// Initialize Express in Cloud Code.
var express = require('express');
var app = express();

// Global app configuration section
app.set('views', 'cloud/views');  // Specify the folder to find templates
app.set('view engine', 'ejs');    // Set the template engine
app.use(express.bodyParser());    // Middleware for reading request body

// Render view
app.get('/hello', function(req, res) {
    res.render('hello', { text: 'put objectid here' });
});

app.post('/hello', function(req, res) {
    res.render('hello', { text: req.body.oid });
});

app.listen();

I found the solution in another post: http://stackoverflow.com/questions/20089582/how-to-get-url-parameter-in-express-node-js — Pork, Jun 02 '15 at 07:43

score 1 · Accepted Answer · edited May 23 '17 at 12:05

After some more research I came across this post: how to get url parameter in express node js. Decided to give it a try and it was successful! Here's the solution.

URL is changed to: myapp.parseapp.com/hello?id=objectid

The <script> in <head> is no longer needed. The final codes look like this:

hello.ejs (template):

<!DOCTYPE html>
<html>
  <head>
    <title>My Web App</title>
  </head>
  <body>
    <p><%= text %></p>
  </body>
</html>

app.js (express):

// Initialize Express in Cloud Code.
var express = require('express');
var app = express();

// Global app configuration section
app.set('views', 'cloud/views');  // Specify the folder to find templates
app.set('view engine', 'ejs');    // Set the template engine
app.use(express.bodyParser());    // Middleware for reading request body

// Render view
app.get("/hello", function(req, res) {
  res.render('hello', { text: req.param("id") });
});

app.listen();

Cheers!

Display dynamic webpage content based on URL parameter (Parse Cloud, Express, ejs)

1 Answers1