확장 등록
index.html
경로에 매핑된 ExtensionRegistration.js
은(는) AEM 확장의 진입점이며 다음을 정의합니다.
getBadges()
에서 구성 특성id
,prefix
,suffix
,backgroundColor
및textColor
을(를) 사용하여 배지의 정의를 정의합니다.- 이 예에서는
#
문자를 사용하여 이 배지의 경계를 정의합니다. 즉,#
(으)로 둘러싸인 RTE의 모든 문자열이 이 배지의 인스턴스로 처리됩니다.
또한 RTE 위젯의 주요 세부 사항을 참조하십시오.
getWidgets()
의 위젯 정의가id
,label
및url
특성을 가진 함수입니다.url
특성 값, 모달을 로드할 상대 URL 경로(/index.html#/largeBookingsCustomerService
)입니다.
src/aem-cf-editor-1/web-src/src/components/ExtensionRegistration.js
import React from "react";
import { Text } from "@adobe/react-spectrum";
import { register } from "@adobe/uix-guest";
import { extensionId } from "./Constants";
// This function is called when the extension is registered with the host and runs in an iframe in the Content Fragment Editor browser window.
function ExtensionRegistration() {
const init = async () => {
const guestConnection = await register({
id: extensionId,
methods: {
rte: {
// RTE Badges
getBadges: () => [
{
id: "phoneNumber",
prefix: "#",
suffix: "#",
backgroundColor: "",
textColor: "#071DF8",
},
],
// RTE Widgets
getWidgets: () => [
{
id: "largegroup-contact-list-widget",
label: "Large Group Bookings Customer Service",
url: "/index.html#/largeBookingsCustomerService",
},
],
},
},
});
};
init().catch(console.error);
return <Text>IFrame for integration with Host (AEM)...</Text>;
}
export default ExtensionRegistration;