为啥 tableTools 对同一个 SWF 文件进行多次调用?

Posted

技术标签:

【中文标题】为啥 tableTools 对同一个 SWF 文件进行多次调用?【英文标题】:Why is tableTools making multiple calls to the same SWF file?为什么 tableTools 对同一个 SWF 文件进行多次调用? 【发布时间】:2015-02-11 11:28:49 【问题描述】:

我碰巧在我的应用程序中注意到,当调用 datatables/tabletools 时,copy_csv_xls_pdf.swf 被调用了 3 次。我整理了a jsfiddle which (sometimes) illustrates the issue:

从TableTools documentation 可以观察到相同的行为:

这种行为特别成问题,因为文件的初始加载似乎没有被浏览器缓存,以便在同一请求期间后续加载。 p>

对于每个由 SWF “驱动”的按钮,似乎都有一个对该文件的请求。

不过,为什么这个文件会被多次加载?有必要吗?如何防止它(同时仍然提供相同的功能)?

忽略下面不必要的代码......


...这只是为了让我可以包含指向 jsfiddle 的链接:

$('#browser_data').dataTable(
    "bPaginate": false,
    "bAutoWidth": false,
    "bLengthChange": false,
    "sDom": "<'row-fluid'<'span6'f><'span6'<'pull-right'T>>r>t",
    "oTableTools": 
        "aButtons": [ "copy", "xls", "pdf" ],
        "sSwfPath": "http://datatables.net/release-datatables/extras/TableTools/media/swf/copy_csv_xls_pdf.swf"
    
);

【问题讨论】:

仅供参考:在github.com/DataTables/TableTools/issues/72 上将其作为 tabletools 问题交叉发布 HTTP 状态码 304 表示Not modified。所以 SWF 文件是从缓存中加载的。 > 304 Not Modified > > 表示资源自请求头 If-Modified-Since 或 If-None-Match 指定的版本以来没有被修改过。这意味着不需要重新传输资源,因为客户端仍然有一个先前下载的副本。来源:en.wikipedia.org/wiki/List_of_HTTP_status_codes jsfiddle 中似乎没有加载 swf。 @jao:您对官方文档和 304 状态是正确的——这确实表明文件已缓存(因此这可能只是文件头上的服务器设置)。不过,我不知道为什么需要在同一个请求中多次将同一个文件加载到浏览器。 jsFiddle 有时会显示文件加载,有时不会。但这将是一个单独的问题...... 可能是其他人在 GitHub 上所说的,它正在为每个按钮加载......虽然很奇怪 我也这么认为——但为什么呢?我无法想象为什么它是必要的。 【参考方案1】:

谷歌浏览器

这是请求标头的 sn-p ——无论我是硬刷新还是仅刷新,标头都是相同的:

