chrome 扩展 - 我如何等待 chrome.runtime 功能?
chrome extension - how i can await for chrome.runtime function?
我在后台的操作是访问网站并从那里获取信息,问题是代码在收到信息之前继续。
附件是显示问题的代码:
background.js :
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
fetch(request.input, request.init).then(function(response) {
return response.text().then(function(text) {
sendResponse([{
body: text,
status: response.status,
statusText: response.statusText,
}, null]);
});
}, function(error) {
sendResponse([null, error]);
});
return true;
});
actions.js : 编辑后
const validateWord = async word => {
const input = "https://milog.co.il/" + word;
await new Promise(resolve => {
chrome.runtime.sendMessage({ input }, messageResponse => {
const [response, error] = messageResponse;
const parser = new DOMParser();
const html = parser.parseFromString(response.body, 'text/html');
const element = html.querySelector('.sr_e_txt');
console.log("aaa")
resolve(element?.innerText !== '');
});
});
};
validateWord("word")
.then(data => console.log(data))
.catch(reason => console.log(reason.message))
它打印 aaa -> bbb -> word..
我想先打印“word”,然后“aaa”等待它完成。
谢谢。
您不能在 chrome
方法中同时使用回调并等待 returned 值,因为使用回调时该方法不会 return一个承诺。
bug in Chrome before 99: sendMessage 不是 return Promise,所以你不能等待它。
已修复 Chrome 99.
因此,在 Chrome 的早期版本中,您可以承诺 API:
promisifyApi(chrome.runtime, 'sendMessage');
(async () => {
const res = await chrome.runtime.sendMessage({ input });
console.log(res);
})();
function promisifyApi(thisArg, name) {
const fn = thisArg[name];
const localStack = new Error('Before calling ' + name);
thisArg[name] = (...args) => new Promise((resolve, reject) => {
fn(...args, result => {
let err = chrome.runtime.lastError;
if (err) {
err = new Error(err.message);
err.stack += '\n' + localStack.stack;
reject(err);
} else {
resolve(result);
}
});
});
}
...或使用回调:
chrome.runtime.sendMessage({ input }, res => {
// process `res` here
});
我在后台的操作是访问网站并从那里获取信息,问题是代码在收到信息之前继续。 附件是显示问题的代码:
background.js :
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
fetch(request.input, request.init).then(function(response) {
return response.text().then(function(text) {
sendResponse([{
body: text,
status: response.status,
statusText: response.statusText,
}, null]);
});
}, function(error) {
sendResponse([null, error]);
});
return true;
});
actions.js : 编辑后
const validateWord = async word => {
const input = "https://milog.co.il/" + word;
await new Promise(resolve => {
chrome.runtime.sendMessage({ input }, messageResponse => {
const [response, error] = messageResponse;
const parser = new DOMParser();
const html = parser.parseFromString(response.body, 'text/html');
const element = html.querySelector('.sr_e_txt');
console.log("aaa")
resolve(element?.innerText !== '');
});
});
};
validateWord("word")
.then(data => console.log(data))
.catch(reason => console.log(reason.message))
它打印 aaa -> bbb -> word.. 我想先打印“word”,然后“aaa”等待它完成。
谢谢。
您不能在
chrome
方法中同时使用回调并等待 returned 值,因为使用回调时该方法不会 return一个承诺。bug in Chrome before 99: sendMessage 不是 return Promise,所以你不能等待它。
已修复 Chrome 99.
因此,在 Chrome 的早期版本中,您可以承诺 API:
promisifyApi(chrome.runtime, 'sendMessage');
(async () => {
const res = await chrome.runtime.sendMessage({ input });
console.log(res);
})();
function promisifyApi(thisArg, name) {
const fn = thisArg[name];
const localStack = new Error('Before calling ' + name);
thisArg[name] = (...args) => new Promise((resolve, reject) => {
fn(...args, result => {
let err = chrome.runtime.lastError;
if (err) {
err = new Error(err.message);
err.stack += '\n' + localStack.stack;
reject(err);
} else {
resolve(result);
}
});
});
}
...或使用回调:
chrome.runtime.sendMessage({ input }, res => {
// process `res` here
});