网站安全检测内容(如何在小程序中对一段文本进行合法内容检测？)

　　网站安全检测内容(如何在小程序中对一段文本进行合法内容检测？)

　　前言

　　内容安全检测是每个小程序所有者都面临的“头痛”，从暂时无法访问，到永久禁​​止，甚至关闭一个小黑屋。本文将详细讲解如何在小程序中检查一段文本的合法内容，判断是否收录非法内容。

　　本文重点告诉你：

　　01.背景

　　无论是小程序，还是一些自研的类似社交的、具有用户生成内容的软件应用，如即时通讯、社区、论坛、音视频直播等，对于用户来说都是非常有必要的。访问内容安全检测。

　　对于小程序来说，这个审核很严格。重要的是要净化言行，做一个遵纪守法的人……

　　

　　访问内容安全检测，避免输入一些非法、低俗的内容，避免辛勤的应用。

　　恶意上传反动言论或上传部分违法内容（文字/图片/视频等），导致小程序或应用下架，或永久封禁，或个人和企业被*敏*感*词*打电话、约茶、等等。如果你不这样做，那是不值得的。

　　02.应用场景03. 解决方案围绕如何处理内容安全检测问题。一般有三种方法： 方案一****：引入第三方接口对内容进行验证（例如：百度AI内容审核平台、网易云盾等） 方案二：公司后端合作伙伴开发自己的文字、图片、音频、视频等内容审核接口 方案三：验证小程序服务器提供的API

　　每种方法都有自己的优点和缺点，如下图所示。

　　解决方案优缺点

　　1

　　引入第三方接口验证内容

　　前端同学只需根据官方第三方接口文档进行验证，无需后端干预，功能强大，覆盖面广

　　接口调用次数和收费有限制

　　2

　　公司后端合作伙伴自行开发文字、图片、音频、视频等内容审核接口。

　　后台合伙人自己造轮子，根据自己的业务需求和用户属性定制内容审核机制

　　开发周期长，成本高，难以全面覆盖

　　3

　　调用小程序服务器提供的内容安全API进行验证

　　简单高效

　　想不出来，因为比起前两种方案，对于不依赖后端接口的开发者来说，简直是帮了大忙。

　　在微信小程序生态中，官方提供了两条途径帮助用户解决内容检测问题，即

　　服务器开发模式相信大家都比较熟悉，这里不再赘述。接下来，我将重点介绍如何通过小程序·云开发的云功能来实现内容安全检测。

　　04. 通过云函数+云开发的request-promise第三方库实现内容请求验证

　　第一步：首先在小程序上布局：完成静态页面。（pages文件夹中的文件属于小程序的前端代码，每个文件夹目录代表一个模块和一个页面）

　　小程序前端wxml代码示例

　　

发布

　　小程序前端wxss代码示例

　　

/* pages/msgSecCheck/msgSecCheck.wxss */

.container {

padding: 20rpx;

}

.content {

width: 100%;

height: 360rpx;

box-sizing: border-box;

font-size: 32rpx;

border: 1px solid #ccc;

}

.footer {

width: 100%;

height: 80rpx;

line-height: 80rpx;

position: fixed;

bottom: 0;

box-sizing: border-box;

background: #34bfa3;

}

.send-btn {

width: 100% !important;

color: #fff;

font-size: 32rpx;

}

button {

width: 100%;

background: #34bfa3;

border-radius: 0rpx;

}

button::after {

border-radius: 0rpx !important;

}

　　经过wxml和wxss的编写，UI终于长成这样了

　　

　　第二步：完成小程序业务逻辑的处理

　　小程序端逻辑JS代码示例

　　

// pages/msgSecCheck/msgSecCheck.js

Page({

/**

* 页面的初始数据

*/

data: {

textareaVal: '' // 页面中需要显示的数据,初始化定义在data下面

},

/**

* 生命周期函数--*敏*感*词*页面加载

*/

onLoad: function (options) {

},

// *敏*感*词*表单时,数据有变化时

onInput(event) {

let textVal = event.detail.value;

this.setData({

textareaVal: textVal

})

},

// 聚焦焦点时

onFocus() {

console.log('聚焦焦点时');

},

// 失去焦点时

onBlur(event) {

console.log("失去焦点时");

// 前端可进行手动的弱校验,也可以在失去焦点时发送请求进行文本的校验,但是每次失去焦点就请求一次,这样是消耗云资源的,在发布时候与失去焦点做校验两者都可以

},

// 发布

send() {

console.log("触发发布按钮")

wx.cloud.callFunction({ // 请求msgSecCheck1云函数

name: 'msgSecCheck1',

data: {

content: this.data.textareaVal // 需要向云函数msgSecCheck1传入的值

}

}).then(res => { // 成功时的响应返回结果

console.log(res);

}).catch(err => { // 失败时,返回的结果

console.error(err);

})

}

})

　　第三步：服务器逻辑处理。在小程序云函数端创建云函数msgSecCheck1。您可以自定义名称并使其与小程序前端请求的名称保持一致。

　　

　　选择云功能，右键打开命令行终端安装request，request-promise，因为request-promise依赖request，两者都必须安装，最后一个关键是上传和部署。

　　

