为什么 window.open 不能与 Looker 的扩展框架一起使用？

Question

我正在尝试在 javascript onclick 函数中使用 window.open 来获取可点击的嵌入图像。由于某种原因它不起作用。我正在尝试将其嵌入到 Google Looker 扩展框架中。

编辑：当我在 Looker Extension 框架上打开网页时，单击图像时没有任何反应。理想情况下，我希望单击图像时在新选项卡中打开页面。

var img = new Image()
img.src =
'https://marketplace-api.looker.com/visualization-screenshots/report_table_icon.png'
img.onclick = function () {
   window.open('https://looker.com/', '_blank')
}
document.body.appendChild(img)

Answer 1

我会先说我们正在积极致力于改进扩展框架的文档，所以很抱歉目前有点不透明！

扩展框架是沙盒的，因此它无法访问一些标准的 javascript API，例如 window.open。要启动新窗口，您可以使用

extensionSDK.openBrowserWindow('https://looker.com/', '_blank')

完整示例（如果有帮助）：

import React, { useContext } from 'react'
import { Space, ComponentsProvider, Text, Button } from '@looker/components'
import { ExtensionContext } from '@looker/extension-sdk-react'

export const HelloWorld = () => {

  const extensionContext = useContext(
    ExtensionContext
  )
  const { extensionSDK } = extensionContext

  const buttonClick = () => {
    extensionSDK.openBrowserWindow('https://google.com', '_blank')
  }

  return (
    <>
      <ComponentsProvider>
        <Space p="xxxxxlarge" width="100%" height="50vh" around>
          <Text p="xxxxxlarge" fontSize="xxxxxlarge">
            openBrowserWindow example
          </Text>
          <Button onClick={buttonClick}> click me </Button>
        </Space>
      </ComponentsProvider>
    </>
  )
}

Answer 2

@ReneeR：Izzy 解决方案是正确的，可以从有关打开新窗口的扩展的文档中引用：

https://cloud.google.com/looker/docs/extension-framework-react-and-js-code-examples#opening_a_new_browser_window