Javascript on VF page:

    function openInSubtab(asd, asdf) {
            sforce.console.getEnclosingPrimaryTabId(function (r) {
                callBackopenTab(r, asd, asdf);

    function callBackopenTab(r, asd, asdf) {
        console.log('rId : ' + r.id);
        console.log('asd: ' + asd);
        console.log('asdf: ' + asdf);
        sforce.console.openSubtab(r.id, '/' + asd, true, asdf, null);

VF page link:

<a href="javascript:void(0);"openInSubtab('{!asd', '{!asdf');return false;">{!asd}</a>

This works fine when its a VF page and we include this into a flexipage. Now I have embedded this VF page in a lightning component via an iframe.

<iframe id="componentName" src="/apex/VFPAGENAME" width="100%"
        height="100%" frameBorder="0"/>

Now when I click the link, it throws:

Uncaught DOMException: Blocked a frame with origin "https://******.my.salesforce.com" from accessing a cross-origin frame.
at Object.handleOnload (https://******/support/console/xdomain/30.0/iframeinterface.js:1:356)
at window.onload (https://******/support/console/xdomain/30.0/crossDomainProxy.html:4:89)

and does not open anything in subtab.


I suspect the reason could be that my console app is opened in lightning experience, thus the url in address bar has lightning in it, where as window.location.href still gives me base url of my org, so it may be a same origin policy, but still dont know how to resolve it.


I found a way to do it.

VF page:

<a href="javascript:void(0);"
   onClick="openCustomSubtab('asdf', 'asdfg');return false;">OpenSubtab</a>

Javascript :

function openCustomSubtab(id, tabName) {

    var response = {
        destinationID: "destId",
        paramObject: {
            id: id,
            tabName: tabName
    parent.postMessage(JSON.stringify(response), '*');


Then listen to this message in my controller of the lightning component where my VF page is embedded.

doInit: function (component) {
    var listener = function (event) {

        if (event !== null && event.data !== null && typeof event.data === 'string') {
            try {
                var eventResponse = JSON.parse(event.data);
                if (eventResponse.destinationID !== '' && eventResponse.destinationID === 'destId'){
                    var someTest = setInterval(function () {
                        var idContact = component.get("v.recordId");
                        var workspaceapi = component.find("workspace");
                            url: '/lightning/r/Contact/' +idContact +'/view' ,
                            focus: true
                        }).then(function(res) {
                                parentTabId: res,
                                url: '/lightning/n/TestAppPage',
                                focus: true
                    }, 1);
            } catch (err) {
    window.addEventListener("message", listener);

From here I am opening a subtab. This works fine.

UPDATE For opening subtab: Its better if we write like this :

if (workspaceapi) {
    workspaceapi.getFocusedTabInfo().then(function(response) {
        var focusedTabId = response.tabId;
            tabId: focusedTabId,
            url: '/lightning/n/TestAppPage'
    }).catch(function(error) {

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.