Spring mvc loading JS with Uncaught SyntaxError: Unexpected token <

Question

I'm using Spring boot. I have this structure for a simple test app:

What I do in my TestController is to get 2 path variables and load index.html:

@Controller
public class TestController {

    @RequestMapping("/{vara}/{varb}")
    public String index(@PathVariable(value="vara") String vara, @PathVariable(value="varb") String varb) {
        return"/index.html";
    }
}

and the index.html is empty, clean html page:

<!DOCTYPE html>
<html>
<head>
<title>Insert title here</title>
</head>
<body>
TEST
</body>
</html>

so typing localhost:8080/abbas/mirza in my browser and everything looks ok and the html page loads easily. I have 2 js files, test.js and /js/testb.js which both have this line of code inside.

var s = {};

Now I add this

<script src="/test.js"></script>

and everything is still ok and I can view the test.js code, but when I add

<script src="/js/testb.js"></script>

the page throws an exception

Uncaught SyntaxError: Unexpected token <

and when I try to open the testb.js file it shows me this

if I move testb.js into the webapp itself, it will be loaded with no problem. I'm quite newbie using the Spring mvc and still confused with all the configuration regarding routings and accessing resources.

Any idea what I'm doing wrong?

Edit:(link to github) https://github.com/arashzz/test22

What are you doing? Are you trying to write html in js file and then import file within itself? Sound to edgy to me! — arseniyandru
– arseniyandru, Commented Nov 17, 2016 at 16:59
@arash-moeen Could you share this project on GitHub? I don't see the problem based on the data provided... — Kyle Anderson
– Kyle Anderson, Commented Nov 17, 2016 at 17:20
@arseniyandru no I'm not, that's how it's been shown as the error. I only have 1 line of code in my html — arash moeen
– arash moeen, Commented Nov 17, 2016 at 17:26
@punkrocker27ka if i remove the controller routing like that it will simply work but when it gets loaded like that then it behaves like this. I'll share on GitHub and will post here — arash moeen
– arash moeen, Commented Nov 17, 2016 at 17:27

Kyle Anderson · Accepted Answer · 2016-11-18 19:26:21Z

3

The @RequestMapping pattern you're using is so broad that the path to your JavaScript file testb.js matches it and thus the index page is served in lieu of your js file causing the syntax error to occur.

Controller:

@RequestMapping("/{vara}/{varb}")

JavaScript Path:

/js/testb.js

This matches that pattern where vara=js and varb=testb.js

Your other JavaScript file is located at /test.js and thus doesn't match the pattern and is served correctly.

Solution:

Adjust the @RequestMapping pattern to something more narrow such as:

@RequestMapping("/placeholder/{vara}/{varb}")

edited Nov 18, 2016 at 19:26

answered Nov 18, 2016 at 15:52

Kyle Anderson

7,0711 gold badge32 silver badges41 bronze badges

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

4 Comments

arash moeen Over a year ago

I did exactly as you mentioned but still the same error message

Kyle Anderson Over a year ago

@arash-moeen I've updated my answer. Please let me know if this solves your problem.

arash moeen Over a year ago

ok that solved the issue but that means the only way I can load the js file from another folder is to have the URL narrowed like that. right?

Kyle Anderson Over a year ago

@arash-moeen Correct :-)

Issam El-atif · Accepted Answer · 2016-11-17 16:48:37Z

0

Try <script src="js/testb.js"></script> without /as index.html and js directory are in same directory level

answered Nov 17, 2016 at 16:48

Issam El-atif

2,5162 gold badges22 silver badges25 bronze badges

1 Comment

arash moeen Over a year ago

it throws 404 error because without / it will try to access it from http://localhost:8080/abbas/js/testb.js

Collectives™ on Stack Overflow

Spring mvc loading JS with Uncaught SyntaxError: Unexpected token <

2 Answers 2

4 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related