1

I have a Visual force page that contains a lightning web component hosted in a Salesforce developer sandbox

I have a custom object that will be linked with this Visual force page using the streaming API provided by Salesforce. I have also created a Rest API in Salesforce to which an end user will post data. When the user posts data to the Rest API a new record will be added into the custom object specified above. This will trigger a Javascript function defined in the visualforce page From this Javascript function I want to use the 'Lightning Message Service' to pass data to the Lightning web component embedded in the Visualforce page.

Basically I am doing it this way since the Salesforce 'Open CTI' supports only a Javascript API where as my requirement necessitates an HTTPS Post

Please note that this Visualforce page is set as the 'AdapterUrl' in the call center settings page

The visualforce page is loaded when the 'phone' icon is clicked by the user

Code for the Visualforce page

<apex:page >    
    <apex:includeLightning />
    <script src="https://test.salesforce.com/support/api/54.0/lightning/opencti_min.js" type="text/javascript"></script>
    <script src="https://test.salesforce.com/support/api/54.0/interaction.js" type="text/javascript"></script>
    
    <div id="lightning"></div>

        <script type="text/javascript">
            $Lightning.use("c:myAuraApp", function() {
            $Lightning.createComponent("c:softPhoneLWC",
            { 
            },
            "lightning",
            function(cmp) {
                //window.$Force = sforce;
                console.log('LWC Componenet added in VF page');
            });
        });
            //var SAMPLEMC = "{!$MessageChannel.MyMessageChannel__c}";
            var SAMPLEMC ="MyMessageChannel__c";
            var SAMPLEMC_SUBSCRIPTION = null;
            var subscriptionToMC;
            subscribeMC();
            publishMC();
            function subscribeMC() {
                if (!SAMPLEMC_SUBSCRIPTION) {
                    subscriptionToMC = sforce.opencti.subscribe({channelName: SAMPLEMC, listener: displayMessage,callback: subscribeSampleMCCallback});
                    
                }
            }
            
            function unsubscribeMC() {
                if (SAMPLEMC_SUBSCRIPTION) {
                    sforce.opencti.unsubscribe({subscription: SAMPLEMC_SUBSCRIPTION, callback:lightningMessageServiceCallback});
                    subscriptionToMC = null;
                }
            }
            
            function publishMC() {
                alert('in publish function');
                const message = {
                    messageToSend: "test",
                    sourceSystem: "From VisualForce Page"
                };
                sforce.opencti.publish({channelName: SAMPLEMC, message: message, callback:lightningMessageServiceCallback});
            }

            function displayMessage(message) {
                //var textLabel = document.querySelector("#MCMessageText");
                //textLabel.innerHTML = message ? JSON.stringify(message, null, '\t') : 'no message payload';
            }

            function subscribeSampleMCCallback(result) {
            //alert('callback');
            //alert(result.success);
                if (result.success) {
                SAMPLEMC_SUBSCRIPTION = result.subscription;
               // alert('subscribed');
                } else {
                //console.log(result.errors);
                alert(JSON.stringify(result.errors));
                }
            }

            function lightningMessageServiceCallback(result) {
            alert('publish callback');
                if (result.success) {
                // console.log(result.returnValue);
                alert('publish success');
                } 
                else {
                    alert(JSON.stringify(result.errors));
                }
            }

        </script>


</apex:page>

I am trying the use the 'Lightning Message Service' to communicate with the 'Lightning Web component' embedded in the visual force page using the 'Message Channel'. I can subscribe to the channel without any problem.

When I try to publish a message to the channel, I get the CORS error below in Firefox as well as Chrome browser

Uncaught DOMException: Permission denied to access property "Sfdc" on cross-origin object iframeinterface.js:1

handleOnload https://xxx-dev-ed.my.salesforce.com/support/console/xdomain/30.0/iframeinterface.js:1

onload https://xxx-dev-ed.my.salesforce.com/support/console/xdomain/30.0/crossDomainProxy.html#xdomain_name=s:isClickToDialEnabled&xdomain_targetFrame=s:sfdc-console&xdomain_txnId=s:0&xdomain_pathToOriginProxy=s:https://xxx-dev-ed--c.visualforce.com/crossDomainProxy.html&xdomain_originFrame=s:sfdcSoftphone&version=s:private_api:4

I have added all the urls to the CORS whitelist in Salesforce but nothing seems to help.

I have also added these urls to the 'trusted sites' whitelist in Salesforce.

Debugging with Firefox developer tools I found out the line that is causing the issue

Line 12 in https://xxx-dev-ed.my.salesforce.com/support/console/xdomain/30.0/iframeinterface.js

('sfdc-console' === b ? **top** : 'undefined' !== typeof a.targetParentFrame ? parent.frames[a.targetParentFrame].frames[b] : parent.frames[b]).Sfdc.xdomain.Listener.accept(a)

As per this document

https://trailblazer.salesforce.com/issues_view?id=a1p3A000000oH6CQAU

the error I am getting is because the above line of code is trying to access 'top'

The suggested workaround is to refresh the page but in my case refreshing the page dose not resolve the issue.

Thanks in advance for any tips

Regards Mathew

7
  • Hi and welcome to SFSE. Please edit your question to explain the structure of the page. Are you using LightningOut to embed the LWC in the Visualforce page or are you trying to use an iframe to embed a Lightning page in a VF page?
    – Phil W
    Jul 15, 2022 at 6:08
  • Thanks for responding. I am extremely new to Salesforce so I am not very clear about your question. I have edited the question to include the code of the Visualforce page
    – mjk6035
    Jul 15, 2022 at 6:40
  • OK, so using LightingOut. What is the reason to use LMS instead of simply ensuring you register some form of callback in the javascript while constructing your component?
    – Phil W
    Jul 15, 2022 at 7:56
  • Thanks for your response. I will just briefly explain my requirements I have a custom object that will be linked with this Visual force page using the streaming API provided by Salesforce I have a Rest API in Salesforce to which an end user will post data. When the user posts data to the Rest API a new record will be added into the custom object specified above This will trigger a javascript function that is defined in the visualforce page From this javascript function I want to use the LMS to pass data to the Lightning web component
    – mjk6035
    Jul 15, 2022 at 8:11
  • basically I am doing it this way since the Salesforce 'Open CTI' supports only a Javascript API where as my requirement necessitates an HTTPS Post
    – mjk6035
    Jul 15, 2022 at 8:16

1 Answer 1

0

The problem I facing publishing messages to a 'message channel' was not in any caused by the javascript error

'Uncaught DOMException: Permission denied to access property "Sfdc" on cross-origin object iframeinterface.js:1'

I noticed that the above error was being raised whenever the path to any 'Visualforce' page is set as the 'adapterURL' in the call center settings

My problem was caused by my wrong understanding of which callback is called when a 'message' is published to a message channel

In the statement below that I used to publish a message

sforce.opencti.publish({channelName: SAMPLEMC, message: message, callback: lightningMessageServiceCallback}); 

I was expecting the code in the 'lightningMessageServiceCallback' callback to be executed.

Only much later I realized that the listener callback specified while subscribing to a message channel will be called when somebody publishes a message to this channel

subscriptionToMC = sforce.opencti.subscribe({channelName: SAMPLEMC, listener: onPublishMessage,callback: subscribeSampleMCCallback}); 

In my case all the code in the listener onPublishMessage was commented so I failed to understand initially that this listener was being called

Thanks for all the responses

Mathew

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .