@chili-publish/publisher-interface
Advanced tools
PublisherInterface is a class object that allows you to interact with the CHILI Publisher editorObject via postMessage without the complexity of postMessage.
The Publisher Interface was designed to make integrating into CHILI publish Online easy.
As a happy side effect, the setter for document.domain, which many integrations rely on, will become immutable at the beginning of January 2023. This means that the Publisher Interface will be the only supported way to communicate with Publisher via an <iframe>.
All the magic happens with PublisherInterface PublisherInterface is a class object that allows you to interact with the CHILI Editor editorObject via postMessage without the complexity of postMessage.
This project is officially supported by CHILI publish.
Notes:
You can find complete documentation on the wiki
editorObject can no longer be used when communicating with an <iframe>.PublisherInterface and editorObject.editorObject to Publisher Interface.PublisherInterface class and associated types. Even though it is auto-generated, the comments therein were written with insight.You can install PublisherInterface via npm
npm i @chili-publish/publisher-interface
or through yarn
yarn add @chili-publish/publisher-interface
You can also use it directly in the browser via unpkg.
import {PublisherInterface} from "https://unpkg.com/@chili-publish/publisher-interface@latest/dist/PublisherInterface.min.js";
The Publisher Interface has 1 dependency which is the Penpal library.
All other dependencies are only for the developer tools such as auto generating docs, testing, and packaging.
This means that their is very little security concerns, and the limitations are the same as those found in Penpal
Publisher Interface runs successfully on the most recent versions of Chrome, Firefox, Safari, and Edge. Internet Explorer is not supported.
The easiest way to get started is to pull the package from unpkg.
import {PublisherInterface} from "https://unpkg.com/@chili-publish/publisher-interface@latest/dist/PublisherInterface.min.js";
If you downloaded via NPM you can import it with
import {PublisherInterface} from "@chili-publish/publisher-interface";
Then in your JavaScript code, get the iframe which is loading the Publisher editor, and pass that iframe element into the build() function of PublisherInterface.
const iframe = document.getElementById("editor-iframe");
const publisher = PublisherInterface.build(iframe).then(
PublisherInterface => PublisherInterface.alert("Hi!")
);
šØ Important - make sure that you call build() before the iframe onload event is fired. In practice this means that you should never call build() when that event is fired.
In simple use cases, the below example will work well.
<body>
<iframe id="editor-iframe" style="width:1200px; height:800px"
src="https://example.chili-publish.online/example/editor_html.aspx?doc=3d178228-a9b9-49d0-90d9-c1c8f8b67f05&apiKey=Sczs1ruhiZcaFiqg0G07gMFMq07X+SG2o8KlW8oAeZGqoB1a0YkbeZU1wJK15aIhANgZmhg+13NQlxpBEq7Q=="></iframe>
<script type="module">
import {PublisherInterface} from 'https://unpkg.com/@chili-publish/publisher-interface@latest/dist/PublisherInterface.min.js';
const iframe = document.getElementById("editor-iframe");
(async () => {
const publisher = await PublisherInterface.build(iframe);
const documentName = await publisher.getObject("document.name");
console.log(documentName);
})();
</script>
</body>
iframe element and set its src attribute.iframe element to the build method of PublisherInterface and capture the promise returned from the method.iframe element to the DOM.Example Code:
<body>
<script type="module">
import {PublisherInterface} from 'https://unpkg.com/@chili-publish/publisher-interface@latest/dist/PublisherInterface.min.js';
document.addEventListener("DOMContentLoaded", async () => {
(async () => {
const iframe = document.createElement("iframe");
iframe.src = "https://example.chili-publish.online/example/editor_html.aspx?doc=3d178228-a9b9-49d0-90d9-c1c8f8b67f05&apiKey=Sczs1ruhiZcaFiqg0G07gMFMq07X+SG2o8KlW8oAeZGqoB1a0YkbeZU1wJK15aIhANgZmhg+13NQlxpBEq7Q==";
const publisherPromise = PublisherInterface.build(iframe);
document.body.appendChild(iframe);
const publisher = await publisherPromise;
const documentName = await publisher.getObject("document.name");
console.log(documentName);
})();
});
</script>
</body>
To enable debugging for the underlying library, pass {penpalDebug: true} as the buildOptions in your build function.
PublisherInterface.build(iframe, {penpalDebug: true});
This will display messages in the console from Penpal about the communication between the iframe and the main page.
If there's a possibility of a failure to connect, you can set a timeout. If the connection is not established before the timeout, an exception will be thrown. In the example below, the build method will throw a timeout after 10 seconds if no connection is established.
PublisherInterface.build(iframe, {penpalDebug: true, timeout: 10000});
To read more, check out our documentation.
FAQs
PublisherInterface is a class object that allows you to interact with the CHILI Publisher editorObject via postMessage without the complexity of postMessage.
The npm package @chili-publish/publisher-interface receives a total of 414 weekly downloads. As such, @chili-publish/publisher-interface popularity was classified as not popular.
We found that @chili-publish/publisher-interface demonstrated a not healthy version release cadence and project activity because the last version was released a year ago.Ā It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
TypeScript Native Previews offers a 10x faster Go-based compiler, now available on npm for public testing with early editor and language support.
Research
Security News
Malicious npm packages targeting React, Vue, Vite, Node.js, and Quill remained undetected for two years while deploying destructive payloads.
Security News
Open source maintainers are urging GitHub to let them block Copilot from submitting AI-generated issues and pull requests to their repositories.