语义UI搜索不会从服务器响应中读取JSON

时间:2017-02-06 20:24:58

标签: javascript php json semantic-ui

我目前在项目中使用Semantic-UI。我使用搜索模块从输入中获取结果。这是我的JavaScript代码:

$('.ui.search')
  .search({
    apiSettings: {
      action: 'search',
      url: 'process.php?q={query}',
      onSuccess(response, element, xhr){
        console.log(response);
      }
    },
    fields: {
      results: 'songs',     // array of results (standard)
      title: 'title',      // result title
      url: 'videoID'
    },
    showNoResults: true,
    onResults(response) {
        console.log(response);
    }
  })
;

我从process.php获得了JSON响应。这是:

<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);

header("Content-Type: application/json; charset=UTF-8");
if (!file_exists(__DIR__ . '/vendor/autoload.php')) {
  throw new \Exception('please run "composer require google/apiclient:~2.0" in "' . __DIR__ .'"');
}
require_once __DIR__ . '/vendor/autoload.php';
// This code will execute if the user entered a search query in the form
// and submitted the form. Otherwise, the page displays the form above.
$videos = array();
// $videos["action"]["url"] = "youtube.com"; 
if (isset($_GET['q'])) {
  /*
   * Set $DEVELOPER_KEY to the "API key" value from the "Access" tab of the
   * {{ Google Cloud Console }} <{{ https://cloud.google.com/console }}>
   * Please ensure that you have enabled the YouTube Data API for your project.
   */

  $DEVELOPER_KEY = 'MY_API_KEY';
  $client = new Google_Client();
  $client->setDeveloperKey($DEVELOPER_KEY);

  // Define an object that will be used to make all API requests.
  $youtube = new Google_Service_YouTube($client);
  try {

    // Call the search.list method to retrieve results matching the specified
    // query term.
    $searchResponse = $youtube->search->listSearch('id,snippet', array(
      'q' => $_GET['q'],
      'maxResults' => 2
    ));
    // Add each result to the appropriate list, and then display the lists of
    // matching videos, channels, and playlists.

    foreach ($searchResponse['items'] as $searchResult) {
      switch ($searchResult['id']['kind']) {
        case 'youtube#video':
                $videos["songs"][] = array('title' => $searchResult['snippet']['title'], 'videoID' => $searchResult["id"]["videoId"]);
          break;
      }
    }
  } catch (Google_Service_Exception $e) {
      die($e->getMessage());
  }
}

echo json_encode($videos);

问题是,一旦我开始输入搜索输入,即使我的JSON结构有效,也不会显示任何内容。我已正确分配语义UI属性。我遵循Semantic UI建议的标准JSON响应。这是我的JSON回复

  {  
   "songs":[  
      {  
         "title":"Wiz Khalifa - See You Again ft. Charlie Puth [Official Video] Furious 7 Soundtrack",
         "videoID":"RgKAFK5djSk"
      },
      {  
         "title":"Wiz Khalifa - See You Again ft. Charlie Puth (MattyBRaps ft Carissa Adee Cover)",
         "videoID":"Rpm8ZJuGEu4"
      }
   ]
}

我已经尝试了一切。它不起作用。我非常感谢你的帮助

0 个答案:

没有答案