美文网首页
根据正确的扩展名,给与正确的 Content-Type,匹配正确

根据正确的扩展名,给与正确的 Content-Type,匹配正确

作者: 辉夜乀 | 来源:发表于2017-12-09 09:44 被阅读25次

    给与正确的 Content-Type

    创建 mime 模块,根据文件的路径 filepath 来确定扩展名

    const path = require('path');
    
    const mimeLists = {
      css: 'text/css',
      html: 'text/html',
      js: 'text/javascripte',
      xml: 'text/xml',
      gif: 'image/gif',
      jpg: 'image/jpeg',
      jpeg: 'image/jpeg',
      png: 'image/jpeg',
      json: 'application/json'
    };
    
    
    function mimeType(filepath) {
      let ext = path.extname(filepath)
        .split('.')   // jquery.min.js
        .pop()        //取最后的那个为扩展名
        .toLocaleLowerCase(); //转成小写
    
      if (!ext) {
        ext = path.basename(filepath);
      }
    
      return mimeLists[ext] || 'text/plain';
    
    }
    
    module.exports = mimeType;
    
    

    匹配正确的 icon

    给每个文件或文件夹配上图标

    //route 文件修改渲染的 data 数据,为 files 添加 icon 属性
    
    let data = {
        title: path.basename(filePath), /*title 为文件名*/
        dir: dir ? `/${dir}` : '',      /*title 为文件所在的文件夹路径*/
        files: files.map(file => {      /*files 是一个数组,为文件列表*/
            return {
                file,
                icon: mimeType(file)
            };
        })   
    };
    
    //同时也要修改模板文件
    
    {{#each files}}
      <a class="directory" href="{{../dir}}/{{file}}">【{{icon}}】{{file}}</a>
    {{/each}}
    
    

    然后我们把 icon 的文字替换成对应的 img 标签,匹配正确的 href 就可以了

    [图片上传失败...(image-b3a25d-1512783951647)]

    相关文章

      网友评论

          本文标题:根据正确的扩展名,给与正确的 Content-Type,匹配正确

          本文链接:https://www.haomeiwen.com/subject/igruixtx.html