npm install request

npm install request-promise

　　如果在小程序端请求云功能时遇到类似如下错误，找不到xxx模块，先看错误码，然后在官方文档中查找错误码的含义

　　当我查看错误时，未找到该模块。查看云函数目录下的package.json，是否有安装错误提示的包。如果没有，只需安装它，并记住在每次更改后执行。上传和部署，也可以在云功能中选择文件增量上传

　　接下来是本文的重点内容！第四步：通过云功能+****request-promise实现内容安全检测

　　对于小程序开发，其实和web端开发类似。将事件绑定到元素，然后获取元素。只是小程序没有DOM和BOM这一套东西。它是一个数据驱动的视图，吸收了Angular、Vue、React各种框架的优点，形成了自己的一套规范。

　　如果你有这方面有开发经验的小伙伴，慢慢过渡到小程序开发，你会发现总会有惊人的相似之处。使用的语言都是JavaScript，但是和web开发还是有很多区别的。这里不会展开。

　　废话不多说，直接上代码：

　　小程序前端逻辑代码：

　　

// 点击发送按钮,对输入的文本内容进行校验

send() {

wx.cloud.callFunction({

name: 'msgSecCheck1', // 云函数的名称

data: { // 需要向云函数传递过去的数据

content: this.data.textareaVal // 具体要检测的内容

}

}).then(res => { // 成功时,做什么事情

console.log(res);

// 检测到文本成功时,做一些业务

}).catch(err => { // 失败时,做什么事情

// 失败时,也就是违规做一些用户提示,或者禁止下一步操作等之类的业务逻辑操作

console.error(err);

})

}

　　上面的代码还可以优化一下，就是把请求云函数的代码封装成一个函数。

　　如下图，不封装也可以，但是我习惯性的封装了。如果其他地方也用到了云函数，那就直接调用，避免写重复代码。

　　以下是将请求云功能的核心代码的一部分：

　　

// 发布

send() {

// 请求msgSecCheck1云函数,对文本内容进行校验

this._requestCloudMsgCheck();

},

_requestCloudMsgCheck() {

let textareaVal = this.data.textareaVal;

wx.cloud.callFunction({

name: 'msgSecCheck1',

data: {

content: textareaVal // 这里可以使用官方文档测试用例,特3456书yuuo莞6543李zxcz蒜7782法fgnv级

}

}).then(res => {

console.log(res);

// 检测到文本成功时,做一些业务

}).catch(err => {

// 失败时,也就是违规做一些用户提示,或者禁止下一步操作等之类的业务逻辑操作

console.error(err);

})

}

　　至于是在失去焦点事件还是点击发送按钮时发送请求，两种方式都可以。

　　还可以自定义文本验证，我个人认为在小终端中，当失去焦点时，可以自定义一些常规敏感词的弱验证，点击发送按钮时做强验证。

　　如果在失去焦点时立即发出请求，请求次数会增加，点击发送按钮时的验证可以在一定程度上减少小程序的频繁请求。

　　下一步是处理云功能端，使用request-promise请求微信内容安全接口的示例代码。

　　

/*

* Description: 利用第三方库request-promise请求微信内容安全接口

*

* 相关文档链接:

* 微信文本内容安全接口文档https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/sec-check/security.msgSecCheck.html

* access_token获取调用凭证文档

https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

*

* request-promise使用文档: https://github.com/request/request-promise

*

*/

const APPID = "wx21baa58c6180c2eb"; // 注意是你自己小程序的appid

const APPSECRET = ""; // 你自己小程序的appsecret

// 安全校验接口

const msgCheckURL = `https://api.weixin.qq.com/wxa/msg_sec_check?access_token=`;

// 向下面的这个地止发送请求,携带appid和appsecret参数,获取token认证

const tokenURL = `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${APPID}&secret=${APPSECRET}`

// 云函数入口文件

const cloud = require('wx-server-sdk')

cloud.init()

// 引入request-promise

const rp = require('request-promise');

// 云函数入口函数

exports.main = async(event, context) => {

try {

let tokenResponse = await rp(tokenURL);

// 获取token值,因为返回的结果是字符串,需要用JSON.parse转化为json对象

let getAccessToken = JSON.parse(tokenResponse).access_token;

// 请求微信内容安全接口,post请求,返回最终的校验结果

let checkResponse = await rp({

method: 'POST',

url: `${msgCheckURL}${getAccessToken}`,

body: {

content: event.content // 这里的event.content是小程序端传过来的值,content是要向内容接口校验的内容

},

json: true

})

return checkResponse;

} catch (err) {

console.error(err);

}

}

　　在小程序中输入文字，发送请求，在控制台下查看结果，功能没有问题。

　　

特3456书yuuo莞6543李zxcz蒜7782法fgnv级

完2347全dfji试3726测asad感3847知qwez到

　　可以根据官方文档提供的测试用例进行测试，查看具体返回结果。

　　

　　

　　（控制台错误代码）

　　

　　（合规内容）

　　云功能请求成功。查看错误信息的反馈。对于熟悉错误代码的人来说，很明显是文字违规，但是反馈不是很明显。也许我不知道这意味着什么。