:host:datatables.net
:method:GET
:path:/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf
:scheme:https
:version:HTTP/1.1
accept:*/*
accept-encoding:gzip, deflate, sdch
accept-language:en-US,en;q=0.8,sw;q=0.6
cache-control:no-cache
cookie:

你看到cache-control:no-cache了吗?这似乎表明发出这些请求时明确关闭了 缓存。每次刷新都会显示每个请求的状态 200……我从来没有看到 304。

就屏幕截图中的 304 状态而言,重要的是它们是 304、304、304 而不是 200、304、304。这表明每个请求在 URL-wise 之外的某些方面是唯一的,因此每个请求都必须被显式缓存。让我们看看这是否是一个正确的假设......

Mozilla 火狐

这是我运行一些测试所遵循的过程

通过将缓存限制设置为 .34GB 来设置缓存非常 加载页面:并刷新并记录结果 通过硬刷新和刷新来重现结果

以下是结果 -- 每个按钮都有一个状态:

初始加载状态:200、200、200、200 刷新:304、304、304、304 硬刷新:200、200、200、200 硬刷新后刷新:304、304、304、304

考虑到按钮并不完全相同,即使.swf URL 相同,这不是很有意义吗? 相同的 URL 每次都会产生不同的按钮! 是否有某种签名来区分每个按钮的请求? 这是动态内容的行为——相同的 URL 不同的内容。

最后一次测试

关闭了缓存——设置缓存限制为0,结果是:

硬刷新:200、200、200、200 刷新:200、304、200、200

结论

    每个按钮内容都被缓存。这就是为什么即使分配了足够的磁盘空间来缓存初始页面加载并且硬刷新显示 200、200、200、200 而不是 200、304、304、304。 是否缓存这些按钮取决于您的浏览器设置:缓存是否开启以及分配给缓存的空间量。 很可能 200、304、200、200 可能表明没有足够的磁盘空间来缓存 Copy 按钮,但这正是 CSV需要 kbd> 按钮,并且没有任何东西可以缓存 ExcelPDF 按钮。

【讨论】:

您断言“...每个按钮的 .swf 返回的内容都不同...”。这是我显然不明白的重要部分(我对 Shockwave Flash 一无所知)。 同一个文件每个按钮怎么会有不同的呢? “同一个文件怎么能有不同的按钮?”。它不是。忘记 SWF 文件。如果您在代码中请求图像 3 次,浏览器将尝试加载 3 次。它将对 SWF 文件和任何其他文件执行相同的操作。如果它被多次请求,它只是写得很糟糕的代码。 同一个文件怎么能有不同的按钮?动态内容的工作方式相同;只有我们会谈论 same URL 而不是 same file【参考方案2】:

在您的情况下(您的 jsfiddle),您使用了 3 个按钮:复制、另存为 excel 和另存为 pdf。脚本 (TableTools) 将使用的 swf (copy_csv_xls_pdf.swf) 复制 3 次,每个按钮一个,因为它用于每次复制内容。 swf 是一个ZeroClipboard 实例,它被称为复制数据的好主意,因为闪存可以访问系统剪贴板,而浏览器则不然。当然,TableTools documentation 的演示使用了 4 个按钮:复制、另存为 csv、另存为 excel 和另存为 pdf,这就是它加载 4 个 swf 实例的原因,请查看 html 代码:

<a class="DTTT_button DTTT_button_copy" id="ToolTables_example_0" tabindex="0" aria-controls="example">
    <span>Copy</span>
    <div style="position: absolute; left: 0px; top: 0px; width: 47px; height: 32px; z-index: 99;">
        <embed id="ZeroClipboard_TableToolsMovie_1" src="/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff"   name="ZeroClipboard_TableToolsMovie_1" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=1&amp;width=47&amp;height=32" wmode="transparent">
    </div>
</a>
<a class="DTTT_button DTTT_button_csv" id="ToolTables_example_1" tabindex="0" aria-controls="example">
    <span>CSV</span>
    <div style="position: absolute; left: 0px; top: 0px; width: 43px; height: 32px; z-index: 99;">
        <embed id="ZeroClipboard_TableToolsMovie_2" src="/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff"   name="ZeroClipboard_TableToolsMovie_2" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=2&amp;width=43&amp;height=32" wmode="transparent">
    </div>
</a>

<a class="DTTT_button DTTT_button_xls" id="ToolTables_example_2" tabindex="0" aria-controls="example">
    <span>Excel</span>
    <div style="position: absolute; left: 0px; top: 0px; width: 48px; height: 32px; z-index: 99;">
        <embed id="ZeroClipboard_TableToolsMovie_3" src="/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff"   name="ZeroClipboard_TableToolsMovie_3" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=3&amp;width=48&amp;height=32" wmode="transparent">
    </div>
</a>

<a class="DTTT_button DTTT_button_pdf" id="ToolTables_example_3" tabindex="0" aria-controls="example">
    <span>PDF</span>
    <div style="position: absolute; left: 0px; top: 0px; width: 43px; height: 32px; z-index: 99;">
        <embed id="ZeroClipboard_TableToolsMovie_4" src="/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff"   name="ZeroClipboard_TableToolsMovie_4" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=4&amp;width=43&amp;height=32" wmode="transparent">
    </div>
</a>

编辑:

在重新阅读了您的问题和您的 cmets 之后,我不知道您是否想知道为什么页面正在加载 n swf 实例或如何避免这种情况?如果是第一种情况,我把我看到的作为解释,否则我认为 TableTools 开发人员可能会优化他们的代码,我不知道这是否真的可能,通过最小化嵌入的 swf 对象。

【讨论】:

亲爱的朋友你能帮帮我吗?

以上是关于为啥 tableTools 对同一个 SWF 文件进行多次调用?的主要内容,如果未能解决你的问题,请参考以下文章

为啥 DataTable TableTools 导出为 pdf 或 excel 或 csv 不适用于私人浏览器?

为啥它不加载 part1.swf ?

为啥 DataTable TableTools 导出为 pdf 或 excel 或 csv 按钮不可见,只有打印按钮可见?

在 Tabletools 中打开或保存提示

我的 Bootstrap TableTools 没有按预期工作

为啥我导入的 MovieClip(从 SWF 导入)的行为不像 MovieClip?