«SyntaxError: неожиданный токен <в JSON в позиции 0»

Вы получаете HTML (или XML) обратно с сервера, но dataType: json сообщает jQuery для синтаксического анализа как JSON. Проверьте вкладку "Сеть" в инструментах Chrome dev, чтобы просмотреть содержимое ответа сервера.

Это оказалось проблемой для меня. Я пытался получить доступ к URL-адресу, с которым у меня не было разрешения с cancan, поэтому URL-адрес был переключен на users/sign_in. перенаправленный URL-адрес отвечает на html, а не json. Первый символ в html-ответе <.

Я испытал эту ошибку "SyntaxError: Неожиданный токен m в JSON в позиции", где токеном "m" могут быть любые другие символы.

Оказалось, что я пропустил одну из двойных кавычек в объекте JSON, когда я использовал RESTconsole для теста DB, как { "name:" math "}, правильный должен быть {" name ":" math " }

Мне потребовалось много усилий, чтобы выяснить эту неуклюжую ошибку. Я боюсь, что другие столкнутся с подобными обломками.

В моем случае я получал этот запущенный веб-пакет, и он оказался некорректным в локальном каталоге node_modules.

rm -rf node_modules
npm install

... было достаточно, чтобы заставить его снова работать.

В моем случае ошибка была результатом того, что я не назначил свое возвращаемое значение переменной. Следующее вызвало сообщение об ошибке:

return new JavaScriptSerializer().Serialize("hello");

Я изменил его на:

string H = "hello";
return new JavaScriptSerializer().Serialize(H);

Без переменной JSON не удается правильно форматировать данные.

Это может быть старым. Но это происходило только под углом, в моем коде были разные типы контента для запроса и ответа. Итак, проверьте заголовки для,

 let headers = new Headers({
        'Content-Type': 'application/json',
        **Accept**: 'application/json'
    });

в реакции реагирует

axios({
  method:'get',
  url:'http://  ',
 headers: {
         'Content-Type': 'application/json',
        Accept: 'application/json'
    },
  responseType:'json'
})

JQuery Ajax:

 $.ajax({
      url: this.props.url,
      dataType: 'json',
**headers: { 
          'Content-Type': 'application/json',
        Accept: 'application/json'
    },**
      cache: false,
      success: function (data) {
        this.setState({ data: data });
      }.bind(this),
      error: function (xhr, status, err) {
        console.error(this.props.url, status, err.toString());
      }.bind(this)
    });
  },

Эта ошибка возникает, когда вы определяете ответ как application/json, и вы получаете HTML в качестве ответа. В основном это произошло, когда вы пишете серверную часть script для определенного URL-адреса с ответом JSON, но формат ошибки находится в HTML.

В моем случае для сайта Angular 2/4, размещенного в Azure, мой API-вызов mySite/api/... был перенаправлен из-за проблем с маршрутизацией mySite. Итак, он возвращал HTML с перенаправленной страницы вместо API JSON. Я добавил исключение в файл web.config для пути API.

Я не получал эту ошибку при локальной разработке, потому что Сайт и API были на разных портах. Вероятно, есть лучший способ сделать это... но это сработало.

<?xml version="1.0" encoding="UTF-8"?>

<configuration>
    <system.webServer>
        <rewrite>
        <rules>
        <clear />

        <!-- ignore static files -->
        <rule name="AngularJS Conditions" stopProcessing="true">
        <match url="(app/.*|css/.*|fonts/.*|assets/.*|images/.*|js/.*|api/.*)" />
        <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
        <action type="None" />
        </rule>

        <!--remaining all other url point to index.html file -->
        <rule name="AngularJS Wildcard" enabled="true">
        <match url="(.*)" />
        <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
        <action type="Rewrite" url="index.html" />
        </rule>

        </rules>
        </rewrite>
    </system.webServer>
</configuration>

