kibana - 如何在 Kibana 中禁用/隐藏开发工具插件

Question

我想Dev Tools在 Kibana 中隐藏菜单项，但根据他们的路线图，这在他们的权限系统中是不可能的，也不会很快实现。（见https://discuss.elastic.co/t/disable-hide-management-plugin-kibana-5/72763）

Kibana 位于一个 iFrame 中，该 iFrame 在容器的域中托管一个站点。

Answer 1

I ended up using MutationObservers in JavaScript to watch for changes to the DOM inside the iFrame in order to hide the menus I didn't want non-admins to see. Solution written in AngularJS 1.2 and is known to work with Kibana 6.2 and 6.3. This will hide several "left side" menus as well as a bunch of Management sub-menus. You can use or modify the code to hide/show additional UI elements. Unfortunately, I had to rely on classes a lot since very few elements contained IDs I could reference.

I hope this at least helps you think of your own solution to managing Kibana display elements outside of their permission structure.

HTML:

    <iframe id="AnalysisFrame" ng-src="{{kibanaUrl}}" ng-init="setupFrame()"></iframe>

JavaScript:

    $scope.setupFrame = function() {
        //iframes are excluded from mutation observation, so we will
        //  need to create an observer _inside_ the iframe content.
        var theFrame = document.querySelector('#AnalysisFrame');
        //once the frame is loaded, that is when we can now attach our
        //  observer to the frame's content.
        theFrame.onload = function() {
            //console.log('[TRACE] iframe is completely loaded');
            var bIsKibanaAdmin = $scope.bIsKibanaAdmin;
            //the above is TRUE|FALSE set by some outside logic
            //  which does not pertain to this exercise.

            //create an observer instance for Management sub-menus
            var observerMan = new MutationObserver(function(mutations) {
                mutations.forEach(function(mutation) {
                    //console.log('[TRACE] ', mutation);
                    //sub-menus of the Management console area
                    var manArea = theFrame.contentDocument.body.querySelector('kbn-management-landing');
                    if ( manArea ) {
                        //Management area is divided up by panels of related subjects
                        var manPanels = manArea.querySelectorAll('div[class*="page-row"]');
                        if ( manPanels ) manPanels.forEach(function(aPanel) {
                            //console.log('[TRACE] panel=', aPanel);
                            //6.2.4 had <div> titles, 6.3.x has <h3> titles, select based on their class only
                            var panelTitle = aPanel.querySelector('.kuiPanelHeader__title');
                            //if a panel has a title (version panel does not have one), see if hide or not.
                            if ( panelTitle ) switch ( panelTitle.innerText ) {
                                case 'Kibana':
                                    //only hide the Advanced Settings item off this panel
                                    var panelItem = aPanel.querySelector('li > a[href*="#/management/kibana/settings"]');
                                    if ( panelItem ) panelItem.parentElement.hidden = !bIsKibanaAdmin;
                                    break;
                                default:
                                    //most management panels are hidden from non-admins
                                    aPanel.hidden = !bIsKibanaAdmin;
                            }//switch
                        });
                    }
                });
            });
            //configuration of the left menu becomes active observer
            var configMan = {
                    attributes: true, //for when Management becomes the Active menu
                    attributeFilter: ['class'],
                    //attributeOldValue: true,
                    childList: false,
                    characterData: false,
                    //characterDataOldValue: false,
                    //subtree: true,
            };
            //the Management menu item does not exist yet, cannot start observing until later.

            //create an observer instance for left menu
            var observer = new MutationObserver(function(mutations) {
                mutations.forEach(function(mutation) {
                    //console.log('[TRACE] ', mutation);
                    var leftMenus = mutation.target.querySelectorAll('.global-nav-link');
                    //since the menus do not have IDs, we are searching for their outer
                    //  DIV class unique to all left menu items. Their first element child
                    //  will be the <a href> link we can use to filter out ones we
                    //  wish to show or not.
                    if ( leftMenus ) leftMenus.forEach(function(aMenu) {
                        if ( aMenu.firstElementChild ) {
                            switch ( aMenu.firstElementChild.hash ) {
                                case "#/dev_tools":
                                    aMenu.hidden = !bIsKibanaAdmin;
                                    break;
                                case "#/account":
                                    aMenu.hidden = true;
                                    break;
                                case "":
                                    if ( aMenu.innerText=='Logout' ) {
                                        aMenu.hidden = true;
                                    }
                                    //else console.log('[TRACE] menu=', aMenu);
                                    break;
                                case "#/management":
                                    //we only want to hide certain sub-menus
                                    //  our menu item exists, attach observer for when
                                    //  user clicks it to make it "active"
                                    observerMan.observe(aMenu, configMan);
                                    break;
                                default:
                                    //console.log('[TRACE] menu=', aMenu);
                            }//switch
                        }
                    });
                });
            });
            //configuration of the left menu creation observer
            var configLM = {
                    attributes: false,
                    //attributeFilter: ['src'],
                    //attributeOldValue: true,
                    childList: true,
                    characterData: false,
                    //characterDataOldValue: false,
                    //subtree: true,
            };
            //start observing the contents of the iframe changes
            observer.observe(theFrame.contentDocument.body, configLM);
        };
    };