Calling Javascript function in HTML through express routes

Question

I'm getting an error when trying to call a function in my function2.js. the function is a simple test method createString below. I need to call the function in my driver.html. I use app.get to find the javascript file in my server file (app.js) but I keep getting an error of "GET http://localhost:3000/DRIVER/js/function2.js" when I run "http://localhost:3000/DRIVER/" there is no folder called driver. I just need to use it. the js folder is just in the main folder. How do I call js folders in html in express routes

function2.js

function createString() {
  var hash;
  var firstWord = randomWord();
  var secondWord = randomWord();
  var number = Math.floor(Math.random()*999)+1;

  hash = firstWord + number + secondWord;
  return hash.toString();
} 

function randomWord(){
  var words = ["Apple", "Apricot", "Avocado", "Banana", "Blackberry", "Blueberry", "Cherry", "Grapefruit", "Lemon", "Lime",
            "Coconut","Kiwi","Peach","Pear","Pineapple","Melon","Watermelon","Raspberry","Strawberry","Hanger",
            "Grape","Plum","London","Dublin","Moscow","Berlin","Madrid","Paris","Stockholm","Vienna",
            "Chair","Texas","California","Nevada","Florida","Montana","Bravo","Delta","Echo","Hotel",
            "Tango","Whiskey","Foxtrot","Golf","Zulu","Yankee","Magnet","Button","Watch","Red",
            "White","Green","Black","Yellow","Grey","Blue","Pink","Purple","Diary","Bottle",
            "Water","Fire","Wind","Sweet","Sugar","Stamp","Brush","Small","Medium","Large",
            "Brown","Piano","Guitar","Canvas","Carrot","Mouse","Dog","Cat","Squirrel","Truck",
            "Rabbit","Toothbrush","Chalk","Puddle","Elephant","Giraffe","Frog","Falcon","Eagle","Parrot",
            "Shark","Tiger","Butterfly","Turtle","Snake","Fish","Whale","Walrus","Kangaroo","Wolverine"];
  return words[(Math.floor(Math.random()*100)+0)];
}

Driver.html:

<!doctype html>

<html lang="en">
 <head>
 <meta charset="utf-8">

 <title>driver</title>
 <meta name="description" content="The HTML5 Herald">
 <meta name="author" content="SitePoint">

 <!--[if lt IE 9]>
 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->
 </head>

 <body>
 <script src="js/function2.js"></script>
 <script>
    var session = createString();
    console.log(session);

    var url = window.location.href;
    console.log(url);

    var urlNew = url + "/" + session;
    console.log(urlNew);

    window.location.href = urlNew;
    location.replace(link);
    console.log(link);
 </script>
 </body>
 </html>

app.js :

var express = require('express');
var app     = express();
var path    = require("path");

//possible routes
app.get('/', function (req, res) {
  res.sendFile(path.join(__dirname+'/homepage.html'));
});

app.get('/DRIVER/', function (req, res) {
  res.sendFile(path.join(__dirname+'/driver.html'));
  console.log(req.url);
});

app.get('/NAV/', function (req, res) {
  res.sendFile(path.join(__dirname+'/homepage.html'));
  console.log(req.url);
});

var x = '+([A-Z])+([0-9])+([A-Z])+'

app.get('/DRIVER/'+x, function (req, res) {
  res.send('Hello Driver!');
  console.log(req.url);
});

app.get('/NAV/'+x, function (req, res) {
  res.send('Hello Navigator!');
  console.log(req.url);
});

// route to javascript
app.get('/js/function2', function (req, res) {
  res.sendFile(path.join('/js/function2.js'));
  console.log(req.url);
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

"GET http://localhost:3000/DRIVER/js/function2.js" isn't an error... the error would be what status code was returned, which would give us insight as to why it's failing. — user400654
– user400654, Commented Apr 11, 2016 at 15:51

Max · Accepted Answer · 2016-04-11 15:51:58Z

1

You must add a express.static for this

To serve static files such as images, CSS files, and JavaScript files, use the express.static built-in middleware function in Express.

In your case you must add before of 1st app.get this line

app.use(express.static('public'));

Where you must replace public with your folder

See Serving static files in Express

answered Apr 11, 2016 at 15:51

Max

7,1503 gold badges51 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Chris Hartwig · Accepted Answer · 2016-04-11 16:31:14Z

0

app.get('/js/function2', function (req, res) : there's no .js after function2

<script src="js/function2.js"></script> is requiring a /js/function2.js route

yet express.static is best to serve static content like a js file...

answered Apr 11, 2016 at 16:31

Chris Hartwig

864 bronze badges

Collectives™ on Stack Overflow

Calling Javascript function in HTML through express routes

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related