Error: friends.js:1 Uncaught SyntaxError: Unexpected token <, after using express.static and change html content after button click

Question

I am trying to display home.html on initial load of localhost:9000, but when I do when the way my current code is, I get the error: friends.js:1 Uncaught SyntaxError: Unexpected token < . I am not sure what this error means. Also, when I do windows.location = localhost:9000/list, in my display.js, the get requests will not send the list.html to the browser, and nothing changes. I tried putting the get request in both server.js and display.js but they both do nothing.

Directory layout

dir main
    -server.js
    dir subMain
      dir display
        -display.js
      dir routing
        -routes.js
      dir public
        -home.html
        -list.html

server.js

var path = require('path');
var express = require('express');
var app = express();
require('./subMain/routing/routes.js')(app, path, express);

app.listen(9000, function(){
     console.log('connected on 9000')
})



//app.get('/list', function(request, response){
       // response.sendFile(path.join(__dirname + '/..', 'public', 'list.html'));
    //});

routes.js

module.exports = function(app, path, express){
    app.use(express.static("subMain"))
    app.use(express.static(__dirname + "/public"));
    app.use(express.static(__dirname + "/routing"));
    app.use(express.static(__dirname + "/display"));
    app.use(function(request, response, next){
      response.sendFile(path.join(__dirname + "/..", "public", "home.html"));
    })
    app.get('/list', function(request, response){
        response.sendFile(path.join(__dirname + '/..', 'public', 'list.html'));
    });

}

display.js

$(document).on('click', '#btn', sendSurvery);

function sendSurvery(){
    window.location = 'survey.html';
    //var myQueryUrl = "http://localhost:9000/survey";

    //$.ajax({url: myQueryUrl, method: 'GET', success: function(result){
        // location.href = "http://localhost:9000/list"

    //}}).done(function(response){

    //});
}

home.html

<!DOCTYPE html>
<html>
<head>
    <title>Friend Finder Home Page</title>

</head>
<body>
    <div class="rowOne">
        <!-- <div class="jumbotron col-lg-6"> -->
          <h1>Hello, world!</h1>
          <p>Click the button</p>
          <button id="btn" style="width: 200px;">BUTTON</button>
        <!-- </div> -->
    </div>
<script src="https://code.jquery.com/jquery.js"></script>
<script type="text/javascript" src="../data/friends.js"></script>
</body>
</html>

Answer 1

You haven't supplied your home.html file, but the issue you're encountering is that your friends.js is not being found by express, and your home.html file is being returned instead. The first character in your home.html file is < and this is why you're getting the error. Check you are referencing the correct path of friends.js and that it is present in your static assets folder.

To confirm my explanation, you can directly access the url you're using to access friends.js and see the contents of home.html returned.

Error: friends.js:1 Uncaught SyntaxError: Unexpected token <, after using express.static and change html content after button click

Question

1 answers

solution1
0 2017-01-04 05:24:02

Error: friends.js:1 Uncaught SyntaxError: Unexpected token <, after using express.static and change html content after button click

Question

1 answers

solution1 0 2017-01-04 05:24:02

solution1
0 2017-01-04 05:24:02