莉丝前端

因为需要有些新用户没有上传头像的喜欢，但是我又不愿意使用默认头像，毕竟人都想差异化，于是借用了@nimiq/identicons（以下简称identicons）生成动态头像；

但是框架是midwayjs，上下文ctx是egg的。

查询文档发现 可以通过 @ContentType 修饰器修改返回类型；

于是考虑返回的时候应该为base64编码，所以调用identicons的toDataUrl，返回，然后并不显示。

查询返回的数据发现，响应体直接修改如下，后面不接数据

data:image/svg+xml;base64,

尝试替换流，发现流编码可以顺利进入响应报文中，但依然不显示。

大胆猜测，设置了contentType后不必重新声明base64编码第一个逗号之前的东西，于是找了一个图标生成base64去掉逗号以前，发现

居然被编码了，返回内容如下

data:image/gif;base64,UjBsR09EbGhJQUFnQUxNQUFBQUFBUC8vLy8vL0FBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQ0g1QkFFQUFBSUFMQUFBQUFBZ0FDQUFRQVJvVU1oSnE3MVlnQkNBNTJEWUFWbHBhaHg1VXAvb3JYQnNiUzVHcXpKZTBaM3MvOENaVHVJcERsYzgwSkYzdkNSRHpWdlFsb294amNubWRNdnRlb0ZhN2diWGdvYWRvaFFXaXF5aHE2WW5mRGEzWWJIMDNoZWw5MHB6ZlJOTVBtVnBJMXQzZTRxTFhoRUFPdz09

目标内容如下

data:image/gif;base64,R0lGODlhIAAgALMAAAAAAP//////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAAIALAAAAAAgACAAQARoUMhJq71YgBCA52DYAVlpahx5Up/orXBsbS5GqzJe0Z3s/8CZTuIpDlc80JF3vCRDzVvQlooxjcnmdMvteoFa7gbXgoadohQWiqyhq6YnfDa3YbH03hel90pzfRNMPmVpI1t3e4qLXhEAOw==

观察发现，自动将内容进行一次base64，所以相应的只需要把svg直接返回，而不需要手动base64后返回，完整代码如下

  @Get('/avatar')
  @ContentType('image/svg+xml')
  async avatar(@Query('text') text: string) {
    const Identicons = require('@nimiq/identicons').default;
    //toDataUrl是转base64，svg是svg数据
    const base64 = await Identicons.svg(text || uuid());
    this.ctx.body = base64;
  }