Thanks. I saw your PM, it does not contain any sensitive information, so I am providing information here.
Question is related to the data that must be provided for onRequestReferenceData event. Event itself handles following parameters as in example:
const link = event.data.link // Link to the source file
const referenceData = event.data.referenceData // reference data for the file
const path = event.data.path // A name to be displayed for external links
For the setReferenceData method of the editor you are basically providing static data that corresponds to the data of the event. The description of each parameter of the method is available in API. Going more into it, fileKey (it is not equal to the document.key parameter) and instanceId are unique identifiers for the file and the storage, i.e. you must specify a key that Document Server will use to identify the source file for external access and the link to the storage, where file is brought from, to identify them and allow external data referencing.
As an example, I can share a basic implementation of all that in code below.
Firstly, I must define onRequestReferenceData event of the editor that relies on using setReferenceData method to provide editor data of the document and identify it as per documentation:
function onRequestReferenceData(event) {
// Below I am setting static data for the event itself as an example
const link = event.data.link = "https://example.com/link-to-source-file/spreadsheet.xlsx";
const referenceData = event.data.referenceData = {
fileKey: "somekey",
instanceId: "https://example.com/",
};
const path = event.data.path = "import.xlsx";
docEditor.setReferenceData({
fileType: "xlsx",
key: "Khirz6zTPdfd7", // Unique document key that differs from the initially opened file to identify file in cache and bring data from
path: "import.xlsx", // Short name of a file for using external data
referenceData: { // Identifiers of file and storage for granting external access
fileKey: "somekey", // Unique key
instanceId: "https://example.com/", // Link to the storage, from which file is taken
},
url: "https://example.com/link-to-source-file/spreadsheet.xlsx", // Link to the source file itself
});
console.log("onRequestReferenceData fired"); // Just some debugging
}
You can already note that the data for event and data specified in the
setReferenceDatamethod correspond to each other. It is demonstrated as a static data, you must handle it properly according to the logic of your integration.
Once event is defined, I must specify it in the initialization config of the editor:
var docEditor = new DocsAPI.DocEditor("placeholder", {
document: {
fileType: "xlsx",
key: "F89d8069ba2b", // Key for original document
referenceData: {
fileKey: "somekey",
instanceId: "https://example.com/", // Same instanceId as before for re-using identification
},
url: "https://example.com/link-to-original-file/original.xlsx", // Link to the original file, not the source one
},
events: {
onRequestReferenceData,
},
});
This is a minified and simplified version of the initialization config. This all done as a plain HTML, correct to your needs.
Once the editor is started, I go to Formula > Function > IMPORTRANGE to define URL as event.data.link, i.e. "https://example.com/link-to-source-file/spreadsheet.xlsx", then choose the range and hit OK. The formula will be inserted and data is imported.
This is just an example of how this could be done in practice with some additional details. Pretty much everything important is described in the documentation. As an integrator, the way to automate whole process depends on you.
By the way, this also allows using external links to the referenced document in a format ='[import.xlsx]Sheet1'!A1 - import.xlsx corresponds to the short name defined as event.data.path for the event. Both links will be displayed in Data > External Links menu.