Superset图表通过iframe嵌入Html网页展示一文详解

目录

前言

一、iframe

二、插入html

三、解决登录问题。

第一种:

1.修改config.py配置文件,将PUBLIC_ROLE_LIKE 设置为Gamma

2. 去掉X-Frame-Options限制

3. WTF_CSRF_ENABLED设置为False

 第二种:

1.修改superset下config.py文件里的一些内容,使得superset可以联动

扫描二维码关注公众号,回复: 14311967 查看本文章

 2.修改用户权限

3. CSV文件导出乱码问题

 四、添加Public角色权限

参阅:



前言

业务需求用superset制作报表,但是制作的报表不能直接用superset直接当作报表的工具。如果不使用二次开发的话,就只能到superset上面才能看到动态的数据。因此能够嵌入html文件里面才能实现superset图表的功能。当然通过iframe嵌入到前段做二次开发实现大数据平台页面也是常常干的事,因此把该方法分享给各位。希望能够帮助到正在看此博文的各位,如果还有什么问题解决不了尽请在评论区提出,博主会一一作答。下面开始正文。


一、iframe

iframe为嵌入式框架,该功能可以把一个网页的框架内容嵌入到现有网页中去。而根据superset原理也了解,superset是基于python语言,使用pyecharts库封装开法而来,其生成的图表其实也就是一个通过JS渲染的html图表文件。故使用iframe进行嵌入。

在导航栏前段找到Embed code就可以发现自己制作的图表iframe代码了:

 

关于iframe的代码,其中一些属性是可以根据需求修改的,这里把iframe的属性贴出:

width 定义iframe的宽度
height 定义iframe的高度
name 规定iframe的名称
frameborder 规定是否显示边框,0(不显示) 、1(显示)
src 设置iframe的地址(页面/图片)
scrolling 规定是否在iframe中显示滚动条,属性值(yes ,no,auto)
vspace 设置或获取对象的水平边距
hspace 设置或获取对象的垂直边距

 根据属性说明自己慢慢调就好了。

二、插入html

之后我们需要创建一个空的html文件,将iframe代码插入body就好了。

我们先进行验证插个空的就好了,马上就会发现需要登陆,然后一直登录不上的问题。

三、解决登录问题。

superset是默认进入图表的用户为public类型,要先修改配置文档。

注意 每个版本的superset的配置文件config可能会不一样,需要根据自己的版本修改。

我的superset版本为1.3.2,查阅了网上众多方法发现一般解决方法有2种,就都能解决该问题。

第一种:

找到相应的配置文件:

/usr/local/python3/lib/python3.6/site-packages/superset/config.py

1.修改config.py配置文件,将PUBLIC_ROLE_LIKE 设置为Gamma

PUBLIC_ROLE_LIKE = "Gamma"

讲给予public与gamma相同权限级,以后就可以在角色列表添加权限了。

2. 去掉X-Frame-Options限制

可以免去跨域访问问题:直接将里面置空就好了

HTTP_HEADERS = {}

3. WTF_CSRF_ENABLED设置为False

找一找该代码段为位置,讲True该为False:

 WTF_CSRF_ENABLED = False

 第二种:

第二种方法一般适用于版本比较高的superset,其config文件有所改动:

1.修改superset下config.py文件里的一些内容,使得superset可以联动

"DASHBOARD_NATIVE_FILTERS": True,

"DASHBOARD_CROSS_FILTERS": True,

"DASHBOARD_NATIVE_FILTERS_SET": True,

 2.修改用户权限

PUBLIC_ROLE_LIKE: Optional[str] = "Gamma"

3. CSV文件导出乱码问题

CSV_EXPORT = {"encoding": "utf-8-sig"}

 四、添加Public角色权限

接下来编辑权限:

 

 加入这些权限:

 之后再进去html文件:

好的没问题了。 


参阅:

iframe的简单介绍

superset-1.3安装分享---windows版

猜你喜欢

转载自blog.csdn.net/master_hunter/article/details/125392601