使用 CSS 规则的文件类型图标

Question

我正在使用 这种方法在我的网络应用程序中的文件的每个链接附近显示一个图标。

为了避免 IE 历史缓存问题，我将链接显示为

<a href="path/to/the/file.xls?timestamp=0234562">FileName.xls</a>.

In this case the css rule doesn't do his job.

你知道我该如何解决这个问题吗？

Answer 1

您可能使用的选择器 a[href$='.xls'] 仅当它与 HREF 值的末尾匹配时才适用。 请改用 a[href*=.xls]。

摘自选择器级别 3：

<前><代码>[att*=val]

表示具有 att 属性的元素，其值包含 at
子字符串的至少一个实例
“瓦尔”。 如果“val”是空字符串
那么选择器并不代表
任何东西。

编辑

如果您可以控制 .htaccess 文件，则可以确保避免出现缓存问题，以便可以使用原始样式表规则。 请参阅使用 Apache 和 .htaccess 的缓存控制标头了解更多信息细节。

Answer 2

问题是 a[href$='.xls'] 与锚点的 href 属性的末尾匹配，但您要附加时间戳，因此结尾该 href 实际上是时间戳。

为了避免缓存问题，您可以使用代理来处理下载； 也就是说，使用触发文件下载的脚本。 在 PHP 中，它很容易通过 readfile() 函数并发送无缓存标头来实现，例如：

<a href="download.php?file=spreadsheet.xls">spreadsheet.xls</a>

但由于我不知道您使用的是哪种编程语言，所以我不能说太多。

Answer 3

邓肯，我知道这个问题已经得到了回答，但为了您的评论，这里有一个应该适合您的功能。 我认为它几乎直接来自 PHP 手册或其他地方的示例。 我在一个类中处理其他事情，例如检查文件权限、上传等。根据您的需要进行修改。

public function downloadFile($filename)
{

    // $this->dir is obviously the place where you've got your files
    $filepath = $this->dir . '/' . $filename;
    // make sure file exists
    if(!is_file($filepath))
    {
        header('HTTP/1.0 404 Not Found');
        return 0;
    }
    $fsize=filesize($filepath);

    //set mime-type
    $mimetype = '';
    // mime type is not set, get from server settings
    if (function_exists('finfo_file'))
    {
        $finfo = finfo_open(FILEINFO_MIME); // return mime type
        $mimetype = finfo_file($finfo, $filepath);
        finfo_close($finfo);
    }
    if ($mimetype == '')
    {
        $mimetype = "application/force-download";
    }

    // replace some characters so the downloaded filename is cool
    $fname = preg_replace('/\//', '', $filename);
    // set headers
    header("Pragma: public");
    header("Expires: 0");
    header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
    header("Cache-Control: public");
    header("Content-Description: File Transfer");
    header("Content-Type: $mimetype");
    header("Content-Disposition: attachment; filename=\"$fname\"");
    header("Content-Transfer-Encoding: binary");
    header("Content-Length: " . $fsize);

    // download
    $file = @fopen($filepath,"rb");
    if ($file)
    {
        while(!feof($file))
        {
            print(fread($file, 1024*8));
            flush();
            if (connection_status()!=0)
            {
                @fclose($file);
                die(); // not so sure if this best... :P
            }
        }
        @fclose($file);
    }
}