AJAX не анализирует ответ JSONP - PullRequest
0 голосов
/ 25 января 2019

Работая над созданием страницы фида фильмов, к сожалению, единственный API, который мне удалось найти, имеет ограничение в 50 вызовов / день, поэтому мне нужно кэшировать ответ jsonp локально и напрямую анализировать его, чтобы обойти ограничение вызовов и просто обновить расписание сеансов в указанное время.

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

Вот скрипт, который у меня сейчас есть, который должен анализировать кэшированный файл jsonp

<script>
// construct the url with parameter values, do not need API keying information, this data is cached and requested once a day by the server
     var baseUrl = "https://example.com";
     var showtimesUrl = baseUrl + '/movie-data/gracenote-sample.jsonp';

     $(document).ready(function() {

       // send off the query
       $.ajax({
           url: showtimesUrl,
           data: {jsonp: "dataHandler",},           
           dataType: "jsonp",
           success: function( data ) {
               console.log( data ); // server response
           }
       }
       );
     });

     // callback to handle the results
     function dataHandler(data) {
      $(document.body).append('<p>Found ' + data.length + ' movies showing within 2 miles of Hacienda Crossings:</p>');
      var movies = data.hits;
      $.each(data, function(index, movie) {
        var movieData = '<div class="MovieListingWrapper"><img class="movie-poster" src="http://movies.tmsimg.com/' + movie.preferredImage.uri + '?api_key='+apikey+'"><h2 class="MovieTitle">'+movie.title+'</h2>';
        movieData += movie.title;
        if (movie.ratings) { movieData += ' (' + movie.ratings[0].code + ') </div>' };
        $(document.body).append(movieData);
      });
     }  

Ответ отправляет обратно стандартный файл jsonp и точно соответствует ответу, который я получаю от API. Ниже приведен скрипт, который я использую для запроса текущих данных, а не кэшированных.

<script>
// construct the url with parameter values
     var apikey = "nope.avi";
     var baseUrl = "http://data.tmsapi.com/v1.1";
     var showtimesUrl = baseUrl + '/movies/showings';
     var zipCode = "12345";
     var radius = "2";
     var imageSize = "Md";
     var imageText = "true";
     var d = new Date();
     var today = d.getFullYear() + '-' + (d.getMonth()+1) + '-' + d.getDate();


     $(document).ready(function() {

       // send off the query
       $.ajax({
        url: showtimesUrl,
            data: { startDate: today,
                zip: zipCode,
              radius: radius,
                api_key: apikey,
              jsonp: "dataHandler",
               },
        dataType: "jsonp",
       });
     });

     // callback to handle the results
     function dataHandler(data) {
      $(document.body).append('<p>Found ' + data.length + ' movies showing within 2 miles of ' + zipCode+':</p>');
      var movies = data.hits;
      $.each(data, function(index, movie) {
        var movieData = '<div class="MovieListingWrapper"><img class="movie-poster" src="http://movies.tmsimg.com/' + movie.preferredImage.uri + '?api_key='+apikey+'"><h2 class="MovieTitle">'+movie.title+'</h2>';
        movieData += movie.title;
        if (movie.ratings) { movieData += ' (' + movie.ratings[0].code + ') </div>' };
        $(document.body).append(movieData);
      });
     }  

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

Я бы опубликовал здесь ответ jsonp, но это огромный ответ. Если хотите, я с удовольствием напишу прямой файл.

1 Ответ

0 голосов
/ 25 января 2019

Я обнаружил, что оригинальный скрипт для копирования ответа json из API неправильно регистрирует функцию обратного вызова. Мне просто нужно было обернуть его функцией dataHandler.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...