syntax error: unexpected token <

I've tried many things and there's no way, always appears this error I tried to use only one option to see if passed, changed the call of jquery, but not.

I looked in various places on the internet about this error, but could not solve or understand why it is happening. On my pc using EasyPHP works perfectly, but when I put online does not work.

Syntax Error: unexpected token <

Here's my code:

$(function(){
$('#salvar').click(function(){
    var key = 'salvar';
    var title = $('#title').val();
    var opcao1 = $('#opcao1').val();
    var opcao2 = $('#opcao2').val();
    var opcao3 = $('#opcao3').val();
    var opcao4 = $('#opcao4').val();
    var opcao5 = $('#opcao5').val();
    var opcao6 = $('#opcao6').val();

    if(title.length > 0){
        if(opcao2.length > 0){
            $('#resposta').removeClass().html('Salvando a enquete...<br clear="all"><br><img src="images/switch-loading.gif" />');
            $.ajax({
            type : 'POST',
            url : 'funcoes/enquete_adm.php',
            dataType : 'json',
            data: {key:key,title:title,opcao1:opcao1,opcao2:opcao2,opcao3:opcao3,opcao4:opcao4,opcao5:opcao5,opcao6:opcao6},
            success : function(data){
                if(data.sql == 'ok'){
                        $('#resposta').addClass('success-box').html('Enquete Salva!').fadeIn(1000);
                        $('#control').fadeOut();
                    }else if(data.sql == 'error'){
                        $('#resposta').addClass('info-box').html('Ops, aconteceu um erro. Por favor, tente novamente').fadeIn(1000);
                    }
                },
            error: function (XMLHttpRequest, textStatus, errorThrown) {    
                alert("XMLHttpRequest " + XMLHttpRequest[0]);alert(" errorThrown: " + errorThrown);alert( " textstatus : " + textStatus);    
            }
            });
        }else{
            $('#resposta').addClass('warning-box').html('É necessário no mínimo duas opções');
        };
    }else{
        $('#resposta').addClass('warning-box').html('Coloque a pergunta da enquete');
    };
    return false;

});
}); // End

Answers:

Answer

This usually happens when you're including or posting to a file which doesn't exist. The server will return a regular html-formatted "404 Not Found" enclosed with

'<html></html>' 

tags. That first chevron < isn't valid js nor valid json, therefore it triggers an unexpected token.

What if you try to change 'funcoes/enquete_adm.php' to an absolute url, just to be sure?

EDIT (several years later)

The root cause might not always come from 404 errors. Sometimes you can make a request to an API and receive HTML formatted errors. I've stumbled to a couple of cases in which the API endpoint should have returned

{
   error: "you must be authenticated to make this request"
}

With header 401. And instead I got

<html>You must be authenticated to make this request</html>

With header 200.

Given the header is 200 you can't tell the request has failed beforehand, and you're stuck to try and JSON.parse the response to check if it's valid.

Answer

You have unnecessary ; (semicolons):

Example here:

 }else{
        $('#resposta').addClass('warning-box').html('É necessário no mínimo duas opções');
    };

The trailing ; after } is incorrect.

Another example here:

}else{
    $('#resposta').addClass('warning-box').html('Coloque a pergunta da enquete');
};
Answer

I suspect you're getting text/html encoding in response to your request so I believe the issue is:

dataType : 'json',

try changing it to

dataType : 'html',

From http://api.jquery.com/jQuery.get/:

dataType Type: String The type of data expected from the server. Default: Intelligent Guess (xml, json, script, or html).

Answer

The error SyntaxError: Unexpected token < likely means the API endpoint didn't return JSON in its document body, such as due to a 404.

