MongoDB工具 >MongoDB图表 >图表嵌入 >使用Embedding SDK嵌入图表 >嵌入教程 > 嵌入经过Google登录身份验证的图表
本教程向您展示如何配置示例应用程序,以在网页上呈现经过Google身份验证的嵌入式图表。
用户必须使用其Google帐户登录才能查看该图表。如果用户未使用Google登录,则Charts不会呈现经过身份验证的图表视图。
启用经过身份验证的嵌入以生成图表ID和“图表基本URL”。您需要图表ID和图表基本URL才能在网页上显示图表。
从仪表板页面中,选择包含要嵌入的图表的仪表板。
在仪表板上,单击 图表右上方的嵌入图表。
以访问其嵌入信息。从下拉菜单中选择如果已经在此图表使用的数据源上启用了外部共享,请跳过此步骤。如果尚未启用在数据源上嵌入,则可以立即启用。单击 配置外部共享链接。
您可以指定一个函数,为查看图表的每个用户注入MongoDB筛选器文档。该功能可以通过访问您的嵌入身份验证提供程序的令牌context.token
,并且可以基于该令牌过滤图表数据。
此过滤器确保嵌入式图表的查看者仅看到自己的数据,这在将图表与潜在敏感信息一起嵌入时非常有用。
例
以下过滤器功能仅在ownerId
文档的字段与嵌入身份验证提供程序的令牌的sub
字段的值匹配的情况下呈现数据
:
在应用程序代码中将这些值与“嵌入式身份验证提供程序”属性一起使用以嵌入图表。
创建一个Google API控制台项目以生成一个Google客户端ID。您将需要您的Google客户ID,才能将图表配置为使用Google登录。
要创建Google API控制台项目,请参阅将Google登录集成到您的网络应用中。
MongoDB提供了一个预先构建的示例应用程序,该应用程序显示了如何使用Embedding SDK通过Google身份验证显示嵌入式图表。
要运行示例应用程序,请
从GitHub 克隆
MongoDB图表嵌入示例-Google身份验证存储库,然后按照Readme
文件中的说明开始使用该应用程序。您可以使用示例图表按原样运行该应用程序,也可以自定义它以使用现有图表。
index.html
在文本编辑器中打开文件。¶该文件index.html
位于authenticated-google
项目的根目录中
。
将现有的Google客户ID替换为您的Google客户ID。
创建Google API控制台项目后,即可看到您的Google客户ID。有关创建Google客户ID的说明,请参见创建 Google客户ID。
用baseUrl
您要显示的图表的基本URL 替换现有的URL。
您的“图表基本URL”在嵌入选项模式窗口中可见。有关为图表启用嵌入的详细说明,请参见使用Embedding SDK嵌入图表。