ネストされた関数から現在のURLを返す - Chrome拡張機能

Question

現在選択されているタブのURLを取得するChrome拡張機能を作成しようとしていますが、URLを変更できないという問題が発生していますに戻って格納されます。

私はすでにいくつかのことを試してみたが、これは私が動作するように期待していたコードです：

function getStream() { 
    alert(getLinking()); 
} 

function getLinking() { 
    chrome.tabs.query({ 
      'active': true, 
      'windowId': chrome.windows.WINDOW_ID_CURRENT 
     }, 
     function getURL(tabs) { 
      var URL = tabs[0].url; 
      return URL; 
     } 
    ); 
    return getURL(); 
} 

document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('start').addEventListener('click', getStream); 
}); 

警告が表示されませんので、それは実際には何も返しませんが。変数URLを返すことが非常に重要であることに注意してください。getStream関数でアラートを追加するだけで、getStream関数に戻すことができます。

私が驚くほど助けてくれる人がいれば、私はまだjavascriptに慣れていないし、特にクロムの拡張には慣れていないので、アドバイスがすべて役に立ちます。

Answer 1

メソッドchrome.tabs.queryは非同期なので、結果を返すためにコールバックが必要です。あなたは非同期呼び出しで作業しているとき、あなたはどんなで結果を処理することができます

：

• コールバック
• 約束
• は非同期/

を待って、この質問を確認してください：How do I return the response from an asynchronous call?

を

コードによれば、最も簡単な解決策は次のとおりです。

function getStream() { 
    getLinking(function(URL) { // passing a callback 
     alert(URL) 
    }); 
} 

function getLinking(callback) { // callback - is a function that will be called when async call finished 
    chrome.tabs.query({ 
      'active': true, 
      'windowId': chrome.windows.WINDOW_ID_CURRENT 
     },function(tabs) { 
      callback(tabs[0].url); // run callback with a result 
     } 
    ); 
    // do not need to return anything 
} 

document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('start').addEventListener('click', getStream); 
});