In this case, it expects to find a { (start of JSON); instead it finds a < (start of a heading element).

Successful response:

<html>
  <head></head>
  <body>
    {"foo": "bar", "baz": "qux"}
  </body>
</html>

Not-found response:

<html>
  <head></head>
  <body>
    <h1>Not Found</h1>
    <p>The requested URL was not found on the server.  If you entered the URL manually please check your spelling and try again.</p>
  </body>
</html>

Try visiting the data endpoint's URL in your browser to see what's returned.

Answer

I had a similar problem, and my issue was that I was sending javascript to display console messages.

Even when I looked at the file in my browser (not through the application) it showed exactly as I expected it to (eg the extra tags weren't showing), but there were showing in the html/text output and were trying to be parsed.

Hope this helps someone!

Answer

I suspect one of your scripts includes a source map URL. (Minified jQuery contains a reference to a source map, for example.)

When you open the Chrome developer tools, Chrome will try to fetch the source map from the URL to aid debugging. However, the source map does not actually exist on your server, but you are instead sent a regular 404 page containing HTML.

Answer

This error can also arise from a JSON AJAX call to a PHP script that has an error in its code. Servers are often set up to return PHP error information formatted with html markup. This response is interpreted as invalid JSON, resulting in the "unexpected token <" AJAX error.

To view the PHP error using Chrome, go to the Network panel in the web inspector, click the PHP file listed on the left side, and click on the Response tab.

Answer

When posting via ajax, it's always a good idea to first submit normally to ensure the file that's called is always returning valid data (json) and no errors with html tags or other

<form action="path/to/file.php" id="ajaxformx">

By adding x to id value, jquery will not process it.

Once you are sure everything is fine then remove the x from id="ajaxform" and the empty the action attribute value

This is how I sorted the same error for myself just a few minutes ago :)

Answer

I was also having syntax error: unexpected token < while posting a form via ajax. Then I used curl to see what it returns:

curl -X POST --data "firstName=a&lastName=a&[email protected]&pass=aaaa&mobile=12345678901&nID=123456789123456789&age=22&prof=xfd" http://handymama.co/CustomerRegistration.php

I got something like this as a response:

<br />
<b>Warning</b>:  Cannot modify header information - headers already sent by (output started at /home/handymama/public_html/CustomerRegistration.php:1) in <b>/home/handymama/public_html/CustomerRegistration.php</b> on line <b>3</b><br />
<br />
<b>Warning</b>:  Cannot modify header information - headers already sent by (output started at /home/handymama/public_html/CustomerRegistration.php:1) in <b>/home/handymama/public_html/CustomerRegistration.php</b> on line <b>4</b><br />
<br />
<b>Warning</b>:  Cannot modify header information - headers already sent by (output started at /home/handymama/public_html/CustomerRegistration.php:1) in <b>/home/handymama/public_html/CustomerRegistration.php</b> on line <b>7</b><br />
<br />
<b>Warning</b>:  Cannot modify header information - headers already sent by (output started at /home/handymama/public_html/CustomerRegistration.php:1) in <b>/home/handymama/public_html/CustomerRegistration.php</b> on line <b>8</b><br />

So all I had to do is just change the log level to only errors rather than warning.

error_reporting(E_ERROR);
Answer

i checked all Included JS Paths

Example Change this

<script src="js/bootstrap.min.js" type="text/javascript"></script>

TO

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/javascript"></script>
Answer

Removing this line from my code solved my problem.

header("Content-Type: application/json; charset=UTF-8"); 
Answer

Just gonna throw this in here since I encountered the same error but for VERY different reasons.

I'm serving via node/express/jade and had ported an old jade file over. One of the lines was to not bork when Typekit failed:

script(type='text/javascript')
  try{Typekit.load();}catch(e){}

It seemed innocuous enough, but I finally realized that for jade script blocks where you're adding content you need a .:

script(type='text/javascript').
  try{Typekit.load();}catch(e){}

Simple, but tricky.

Answer

Just ignore parameter passing as a false in java script functions

Ex:

function getCities(stateId,locationId=false){    

    // Avoid writting locationId= false kind of statements
   /*your code comes here*/

 }

Avoid writting locationId= false kind of statements, As this will give the error in chrome and IE

Answer

This happened to me with a page loaded in via an iframe. The iframe src page had a 404 script reference. Obviously I couldn't find the script reference in the parent page, so it took me a while to find the culprit.

Answer

make sure you are not including the jquery code between the

< script > < /script >

If so remove that and code will work fine, It worked in my case.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.