关于在midwayjs下如何返回svg

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

关于在midwayjs下如何返回svg  midway 坑 nodejs 处女作 第1张

但是框架是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;
  }


原文链接:,转发请注明来源!
「关于在midwayjs下如何返回svg」评论列表
捐卵联系方式
捐卵联系方式
发布于 2024-07-16 23:29:50  回复
识别码:zkainp27483FR-文章内容新颖,结构合理,流畅连贯,自然通达。http://lxtxsb.cn/
捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:30:29  回复
识别码:okznmv74539WE-文章开头没有衬托出人物心情。http://cehei.com.cn/
捐卵联系方式
捐卵联系方式
发布于 2024-07-16 23:35:12  回复
识别码:emfzia82169YL-文章融情于景,边绘景边抒情,善于运用打比方的手法,使文章生动具体http://www.lslczx.cn/
捐卵联系方式
捐卵联系方式
发布于 2024-07-16 23:47:23  回复
识别码:vyobxt42836HO-大量采用生活中的口语,使文章更显自然亲切。http://www.kyjscl.cn/
捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:48:03  回复
识别码:ijwtya67214KH-内容多为线条式勾勒,缺乏点式的细描。http://www.new-boat.cn/
捐卵联系方式捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:48:43  回复
识别码:zomafj62735QR-文中描绘的清新活泼,欢快明朗字里行间跳动着的童心,使文章也有了生命力http://nn2e9.cn/
捐卵联系方式捐卵联系方式捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:49:23  回复
识别码:extiyd36987SQ-作为随感你的文章文思敏捷,意愿纷呈,字里行间流露出的人生体验的丰富和思想感情的细腻,让老师感到惊讶希望你再接再厉http://www.nq4l9.cn/
捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:52:35  回复
识别码:buljdm46093XL-字里行间缺少一丝生活气息和情趣。http://www.xtfexmc.cn/
捐卵联系方式捐卵联系方式捐卵联系方式
捐卵联系方式捐卵联系方式捐卵联系方式
发布于 2024-07-16 23:53:16  回复
识别码:otngrd69347UG-文章语言通俗易懂贴近生活实际读来令人倍感亲切。以轻松愉快的语气向我们娓娓道来令人回味无穷。http://tcsqb.cn/
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-07-20 16:30:00  回复
识别码:nfoklg83546RV-文章写的真不错https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-07-20 16:32:18  回复
识别码:afsqkg43519WO-文章写的真不错https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-07-24 20:03:42  回复
识别码:wqzmoa51926VT-哇啊啊啊,不错啊https://www.jiwenlaw.com
1
1
发布于 2024-07-24 21:30:00  回复
识别码:bdqpyv83049YX-文章写的真不错http://www.qmnkj.com
法务时刻
法务时刻
发布于 2024-07-24 23:14:00  回复
识别码:xgbmkl78435XU-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-15 18:55:25  回复
识别码:wbuezd17638CR-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-08-15 18:56:00  回复
识别码:xfqwyl56241CO-文章写的真不错https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-08-15 20:51:42  回复
识别码:kwnzqi81932JA-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-15 20:58:31  回复
识别码:oajfpw01893GZ-文章写的真不错https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-08-15 20:59:06  回复
识别码:azsuxe38072GE-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-15 21:00:03  回复
识别码:uvkxmo57198UW-文章写的真不错https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-16 19:45:09  回复
识别码:dsrvuz67831XW-写的实在太好了https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-08-16 19:53:23  回复
识别码:rudlva10387KA-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-16 20:22:31  回复
识别码:rpjhvo17925ON-文章写的真不错https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-16 20:25:06  回复
识别码:lvrfat60512WN-写的实在太好了https://www.jiwenlaw.com
法务时刻
法务时刻
发布于 2024-08-17 15:54:45  回复
识别码:ytnmlr40761RB-哇啊啊啊,不错啊https://www.jiwenlaw.com
法务时刻法务时刻
法务时刻法务时刻
发布于 2024-08-17 16:16:03  回复
识别码:ythdzn48169ZB-写的实在太好了https://www.jiwenlaw.com

发表评论