Моя проблема заключалась в том, что я возвращал данные в string, который не был в правильном формате JSON, и я тогда пытался его разобрать. simple example: JSON.parse('{hello there}') даст ошибку при h. В моем случае URL-адрес обратного вызова возвращал ненужный символ перед объектами: employee_names([{"name":.... и получал ошибку при e в 0. Мой URL-адрес обратного вызова имел проблему, которая при исправлении возвращала только объекты.

У меня было такое же сообщение об ошибке после учебника. Наш вопрос, похоже, "url: this.props.url" в вызове ajax. В React.DOM, когда вы создаете свой элемент, мой выглядит следующим образом.

ReactDOM.render(
    <CommentBox data="/api/comments" pollInterval={2000}/>,
    document.getElementById('content')
);

Ну, этот комментарийBox не имеет URL-адреса в своих реквизитах, просто данные. Когда я переключил url: this.props.url → url: this.props.data, он сделал правильный вызов на сервере, и я вернул ожидаемые данные.

Надеюсь, это поможет.

У меня была такая же проблема. Я использую простой сервер node.js для отправки ответа клиенту, выполненному в Angular 7. Изначально я отправлял response.end("Hello world from nodejs server"); клиенту, но каким-то угловатым не удалось разобрать его.

Это может быть вызвано тем, что ваш javascript-код просматривает какой-то ответ json, и вы получили что-то еще, например текст.

Для некоторых это может помочь вам, ребята: у меня был похожий опыт работы с Wordpress REST API. Я даже использовал Почтальон, чтобы проверить, были ли у меня правильные маршруты или конечная точка. Позже я узнал, что случайно вставил "эхо" в свой скрипт - хуки:

Отладка и проверка вашей консоли

Причина ошибки

Таким образом, в основном это означает, что я напечатал значение, не являющееся JSON, которое смешано со сценарием, вызывающим ошибку AJAX - "SyntaxError: Неожиданный токен r в JSON в позиции 0"

В python вы можете использовать json.Dump(str) перед отправкой результата в html-шаблон. с помощью этой командной строки преобразовать в правильный формат JSON и отправить в HTML-шаблон. После отправки этого результата в JSON.parse (результат) это правильный ответ, и вы можете использовать его.

просто что-то базовое для проверки, убедитесь, что в json файле нет комментариев.

//comments here will not be parsed and throw error

Для меня это произошло, когда одно из свойств объекта, которое я возвращал как JSON, выбрасывало исключение.

public Dictionary<string, int> Clients { get; set; }
public int CRCount
{
    get
    {
        var count = 0;
        //throws when Clients is null
        foreach (var c in Clients) {
            count += c.Value;
        }
        return count;
    }
}

Добавление нулевой проверки, исправил ее для меня:

public Dictionary<string, int> Clients { get; set; }
public int CRCount
{
    get
    {
        var count = 0;
        if (Clients != null) {
            foreach (var c in Clients) {
                count += c.Value;
            }
        }
        return count;
    }
}

На общем уровне эта ошибка возникает при анализе объекта JSON с синтаксическими ошибками. Вспомните что-то вроде этого, где свойство message содержит неэксклюзивные двойные кавычки:

{
    "data": [{
        "code": "1",
        "message": "This message has "unescaped" quotes, which is a JSON syntax error."
    }]
}

Если у вас есть JSON в вашем приложении где-нибудь, тогда полезно запустить его через JSONLint, чтобы убедиться, что он не имеет ошибка синтаксиса. Обычно это не так, хотя, по моему опыту, обычно JSON возвращался из API, который был виновником.

Когда запрос XHR передается HTTP-API, который возвращает ответ с заголовком Content-Type:application/json; charset=UTF-8, который содержит недопустимый JSON в теле ответа, вы увидите эту ошибку.

Если серверный контроллер API неправильно обрабатывает синтаксическую ошибку и распечатывается как часть ответа, это разрушит структуру возвращаемого JSON. Хорошим примером этого может быть ответ API, содержащий предупреждение или уведомление PHP в теле ответа:

<b>Notice</b>:  Undefined variable: something in <b>/path/to/some-api-controller.php</b> on line <b>99</b><br />
{
    "success": false,
    "data": [{ ... }]
}

В 95% случаев это является источником проблемы для меня, и хотя это несколько описано здесь в других ответах, я не чувствовал, что это было четко описано. Надеюсь, это поможет, если вы ищете удобный способ отследить, какой ответ API содержит синтаксическую ошибку JSON, я написал модуль Angular для что.

Здесь модуль:

/**
 * Track Incomplete XHR Requests
 * 
 * Extend httpInterceptor to track XHR completions and keep a queue 
 * of our HTTP requests in order to find if any are incomplete or 
 * never finish, usually this is the source  of the issue if it 
 * XHR related
 */
angular.module( "xhrErrorTracking", [
        'ng',
        'ngResource'
    ] )
    .factory( 'xhrErrorTracking', [ '$q', function( $q ) {
        var currentResponse = false;

        return {
            response: function( response ) {
                currentResponse = response;
                return response || $q.when( response );
            },
            responseError: function( rejection ) {
                var requestDesc = currentResponse.config.method + ' ' + currentResponse.config.url;
                if ( currentResponse.config.params ) requestDesc += ' ' + JSON.stringify( currentResponse.config.params );

                console.warn( 'JSON Errors Found in XHR Response: ' + requestDesc, currentResponse );

                return $q.reject( rejection );
            }
        };
    } ] )
    .config( [ '$httpProvider', function( $httpProvider ) {
        $httpProvider.interceptors.push( 'xhrErrorTracking' );
    } ] );

Более подробную информацию можно найти в статье в блоге, приведенной выше, я не размещал там все, что здесь, возможно, не все релевантно.

Чтобы добавить ответы, это также происходит, когда ваш ответ API включает

<?php{username: 'Some'}

который может быть случайным, когда ваш сервер использует PHP.

Protip: тестирование json на локальном сервере Node.js? Убедитесь, что у вас еще нет маршрутизации на этот путь.

'/:url(app|assets|stuff|etc)';

Проведя много времени с этим, я узнал, что в моем случае проблема заключалась в том, что в моем файле package.json была указана "домашняя страница", и мое приложение не работало на firebase (то же самое "токен" ). Я создал свое приложение для реагирования, используя приложение create-react-app, затем я использовал руководство firebase в файле READ.me для развертывания на страницах github, понял, что мне пришлось выполнять дополнительную работу для работы маршрутизатора и переключиться на firebase. Руководство github добавило ключ на странице package.json и вызвало проблему развертывания.

Неожиданный токен < в JSON в позиции 0

Простым решением этой ошибки является запись комментария в файл styles.less.