2014-09-23 348 views
2

我正在嘗試製作應用以對YouTube視頻進行基本搜索。我使用的是YouTube數據API,我去了谷歌開發者的控制檯,併爲我的域名創建了一個客戶端ID。Google API客戶端ID未授權

我下載了Google在其示例代碼部分中的auth.js和search.js,並將我的客戶端ID放入其'客戶端ID'的位置,但應用程序無法正常工作。我使用了console.log,似乎我沒有越過函數checkAuth。

我錯過了什麼?這裏是一個鏈接到頁面:http://www.vidme.cassandraburnscreative.com/#search

這裏是auth.js和search.js一起

var OAUTH2_CLIENT_ID = 'my client ID'; 
var OAUTH2_SCOPES = [ 
    'https://www.googleapis.com/auth/youtube' 
]; 


googleApiClientReady = function() { 
    console.log("googleApiClientReady"); 
    gapi.auth.init(function() { 
    window.setTimeout(checkAuth, 1); 
    console.log("gapi.auth.init"); 
    }); 
} 


function checkAuth() { 
    gapi.auth.authorize({ 
    client_id: OAUTH2_CLIENT_ID, 
    scope: OAUTH2_SCOPES, 
    immediate: true 
    }, handleAuthResult); 
    console.log("checkAuth"); 
} 


function handleAuthResult(authResult) { 
    if (authResult && !authResult.error) { 
    // Authorization was successful. Hide authorization prompts and show 
    // content that should be visible after authorization succeeds. 
    $('.pre-auth').hide(); 
    $('.post-auth').show(); 
    loadAPIClientInterfaces(); 
    console.log("Load Interfaces"); 
    } else { 

    $('#login-link').click(function() { 
     console.log("nope"); 
     gapi.auth.authorize({ 
     client_id: OAUTH2_CLIENT_ID, 
     scope: OAUTH2_SCOPES, 
     immediate: false 
     }, handleAuthResult); 
     console.log("HandleAuthResult"); 
    }); 
    } 
} 

function loadAPIClientInterfaces() { 
    gapi.client.load('youtube', 'v3', function() { 
    handleAPILoaded(); 
    console.log("handleAPILoaded"); 
    }); 
} 

function handleAPILoaded() { 
    $('#search-button').attr('disabled', false); 
} 

function search() { 
    var q = $('#query').val(); 
    var request = gapi.client.youtube.search.list({ 
    q: q, 
    part: 'snippet' 
    }); 

    request.execute(function(response) { 
    var str = JSON.stringify(response.result); 
    $('#search-container').html('<pre>' + str + '</pre>'); 
    }); 
} 

和HTML

<div class="wrapper"> 

<div id="buttons"> 
<p>Search For an Artist:</p> 
     <label> <input id="query" placeholder='+ Add Artist' type="text"/> 
     <button id="search-button" disabled onclick="search()">Search</button> 
     </label> 
</div> 
    <div id="search-container"> 
    </div> 
</div> 

回答

1

你並不需要連接或使用Oauth2使用YouTube API搜索某些內容。 您只需要一個api key

樣本例如:

function googleApiClientReady() { 
    var apiKey = 'YOUR_API_KEY'; 

    gapi.client.setApiKey(apiKey); 
    gapi.client.load('youtube', 'v3', function() { 
     isLoad = true; 
    }); 

    request = gapi.client.youtube.search.list({ 
     q: q, 
     part: 'snippet' 
    }); 
    request.execute(function(response) { 
     //your code to here 
    }); 
} 

不要忘了這個文件添加到您的index.html和添加此以下行的後面:

<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script> 

從DOC YouTube API

+0

謝謝這正是我所需要的。我找不到任何地方使用API​​密鑰的方法,所以我試圖使用客戶端ID。 – Cassandra 2014-09-24 01:17:48

相關問題