Как использовать страницу visualforce с Lightning: container React в конструкторе приложений Lightning? - PullRequest
Новая
       156

Как использовать страницу visualforce с Lightning: container React в конструкторе приложений Lightning?

0 голосов
/ 04 августа 2020

Я пытаюсь создать приложение React на странице visualforce с помощью молнии. Когда я нажимаю предварительный просмотр в настройках visualforce, все в порядке.

enter image description here

But when I use it in Lightning app builder it does not work. It shows enter image description here

The error: Refused to frame 'https://mirage-video-dev-ed--ltng.container.lightning.com/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors https://mirage-video-dev-ed--c.visualforce.com". Also really weird that if I right click and choose "Reload frame", it works.

enter image description here

Visualforce code


    
    
    
        $Lightning.use("c:myFirstApp", function() {
            $Lightning.createComponent("lightning:container",
              { src: "{!$Resource.hello + '/index.html'}"},
              "hello",
              function(cmp) {
                console.log("created");
                // do some stuff
              }
          );

        });

myFirstApp

Есть способ исправить? Я не могу найти способ загрузить приложение aura: напрямую, поэтому, если есть способ, покажите мне.

1 Ответ

0 голосов
/ 25 августа 2020

У вас есть небольшая начальная проблема ... Вам просто нужно смонтировать свое приложение для реагирования прямо внутри страницы VF. Не нужно использовать lightning:container.

См. Мой проект BASS . Доказано, что это работает и чрезвычайно масштабируемо.

Пример страницы VF с приложением React: 

<apex:page showHeader="true" sidebar="false" standardStylesheets="false" docType="html-5.0">
    <script type="text/javascript">
        //rest details
        const __ACCESSTOKEN__ = '{!$Api.Session_ID}';
        const __RESTHOST__ = '';
    </script>
    <div id="root"></div>
    <!-- Your react entry point -->
    <script type='text/javascript' src="{!URLFOR($Resource.app, 'dist/app.js')}"></script>
</apex:page>

Также возможно запустить приложение React прямо внутри LW C, но не рекомендуется.

...