When I link javascript file in html it sends a request to server and causing error

Question

I am using express and node.js in backend and ejs templating engine in front-end. My app.js look like this

app.get(\'/book/:id\', (req, res)=>{
var book_i         


        

Answer 1

I think that your book.ejs file is under the route of '/book'. if that so, you script tag like <script type="text/javascript" src="books.js"></script> will access the route of /book/book.js ,not your assets. so you should set you src attribute like this /book.js and make sure you had made your assets accessible.

Answer 2

Since script links have relative paths, they are loaded from current path, which is /book.

They should either have absolute paths:

<script type="text/javascript" src="/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="/books.js"></script>

Or base URL should be specified:

<base href="/">

Answer 3

You are using relative path in src attribute. Since you are serving the page from /books/<id>, if you use a relative path, browser will understand it as /books/(relative_path_of_resource) and so when it comes across those links it is sending a request to books/jquery.js and books/books.js

You should convert your link to point to the correct static path of the js files. Refer this link - https://expressjs.com/en/starter/static-files.html to see how to serve static files and once you set up the serving, you can change the links to /static/books.js and /static/jquery.js