　　第 5 步：正确处理错误代码

　　

　　它对于处理错误代码、返回特定和适当的信息、调试代码和故障排除也非常重要。

　　这些错误码的具体含义在官方文档中有说明，不用去记忆，查文档就行了。

　　面试中，很多面试官喜欢问http相关的状态码问题。状态码很多，实在想不起来了。但是，您仍然需要了解常见的错误 http 状态码。我想你确切地知道如何处理它们。只需检查文档。

　　真正测试背后的目的是根据后端返回的状态码判断接口哪里有问题，是前端问题还是后端问题。这是一个很常见的问题。

　　如果你说你不知道也没有处理过，那你肯定是不相信这个候选人的。无论是成功状态还是失败状态，都应该有相应的用户提示。

　　05.完整的文本安全验证示例代码

　　

/*

*

* 相关文档链接:

* 微信文本内容安全接口文档https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/sec-check/security.msgSecCheck.html

* access_token获取调用凭证文档

https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

*

* request-promise使用文档: https://github.com/request/request-promise

*

*/

const APPID = "wx21baa58c6180c2eb";

const APPSECRET = "";

const msgCheckURL = `https://api.weixin.qq.com/wxa/msg_sec_check?access_token=`;

// 向下面的这个地止发送请求,携带appid和appsecret参数,获取token认证

const tokenURL = `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${APPID}&secret=${APPSECRET}`

// 云函数入口文件

const cloud = require('wx-server-sdk')

cloud.init()

// 引入request-promise

const rp = require('request-promise');

// 云函数入口函数

exports.main = async(event, context) => {

try {

let tokenResponse = await rp(tokenURL);

// 获取token值,因为返回的结果是字符串,需要用JSON.parse转化为json对象

let getAccessToken = JSON.parse(tokenResponse).access_token;

// 请求微信内容安全接口,post请求,返回最终的校验结果

let checkResponse = await rp({

method: 'POST',

url: `${msgCheckURL}${getAccessToken}`,

body: {

content: event.content // 这里的event.content是小程序端传过来的值,content是要向内容接口校验的内容

},

json: true

})

// 有必要根据错误码,确定内容是否违规

if (checkResponse.errcode == 87014) {

return {

code: 500,

msg: "内容含有违法违规内容",

data: checkResponse

}

} else {

return {

code: 200,

msg: "内容OK",

data: checkResponse

}

}

} catch (err) {

if (err.errcode == 87014) {

return {

code: 500,

msg: '内容含有违法违规内容',

data: err

}

} else {

return {

code: 502,

msg: '调用msgCheckURL接口异常',

data: err

}

}

}

}

　　在云函数端，通过添加错误码来判断后，我们来看看小程序发送的请求和返回的结果。

　　

　　（这个和不加错误码的判断不同，有具体的错误提示内容）

　　至此，我们可以在小程序中根据返回的错误码或成功码进行一些业务逻辑处理，比如提示一些用户，在将数据插入数据库之前做一些判断操作，只有在内容为合规数据库，进入下一步的业务逻辑处理。

　　

_requestCloudMsgCheck() {

let textareaVal = this.data.textareaVal;

wx.cloud.callFunction({

name: 'msgSecCheck1',

data: {

content: textareaVal

}

}).then(res => {

console.log(res);

const errcode = res.result.data.errcode;

// 检测到文本错误时,做一些业务

if (87014 === errcode) {

wx.showToast({ // 当内容违规时,做一些用户提示

title: '您输入的文本内容含有敏感内容,请重新输入',

})

}else {

// 成功时做其他业务操作

}

}).catch(err => {

// 失败时,也就是违规做一些用户提示,或者禁止下一步操作等之类的业务逻辑操作

console.error(err);

})

}

　　

　　（当输入内容违反规则时，给予部分用户提示或阻止下一步操作等）

　　注意，无论是云函数（后端）端的错误码处理，还是小程序端的错误码处理，都需要处理。不要混淆两者。小程序端最终的业务逻辑判断是基于后端接口返回的状态。该怎么办。

　　至此，文本内容验证问题已经通过request-promise库完成。

　　这个请求，request-promise 库非常实用和强大。与这个库类似，common got、axios等，支持promise风格的处理方式也类似，可以去npm或者github阅读相关使用文档。

　　06. 结论

　　小程序中有很多解决方案。建议使用小程序请求云功能的云开发。不管你不使用云函数方法，你都有自己的后端服务。获取access_token应该从后端返回给前端。

　　小程序的秘钥AppSecret，不应该放在小程序端。这是不安全的。无论是服务器开发模式，还是小程序·云开发模式，都无法绕过后台对微信提供的内容安全接口的请求，然后返回给Mini终端。

　　其实在小程序云开发中，还提供了一个更方便的方法，那就是云调用，就是小程序云开发在云功能中调用微信开放接口的能力，只需简单的配置，一键即可。

　　限于篇幅，下一节将介绍。

　　参考：选项 1 参考链接：

　　微信内容安全：

　　云通话

　　#%E4%BA%91%E5%87%BD%E6%95%B0

　　百度文评

　　网易云盾