How to fix 'Uncaught SyntaxError: Unexpected token <'

Question

I have a piece of Javascript code that worked before on PHP5.6 However, when I upgraded to PHP7.2 it stopped working and getting this error below:

VM505:2 Uncaught SyntaxError: Unexpected token <
    at Function.globalEval (jquery.tools.min.js:49)
    at Function.httpData (jquery.tools.min.js:152)
    at XMLHttpRequest.x.onreadystatechange (jquery.tools.min.js:149)
globalEval  @   jquery.tools.min.js:49
httpData    @   jquery.tools.min.js:152
x.onreadystatechange    @   jquery.tools.min.js:149
XMLHttpRequest.send (async)     
ajax    @   jquery.tools.min.js:150
chkpwd  @   hw.php:295
onclick @   hw.php:877

I can't figure out that the error said chkpwd @ hw.php 295, but this function is actually in LINE 387. So, I don't know where to look into.

What's the best way to debug this and fix it?

function chkpwd() {

  var pwd_val = $("#engpassword").val();

  $.ajax({
    url: 'password.php',
    dataType: 'jsonp',
    jsonp: 'processData',
    data: {
      pwd: pwd_val,
      callback: 'pwdaction'
    },
    error: function(xhr) {
      alert('Ajax request error!');
      $(e.target).attr('disabled', false);
    }
  }); 
}

Answer 1

通常它指的是一个响应，而不是一个可解析的 JSON 返回（IE）一个 HTML，其中开始标记以<

Answer 2

If you are working with React app and you see this error in your console, it might be due to the missing "type" attribute of the script tag in your index.html file. Make sure to include type="text/jsx".

Also, the URL that you are trying to access is not returning Javascript or JSON but HTML, give the correct path to the "src" attribute of your script tag beginning with "/" followed by the path of the .js file.

I took reference from the following link, do take a look as I have just briefed what was written in this article: https://idiallo.com/javascript/uncaught-syntaxerror-unexpected-token#n

PS - Go through the comments section within the article

Answer 3

In my case ( Webpack v.5 + React ) it was happen on pages with 2nd or more nested level of pages. All assets are included using relative path like sct="./index.js" . So for nested pages become broken.

To fix it need to add <base href="http://yoursitename.com">

If you are using webpack you can add:

const htmlWebpackPlugin = new HtmlWebpackPlugin({
  template: path.resolve(__dirname, 'src', 'index.html'),
  title: WebSiteName,
  base: isLocal ? 'http://localhost:4008' : 'http://yoursitename.com',
});

which will inject the element <base href="...">