如何让Google Workspace插件直接显示为右侧主侧边栏？

我们的Google Workspace插件通过Ui.showSidebar函数实现侧边栏展示，并在appsscript.json中利用homepageTrigger特性触发显示。目前功能正常，但点击插件图标时，会先快速弹出一个“主侧边栏”随即消失，再加载我们的目标侧边栏，视觉体验不佳。请问如何让插件直接在主侧边栏中显示，避免这种闪烁现象？

现有代码 #

appsscript.json #

{
  "timeZone": "Australia/Sydney",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "dependencies": {
    "enabledAdvancedServices": [
      {
        "userSymbol": "Drive",
        "serviceId": "drive",
        "version": "v2"
      }
    ]
  },
  "oauthScopes": [
    "https://www.googleapis.com/auth/script.scriptapp",
    "https://www.googleapis.com/auth/documents.currentonly",
    "https://www.googleapis.com/auth/spreadsheets",
    "https://www.googleapis.com/auth/presentations",
    "https://www.googleapis.com/auth/script.container.ui",
    "https://www.googleapis.com/auth/drive",
    "https://www.googleapis.com/auth/drive.apps.readonly",
    "https://www.googleapis.com/auth/script.external_request",
    "https://www.googleapis.com/auth/script.locale",
    "https://www.googleapis.com/auth/userinfo.email"
  ],
  "urlFetchWhitelist": [
    "https://cm234-wgs-1.icognition.cloud/",
    "https://docs.google.com/feeds/download/documents/export/Export",
    "https://docs.google.com/spreadsheets/export",
    "https://docs.google.com/feeds/download/presentations/Export"
  ],
  "addOns": {
    "common": {
      "name": "Content Manager",
      "logoUrl": "https://cm234-wgs-1.icognition.cloud/CMServiceApiGoogle/TrimIcon/W64h64/trim.png",
      "homepageTrigger": {
        "runFunction": "showSidebar",
        "enabled": true
      }
    },
    "sheets": {},
    "docs": {},
    "slides": {}
  }
}

Code.gs #

function showSidebar() {
  var sidebarName = "sidebar";

  if (getRecordUri() !== 0) {
    sidebarName = "existing_record_sidebar";
  }

  var ui =
    HtmlService.createHtmlOutputFromFile(sidebarName).setTitle(
      "Content Manager"
    );
  getUi().showSidebar(ui);
}

闪烁问题的核心是homepageTrigger默认会先加载一个空的“主侧边栏”，再执行你的showSidebar函数替换它。要消除闪烁，需直接在homepageTrigger中指定初始加载的HTML文件，将逻辑判断移至前端处理，避免两次侧边栏切换。

具体步骤：

1. 修改appsscript.json配置
   移除homepageTrigger中的runFunction，改用homepageUrl直接指向基础侧边栏文件：

   "homepageTrigger": {
     "homepageUrl": "sidebar.html",
     "enabled": true
   }
   

2. 在sidebar.html中加入动态判断逻辑
   调用后端函数获取状态，根据结果加载对应内容：

   <!DOCTYPE html>
   <html>
     <head>
       <base target="_top">
       <script>
         google.script.run.withSuccessHandler(function(recordUri) {
           if (recordUri !== 0) {
             google.script.run.withSuccessHandler(function(html) {
               document.getElementById('content').innerHTML = html;
             }).getExistingRecordSidebarHtml();
           }
         }).getRecordUri();
       </script>
     </head>
     <body>
       <div id="content">
         <!-- 这里放置原sidebar.html的默认内容 -->
       </div>
     </body>
   </html>
   

3. 在Code.gs中新增内容获取函数
   返回existing_record_sidebar.html的HTML内容，供前端调用：

   function getExistingRecordSidebarHtml() {
     return HtmlService.createHtmlOutputFromFile('existing_record_sidebar').getContent();
   }
   

修改完成后，点击插件图标会直接加载sidebar.html作为主侧边栏，前端动态判断并替换内容，彻底避免切换闪烁。

内容的提问来源于stack exchange，提问作者Jan Martin