背景说明
今天在微信群里有个朋友问,关于咨询漫画风功能,目前在腾讯和百度开始了试用漫画风,想到前些日子我做过一个imagex的功能测试,发现也有漫画风功能,所以这里记录一下我是如何使用漫画风功能的;
几个概念:
discuzQ:这个是腾讯推出的一个开源的社区工具平行于discuz的一款社区开源工具,本次说明就是针对在discuzq如何启用这个功能;
imagex:这个是火山引擎这个产品下的一款专业的图像处理服务,细节可以参考这个帖子(高效的图像处理图片压缩测试-ImageX ),测试过程发现过他们有这个漫画风格功能;
方案设计
讲述完背景之后,先说说,discuz 是如何访问图像的;
- 未开启COS存储之前,访问路径是互联网用户直接访问discuz的源站,
- 这个方案的问题:速度比较慢,访问量比较高会很卡这个也不是官方推荐的最佳方案;

- 开启了COS存储之后,实际上,上传和访问还是经过了源站服务器返回数据,但是在访问的路径上,也就是如下的①和②环节,直接经过了CDN访问到COS存储上的数据;(这里我做过测试,上传一个文件是先到服务器,再通过服务器上传到COS,至少截止到今天暂时没有互联网用户直接传到存储)
- 这个方案是官方比较推荐的方案,访问速度快,不占用源站服务器的空间,但是想拓展一些功能不是很友好

- 开启了COS存储之后,巧用ImageX的一些功能实现一些高级图像处理和效果,访问路径设计如下,可以优雅地借助imagex自带的CDN+存储+图像处理,以及自带的镜像回源能力让用户访问的时候,通过1访问到imagex即可;

- 这个方案好处,目前ImageX官方上显示每月有10G存储+10G流量,同时图像基本处理按照之前的效果不错;重点是,想使用的漫画风格的一些图像增值处理可以串联起来;按照目前的网站用量和刚起步来看完全够用了;
开始配置
能看到这个方案其实存在一个小依赖,我们先把需要做的事情和准备做一下:总结起来看起来有三个环节,COS配置好、ImageX配置好、discuzQ配置好,主要是这三个配置就可以了;下面开始配置:本文重点会讲解在 imagex 和dscuzq如何配置,COS配置相信大家都会用
COS配置,这里参考官网给的要求进行配置,需要注意下面几个点:

需要记住图片中的这个 源站域名这个位置,因为这个在imagex要让imagex 镜像回源时候填写的目的地;
ImageX配置(https://console.volcengine.cn/imagex/service_manage/),imageX的初始配置相对来讲步骤会比较多,但不复杂,首先需要解决好实名认证、充值个10块钱等(为什么要充值钱,主要是防止用量超额后可以防止被关停,提前充值几块钱或者根据自己的网站实际使用情况来评估)
规划:按照上面方案,我们需要规划一个独立域名用来访问图片和附件的资源,这里我以:imagex.75live.com 为规划域名(你也可以用static.xxxx.com 或者 imagex.xxx.com 类似这样的格式,记住,千万不能提交 www.xxx.com 因为www是你的网站访问数据的域名,用途最好区分);
开始配置:创建服务,这里服务名称不随便写,主要是一个标记、域名填写 上面规划域名,imagex.75live.com

等待审核:官方人员上班的时候,应该 1天左右就审核通过了,还是比较快的,审核通过后去配置镜像回源;(选中你的服务--基础配置)

一定要注意这个两个位置,上面我截图说明了,镜像源站,填写 COS的地址:
我这里是:75live-1251152306.file.myqcloud.com 记得,header 填写:host 只是 75live-1251152306.file.myqcloud.com ,这里两处需要填写,填写完保存就可以了;

做dns解析,到dnspod (DNS服务商,我用的dnspod)上将imagex.75live.com 指向分配的cname,类似CDN的操作;

配置模板,配置模板才能打开我想用的漫画风格(找不到漫画风格的功能配置,就去附加组件开启一下)
这里计划配置两种,效果1,全景漫画风;效果2,只保留人脸效果的漫画风;
效果1配置

配置完毕之后,去 模板配置中可以看到这样的配置:~tplv-n9b2vwdhz3-conic-v1:resizeWidth:resizeHeight.awebp (resizeWidth:resizeHeight 是参数)
效果2配置:

配置完毕之后,去 模板配置中可以看到这样的配置 ~tplv-n9b2vwdhz3-face-conic-v1:smartv2_width:smartv2_height.jpeg (smartv2_width:smartv2_height是参数,参数的意思是,这个数值可以变,比如 :~tplv-n9b2vwdhz3-face-conic-v1:300:0.jpeg,300:0可以替换成其他数字代表宽高)
DiscuzQ的配置分两块
- 后台开启存储

- 代码文件替换:
代码文件是:/app/Api/Serializer/AttachmentSerializer.php 的 99---116行,参考如下注释替换一下,每个人替换每个人的;(替换之前做好备份)