糖醋陈皮的博客

2018-11-4 微信小程序-"内容安全"示例代码

Cheng Zheng -

这篇文讲什么

如何实现微信开发者的内容安全接口（图片）
内容安全是这个：https://developers.weixin.qq.com/miniprogram/dev/api/open-api/sec-check/imgSecCheck.html

这篇文对谁有用

微信小程序开发者

这篇文有什么用

可以复制示例代码，节省开发时间（预计节省至少4个小时）
代码有小程序代码 + 后端代码(Ruby on Rails)

解决什么业务需求

在我们的小程序中，用户在3个地方可以上传图片

  1. 头像
  2. 文章题图
  3. 文章内容图
    这3个地方都需要内容检查，避免用户上传违法违规图片。

代码！

小程序代码:
https://gist.github.com/1c7/3a0b9182ec1c1a07506354f653c8b4c2
后端代码在评论区里

注意：代码中用了一个第三方的七牛上传工具：
https://github.com/gpake/qiniu-wxapp-sdk

整体思路

  1. 先上传图片到七牛。因为微信小程序里压缩图片比较麻烦，我们利用七牛来压缩
  2. 拼接出如下格式的地址，让七牛来缩放图片到符合微信标准(750x1344以下)
var link = 'https://img.wittcism.com/' + res.qiniu_url + '?imageView2/2/w/740/h/1324';

注意这里要根据你的情况进行修改，不能直接用 'https://img.wittcism.com/'

  1. 把 url 发给后端（自己的后端）
  2. 让后端自己从 url 把图片下载下来，发给微信的内容检查接口（access_token + media 字段的文件）
  3. 拿到微信返回的结果，比如 {"errcode":0,"errmsg":"ok"} 直接返回给客户端

总结

  1. 传给七牛用七牛做图片的大小裁剪
  2. 把七牛图片URL传给后端，后端负责做中转，小程序 -> 后端 -> 微信内容检查接口。
    然后 微信内容检查接口 -> 后端 -> 小程序。

注意！

请不要直接在微信小程序里传给微信内容检查接口。
因为那个接口是 api.weixin.qq.com
这个地址是不允许直接在微信小程序里直接 wx.uploadFile 的。

踩坑血泪史：我因为在微信开发者工具里勾选了，
"不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书"

所以直接这样用是可以的（坑来了）
结果到了真机的时候才发现了这个问题。当然只能改代码，发给自己的后端让自己的后端来传。

浪费了俩小时

全文完

感谢阅读