>

Foxfire 웹 확장을 작성하려고합니다. 탭의 URL을 반환하는 함수를 원합니다.

파이어 폭스 탭 browser.tabs.get(id)  URL이있는 멤버가있는 탭 오브젝트로 해석되는 약속을 리턴합니다. 와이즈 비즈  탭의 ID를 포함하는 탭 배열로 해석되는 약속을 반환합니다.

계획은 tab.url로 해석되는 약속으로 위의 두 호출을 래핑합니다. async/await를 사용하여 결과가 해결 될 때까지 기다립니다.

MDN 설명서에 따르면 :

와이즈 비즈

매니페스트 파일에는 탭 권한이 있습니다.

내 코드는 아래와 같습니다 :

browser.tabs.query

표시된 바와 같이 console.dir 및 console.log 문은 주석 처리됩니다. 코드를 디버깅하고 명령 줄을 사용하여 테스트 기능을 실행합니다. 테스트 기능에서 기다림이 약속이 해결 될 때까지 기다렸다가 값을 반환하도록 생각합니다.

그렇습니다. console.log 및 console.dir 문의 주석을 해제하면 명령 줄에서 테스트를 실행하면 예상 된 (url) 결과가 나타납니다. 콘솔에는 log/dir 문의 결과가 표시되며 명령 행에서 실행하면 최종 결과는 탭의 URL입니다 (test2의 console.dir에서 tab.id를 얻을 수 있음).

console.dir 문을 주석 처리하면 로그에 "Promise {:"pending "}"다음에 새 줄에 원하는 결과 (URL)가 나오는 줄이 나타납니다.

console.log 문을 주석 처리하면 "Promise {:"pending "}"줄만 나타납니다. 원하는 URL을 얻지 못했습니다.

누구라도 이것을 시도하려면 매니페스트 파일이 다음과 같습니다 :

"The await expression causes async function execution to pause until a Promise is fulfilled, that is resolved or rejected, and to resume execution of the async function after fulfillment. When resumed, the value of the await expression is that of the fulfilled Promise."

browser.browserAction.onClicked.addListener(test); async function test(){ let res = await GetActiveTabURL(); //console.log(`test ${res}`); return res; } async function test2(TabID){ let res = await GetTabURL(TabID); //console.log(`test2 ${res}`); return res; } function GetActiveTabURL() { return new Promise((resolve, reject) => { browser.tabs.query({currentWindow: true, active: true}) .then((tabs) => { browser.tabs.get(tabs.pop().id) .then((tab) => { //console.dir(tab); resolve(tab.url) }) }) }) } function GetTabURL(TabID) { return new Promise((resolve, reject) => { browser.tabs.get(TabID) .then((tab) => { //console.dir(tab); resolve(tab.url) }) }) }

  • 답변 # 1

    비동기 함수가 약속을 반환해야한다는 문서에서 발견되었습니다. 모든 반환 진술. 약속을 포함하지 않은 return 문의 값은 위와 같이 무시됩니다. 분명히 함수의 마지막 약속이 반환됩니다.

    알 수 있듯이 약속을 기다리는 함수는 해당 약속의 값을 반환 할 수 없습니다.

    let xx = await promise의 값, xx는 await 문 다음에 동일한 함수에서 사용할 수 있으며 여기서 사용할 수 있습니다. 따라서 비동기 적으로 값을 반환하기 위해 함수를 호출하는 대신 호출 함수를 비동기로 만들고 원하는 값에 도달하기 위해 필요에 따라 일련의 대기를 사용해야합니다.

  • 답변 # 2

    이를 시도하십시오. async/await를 사용할 환경이 있다면 .then ()을 과도하게 사용하는 것이 좋습니다.

    browser.browserAction.onClicked.addListener(test);
    async function test() {
        let res = await GetActiveTabURL();
        return res;
    }
    async function test2(TabID) {
        let res = await GetTabURL(TabID);
        return res;
    }
    async function GetActiveTabURL() {
        const tabs = await browser.tabs.query({
            currentWindow: true,
            active: true
        });
        const tab = browser.tabs.get(tabs.pop().id);
        return tab.url;
    }
    async function GetTabURL() {
        const tab = await browser.tabs.get(TabID);
        return tab.url;
    }
    
    

관련 자료

  • 이전 c - 연결된 목록을 쌍으로 바꾸는 방법
  • 다음 javascript - Angular의 JSON 파이프는 "정의되지 않은"값에 대해 빈 문자열을 인쇄합니다