文档

发布分享页域名变更常见问题

更新时间:

为了更好地支持分享,DataV可视化应用分享页域名即将从datav.aliyun.com/share/example切换为datav.aliyuncs.com/share/example,本文提供了此变更可能对您的DataV可视化应用项目造成的影响及解决方案。

重要

DataV可视化应用分享页域名变更可能会对您的可视化应用项目产生影响,对您造成的不便敬请谅解。请按照本文档提供的方法及时进行排查并解决问题。在此期间,新域名和旧域名会共存一段时间,方便您进行过渡。

域名变更的影响

  • 使用了API作为数据源的组件,可能会因为域名变更导致跨域请求被拦截。

  • 轮播页面组件或者iframe 组件内打开的页面,可能会因为跨域限制导致iframe页面无法在新域名 datav.aliyuncs.com下被访问。

  • 使用了DataV 数据代理服务数据源的组件,可能会因为域名变更导致跨域请求被拦截。

域名变更问题的解决方案

DataV在发布页面提供了新的分享链接,您可以打开新的分享链接测试可视化应用是否正常运行。如果无法正常运行,您可以按照以下方式进行排查并解决问题。

  1. 检查您可视化应用中的组件是否使用了API作为数据源,如果是,请执行以下步骤:

    1. 如果组件的数据配置中没有勾选需要 cookie(不选择代理并且需要获取 cookie 时使用),请确保请求响应头response headers里包含: Access-Control-Allow-Origin: *

    2. 如果组件的数据配置中勾选了需要 cookie(不选择代理并且需要获取 cookie 时使用),需要根据request.headers.referer动态返回可以被跨域请求的响应头response headers,示例如下:

      当前页面地址

      request.headers.referer

      满足要求的响应头 response headers

      编辑页(http):http://datav.aliyun.com/admin/screen/216787

      http://datav.aliyun.com/admin/screen/216787

      Access-Control-Allow-Origin: http://datav.aliyun.com

      编辑页(https):https://datav.aliyun.com/admin/screen/216787

      https://datav.aliyun.com/admin/screen/216787

      Access-Control-Allow-Origin: https://datav.aliyun.com

      旧版分享页(https):https://datav.aliyun.com/share/xxx

      https://datav.aliyun.com/share/xxx

      Access-Control-Allow-Origin: https://datav.aliyun.com

      旧版分享页(http):http://datav.aliyun.com/share/xxx

      http://datav.aliyun.com/share/xxx

      Access-Control-Allow-Origin: http://datav.aliyun.com

      新版分享页(https):https://datav.aliyuncs.com/share/xxx

      https://datav.aliyuncs.com/share/xxx

      Access-Control-Allow-Origin: https://datav.aliyuncs.com

      新版分享页(http):http://datav.aliyuncs.com/share/xxx

      http://datav.aliyuncs.com/share/xxx

      Access-Control-Allow-Origin: http://datav.aliyuncs.com
  2. 检查您可视化应用中是否使用了iframe或者轮播页面组件,如果是,请执行以下步骤:

    1. 访问新版发布页的分享链接,检查iframe页面内容是否正常加载,如果无法正常加载,请执行下一步。

      说明

      iframe页面没有正常加载,说明这个页面在响应头里做了X-Frame-Options限制,您填入的iframe页面地址不支持在datav.aliyncs.com 下被访问,需要按照以下步骤增加跨域支持。

    2. 删除响应头内的X-Frame-Options字段,或者修改响应头内的X-Frame-Options的内容,示例如下:

      当前页面地址

      满足要求的响应头 response headers 需要包含的字段内容

      编辑页(http):http://datav.aliyun.com/admin/screen/216787

      X-Frame-Options: ALLOW-FROM http://datav.aliyun.com

      编辑页(https):https://datav.aliyun.com/admin/screen/216787

      X-Frame-Options: ALLOW-FROM https://datav.aliyun.com

      旧版分享页(https):https://datav.aliyun.com/share/xxx

      X-Frame-Options: ALLOW-FROM https://datav.aliyun.com

      旧版分享页(http):http://datav.aliyun.com/share/xxx

      X-Frame-Options: ALLOW-FROM http://datav.aliyun.com

      新版分享页(https):https://datav.aliyuncs.com/share/xxx

      X-Frame-Options: ALLOW-FROM https://datav.aliyuncs.com

      新版分享页(http):http://datav.aliyuncs.com/share/xxx

      X-Frame-Options: ALLOW-FROM http://datav.aliyuncs.com
  3. 检查您可视化应用中的组件是否使用了DataV 数据代理服务数据源,如果是,请执行以下步骤:

    • 方法一:

      1. 单击此处下载DataVProxy包中的 app.js 文件。

      2. 将下载的app.js文件替换服务器DataVProxy所在根目录下的同名文件,并重启服务器。

    • 方法二:

      1. 打开服务器中DataVProxy根目录下的app.js文件。

      2. 修改app.js 第20行的跨域头判断信息,增加datav.aliyuncs.com支持,如下所示。

        // 旧的 line 20:
        if (this.request.header.origin && this.request.header.origin.match(/(datav.aliyun.com|datav-ap-northeast-1.alibabacloud.com|datav-ap-southeast-1.alibabacloud.com)(:\d+)?/)) {
        
        // 新的 line 20:
        if (this.request.header.origin && this.request.header.origin.match(/(datav.aliyun.com|datav-ap-northeast-1.alibabacloud.com|datav-ap-southeast-1.alibabacloud.com|datav.aliyuncs.com)(:\d+)?/)) {
                                            
      3. 修改完成后,保存app.js文件并重启服务器。

  • 本页导读 (0)