Document Server version:8.2
Hi support team, I would like to know how to return data in callCommand with async function. I tried to do that but the result i got is an empty object instead of an object with data:3 as expected.
Here is my code example:
window.Asc.plugin.callCommand(
async () => {
const result = 3;
console.log(result);
return { data: result };
},
(result: any) => {
console.log(result);
}
);
Hello @ZangHoang
It really depends on where you’d like to get callback. You see, async functions return promise object instead of a string or number, hence you can only get callback inside the async function, i.e. you cannot pass it to the callCommand callback.
To demonstrate I’ve got this example:
window.Asc.plugin.callCommand(function () {
const asyncFn = async () => {
const res = 3;
console.log("Console Log: ", res + 1 ); // Here I've added 1 to demonstrate the it returns res separately
return res;
}
asyncFn().then(res => {
console.log("Returned: ", res + 2) ; // Added 2 to the res to demonstrate the result being separate from previous one
});
});
First, I’ve declared async function, i.e. not calling anonymous async function like in your example.
Then I am reusing result that it returns by calling the asyncFn function again with .then operator. That way function passes first result to the second “round” of execution.
Since callCommand does not naturally return callback value and onCommandCallback must be used for that, you might try getting callback that way. However, callCommand works only with strings and numbers, it cannot operate with objects. Since async function returns promise, which is an object, you cannot pass it outside the callCommand method.
Usage of async functions purely depends on the goal you are trying to achieve. In general, you can use them, but I don’t see the reason to use it inside callCommand.
Hi!
I tried exactly you function above and I am receiving the following error:
ReferenceError: __async is not defined
Has something changed with the new version? (I am running 8.3.2) Or do I need to do something different now?
Thanks!
Hello @dorin
The code above works as expected, nothing has changed. Can you share content of your .js file that executes it for reference?
NB: For the plugin to work the developer must specify two obligatory events for the window.Asc.plugin object: window.Asc.plugin.init and window.Asc.plugin.button. After that the window.Asc.plugin.callCommand method is used to send the data to the editors using the in-built ONLYOFFICE Document Builder API features.
More about it you can find here: Overview | ONLYOFFICE
Hi,
Sure, this is my code. The plugin is written in Angular (with Typescript) and this is running in the main component (app.component.ts).
((window: Window
) => {
window.Asc.plugin.init = function init() {
Asc.plugin.callCommand(() => {
const asyncFn = async () => {
const res = 3;
console.warn('Console Log: ', res + 1 ); // Here I've added 1 to demonstrate the it returns res separately
return res;
}
asyncFn().then(res => {
console.warn('Returned: ', res + 2) ; // Added 2 to the res to demonstrate the result being separate from previous one
});
}, false, false);
}
window.Asc.plugin.button = (id: string) => {}
})(window);
I’m quite confused, frankly. Please refer to this guide to find out how to create plugins:
It is not quite clear to me why would you write it in Typescript and how you are running it. There is a strict structure for plugins, you should follow this structure when developing a plugin.
Thanks for the Hello World link, but we are way past that.
Our plugin is developed in Angular and we can only write it in Typescript. We’ve already done it and it’s interacting with the Document Editor (although I admit some typings would be great to know what methods are available for each object and what each function returns).
What I am trying to do right now is to highlight parts of the text sequentially (wait for a text to be highlighted before moving to the next), otherwise I think it get overloaded by a simple for…of and it runs into this weird error that it cannot find whatever function (giberish is written in the console because all OO code is minified). For this I need to create an async function in which I am waiting for a promise to finish.
I got to this thread trying to do just that and I wanted to run your example first and realised it doesn’t work - at least for me, using Angular (after trying myself an anonymous function, only to read here that it’s not possible).
I did not say that it is impossible, I just do not understand why you are writing in Typescript. I am not familiar with it, so I cannot help you debugging it.
Technically, Document Server interacts with a plugin and there should be no issue developing it in JS. Are you integrating Document Server with Angular component?