留言业务语法说明

更新时间：2019-12-10

一、留言

留言只能在文章模型中使用。

1.使用步骤：

在文章模型详情页配置留言表单代码，后台开启留言业务后可正常使用。后台关闭时，前台提交留言表单失败。

2.在留言表单中，选择提交验证的方式。支持图片验证码、短信、关闭验证。

3.根据选择的验证的方式，文章模型详情页配置留言表单代码。

①验证码验证，使用示例：

<form action="/addmessage.html" method="post">
姓名:<input type="text" name="name" placeholder="请输入称呼"><br>
手机:<input type="text" name="tel" placeholder="请输入手机号码"><br>
内容：<input type="textarea" name="content" placeholder="请输入内容"></p> <br>
<input type="hidden" name="id" value="{{Pageinfo['_id']}}"><br>
<input type="hidden" name="hashid" value="5c2579d72f03b967b908f924">
<input type="hidden" name="moduletype" value="{{globalviewdata['model']}}"><br>
<input type="hidden" name="basetype" value="{{globalviewdata['basetype']}}"> <div>
<label>完成验证：</label> <div class="captcha">
<div class="text"> 行为验证™ 安全组件加载中 </div>
<div class="show wait">
<div class="loading">
<div class="loading-dot"></div>
<div class="loading-dot"></div>
<div class="loading-dot"></div>
<div class="loading-dot"></div>
</div> </div> </div> </div>
<input type="submit" value="提交"></form>
<script src="//static.westarcloud.com/test/5c048df6a8497e03aa0665a0/js/jquery1.11.3.min.js"></script>
<script src="https://www.geetest.com/demo/libs/gt.js"></script>

②手机验证，使用示例：

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Document</title>
</head>
<body>
 <style>
 .send{height: 30px;background-color: #fff;}
 </style> 
 <script src="//www.geetest.com/demo/libs/gt.js"></script>
 <script src="//static.westarcloud.com/test/5c048df6a8497e03aa0665a0/js/jquery1.11.3.min.js"></script> 
 <form action="/addmessage.html" method="post" id="form2">
 <h3>需要短信验证码DEMO</h3>
 <div>
 <div>称呼:</div><input type="text" name="name" placeholder="请输入称呼"> 
 </div>
 <div>
 <div class="label">手机:</div><input type="text" name="tel" placeholder="请输入手机号码"> 
 <button class="send" data-url="/sendsmscode.html">获取验证码</button>
 </div>
 <div>
 <div>验证码:</div><input type="text" name="code" placeholder="请输入验证码">
 </div>
 <div>
 <div> 内容:</div> <input type="text" name="content" placeholder="请输入回复内容">
 </div>
 <input type="hidden" name="id" value="5d033cda4db67f1a193df39b">
 <input type="hidden" name="hashid" value="5c26c80d4db67f32c02f6214">
 <input type="hidden" name="moduletype" value="products">
 <br>
 <input type="hidden" name="basetype" value="products">
 <div>
 <label>完成验证：</label>
 <div class="captcha">
 <div class="text">
 行为验证™ 安全组件加载中
 </div>
 <div class="show wait">
 <div class="loading">
 <div class="loading-dot"></div>
 <div class="loading-dot"></div>
 <div class="loading-dot"></div>
 <div class="loading-dot"></div>
 </div>
 </div>
 </div>
 </div>
 <input type="submit" value="提交">
 </form>
 <script>
 function GeTest(opt) {
 this.form = $(opt.formId);
 this.keyBox = this.form.find('.captcha');
 this.sendMsg = opt.sendMsg || false;
 this.captchaObj = '';
 this.getKey();
 var that = this;
 this.form.on('click', '.send', function (e) {
 e.preventDefault();
 if (that.sendMsg) {
 that.getMsg();
 }
 else {
 alert('没有短信配置发送短信无效')
 }
 })
 }

 //默认处理函数

 GeTest.prototype.getKey = function () {
 var that = this;
 function handler(captchaObj) {
 that.captchaObj = captchaObj;
 captchaObj.appendTo(that.keyBox);
 captchaObj.onReady(function () {
 that.form.find(".wait").hide();
 });
 }
 $.ajax({
 url: "/front/interface/geetest?t=" + (new Date()).getTime(), // 加随机数防止缓存
 type: "get",
 dataType: "json",
 success: function (data) {
 that.form.find('.text').hide();
 that.form.find('.wait').show();
 initGeetest({
 gt: data.gt,
 challenge: data.challenge,
 offline: !data.success, // 表示用户后台检测极验服务器是否宕机
 new_captcha: data.new_captcha, // 用于宕机时表示是新验证码的宕机
 product: "float", // 产品形式，包括：float，popup
 width: "300px"
 }, handler);
 }
 });
 }
 //发送短信函数
 GeTest.prototype.getMsg = function () {
 var that = this;
 if(that.form.find('input[name="tel"]').val()=='')
 {
 return alert('手机号表单不能为空');
 }
 var result = that.captchaObj.getValidate()
 if(!result)
 {
 return alert('验证尚未通过，需通过验证后才能下发短信');
 }
 $.ajax({
 url: '/sendsmscode.html',
 type: 'POST',
 dataType: 'json',
 data: {
 mobile: that.form.find('input[name="tel"]').val(),
 geetest_challenge: result.geetest_challenge,
 geetest_validate: result.geetest_validate,
 geetest_seccode: result.geetest_seccode
 },
 success: function (res) {
 let data=typeof res=='object'?res:JSON.parse(res);
 if (data.status === true) {
 alert('发送短信成功');
 } else if (data.status === false) {
 alert('验证失败:'+data.msg);
 that.captchaObj.reset();
 }
 }
 });
 }
 </script>
 <script>
 //发送短信
 new GeTest({
 formId: '#form2',
 sendMsg:true
 })
 </script>
<script>siteConfig={"siteid":"5be9228ca624633f0d1beeb6"}</script>
<script charset="utf-8" src="https://5tongji.westarcloud.com/static/js/main_min.js"></script>
</body>
</html>

③关闭验证，使用示例：

<form method="POST" action="/addmessage.html">
<input type="text" name="name"  placeholder="称呼1" >     //表单字段
<input type="text" name="tel"   placeholder="手机" required></div>    //表单字段
<textarea  name="content" ></textarea> //表单字段
<input class="token" type="hidden" id="token" name="csrftokenname" value="csrftokenvalue">      //固定token   
<input type="hidden"  name="hashid" value="5c1af3d32f03b908fa460c14">   //表单id
<input type="hidden"  name="id" value="{{ Pageinfo['_id'] }}">
<button type="submit" class="btn btn-default">提交</button>     //当前内容id，凭id获取内容标题
</form>

上一篇：自定义表单语法说明下一篇：渠道申请语法说明