微信小程序上传帖子的实例代码(含有文字图片的微信验证)


Posted in Javascript onJuly 11, 2020

微信小程序上传帖子的实例代码(含有文字图片的微信验证)

public.js

var graceJS = require('../../utils/grace.js');
import { config } from '../../config.js'
Page({

 /**
 * 页面的初始数据
 */
 data: {
 imglist: [],
 title:'',
 content:'',

 },

 delImg(e) {
 let index = e.currentTarget.dataset.index;
 let array = [];
 console.log(index);
 for (var i = 0; i < this.data.imglist.length; i++) {
  if (i !== index) {
  array.push(this.data.imglist[i])
  }
 }
 console.log(array);
 this.setData({
  imglist: array,
 })
 },

 upimg() {
 let that = this
 var url = config.api_base_url + "upload_pic"
 wx.chooseImage({
  count: 1,
  sizeType: ['original', 'compressed'],
  sourceType: ['album', 'camera'],
  success(res) {
  const tempFilePaths = res.tempFilePaths;
  wx.showLoading({
   title: '上传中',
  })
  wx.uploadFile({
   url,
   filePath: tempFilePaths[0],
   name: 'file',
   success(res) {
   console.log(res.data);
   wx.hideLoading()
   if (res.data == '0') {
    graceJS.msg('上传失败');
   }else{
    console.log(res.data)
    if (res.data.indexOf("非法图片")>=0){
    graceJS.msg(res.data);
    } else {
    graceJS.msg("上传成功");
    var array = that.data.imglist.concat(res.data)
    that.setData({
     imglist: array,
    })
    }
   }
   
   }
  })

  }
 })
 },
 zf_title:function(e){
 this.setData({
  title: e.detail.value
 })
 },
 zf_content: function (e) {
 this.setData({
  content: e.detail.value
 })
 },
 tj_info: function (event){
 var that = this;
 console.log("event", event)
 var title = this.data.title;
 var content = this.data.content;
 console.log(title)
 console.log(content)
 var imglist = that.data.imglist;
 var uid = wx.getStorageSync('user').id
 if (!title && !content) {
  graceJS.msg("请填写完整");
 } else {
  //写入数据库
  if (uid != undefined) {
  graceJS.post(
   config.api_base_url + 'tiezi_add',
   {title:title, content:content,uid:uid,imglist:imglist}, 
   'json',
   {}, // 此处 {} 代表不设置 header 数据
   function(res){
   if (res.result == 1) {
    graceJS.msg(res.msg);
    setTimeout(()=>{
    graceJS.navigate('../discover/discover','switchTab');
    },2000)
   }else{
    graceJS.msg(res.msg);
   }
   }
  );
  }else{
  graceJS.msg("用户ID获取失败");
  }
  
 }
 },

 /**
 * 生命周期函数--监听页面加载
 */
 onLoad: function (options) {

 },

 /**
 * 生命周期函数--监听页面初次渲染完成
 */
 onReady: function () {

 },

 /**
 * 生命周期函数--监听页面显示
 */
 onShow: function () {

 },

 /**
 * 生命周期函数--监听页面隐藏
 */
 onHide: function () {

 },

 /**
 * 生命周期函数--监听页面卸载
 */
 onUnload: function () {

 },

 /**
 * 页面相关事件处理函数--监听用户下拉动作
 */
 onPullDownRefresh: function () {

 },

 /**
 * 页面上拉触底事件的处理函数
 */
 onReachBottom: function () {

 },

 /**
 * 用户点击右上角分享
 */
 onShareAppMessage: function () {

 }
})

publish.wxml

<!--pages/publish/publish.wxml-->
<view>
 <form > 
		<view class="publish_a">
			<view class="publish_a1">
				<view class="publish_a1_a">
					<input type="text" name="title" bindinput="zf_title" placeholder="输入标题" />
				</view>
				<view class="publish_a1_b">
					<textarea name="content" bindinput="zf_content" placeholder="输入内容文字"></textarea>
				</view>
				<view class="publish_a1_c">
					<view class="publish_a1_c1" >
						<image src="../../img/127.png" bindtap="upimg"></image>
					</view>
					<view class="publish_a1_c2">
						<view wx:for="{{imglist}}" bindtap="delImg" data-index="{{index}}">
							<image src="{{item}}" ></image>
							<text>X</text>
						</view>
					</view>
				</view>
			</view>
		</view>
 	<view class="publish_b" bind:tap="tj_info">发布帖子</view>
	</form>
</view>

publish.wxss

/* pages/publish/publish.wxss */
page{
	padding-bottom: 120rpx;
}
.publish_a{
	padding: 20rpx;
}
.publish_a1{
	background-color: #f5f2f4;
	padding: 20rpx;
}
.publish_a1_a input{
	width: 100%;
	height: 80rpx;
	line-height: 80rpx;
	font-size: 28rpx;
	font-weight: bold;
}
.publish_a1_b textarea{
	width: 100%;
	font-size: 28rpx;
}
.publish_a1_c1{
	margin-bottom: 20rpx;
}
.publish_a1_c1 image{
	display: block;
	width: 200rpx;
	height: 200rpx;
}
.publish_a1_c2{
	display: flex;
	flex-wrap: wrap;
}
.publish_a1_c2 view{
	position: relative;
	width: 200rpx;
	height: 200rpx;
	margin-right: 20rpx;
	margin-bottom: 20rpx;
}
.publish_a1_c2 image{
	display: block;
	width: 100%;
	height: 100%;
}
.publish_a1_c2 text{
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	width: 40rpx;
	height: 40rpx;
	text-align: center;
	line-height: 40rpx;
	font-size: 26rpx;
	color: #fff;
	background-color: rgba(0,0,0,0.3);
}

.zf_btn{
 width: 500px;
}
.publish_b{
	position: fixed;
	left: 0;
	bottom: 0;
	/* width: 100%; */
	background-color: #a67f4a;
	line-height: 100rpx;
	text-align: center;
	color: #fff;
	font-size: 30rpx;
	min-width: 380px;
 width: 100%;
 padding: 0;
 margin: 0;
}

tp

引入
use EasyWeChat\Factory;

public function __construct ( Request $request = null )
 {
  $this->config = [
   'app_id' => 'wx4**********fd45a65',
   'secret' => '082dec1****5b93d286c093e01',
   'response_type' => 'array',
   'log' => [
    'level' => 'debug',
    'file' => __DIR__.'/log/wechat.log',
   ],
  ];
  $this->uid = '';
 }

public function tiezi_add(){
  $data = input('post.');
  if($data['imglist']!=[]){
   foreach ($data['imglist'] as $k => $vo) {
    $data['imglist'][$k] = trim($vo);
   }
   $data['album'] = trim(implode(',', $data['imglist']));
  }
  unset($data['imglist']);

  $data['cid'] = 17;
  $data['status'] = 1;
  $data['sort'] = 0;
  $data['ctime'] = time();
  if(!isset($data['album'])){
   return jserror('至少上传一张图片 ');
  } 
  //验证
 		$miniProgram = Factory::miniProgram($this->config);
 		$result = $miniProgram->content_security->checkText($data['content']);
 		$result2 = $miniProgram->content_security->checkText($data['title']);
 		if($result['errcode']!='0'){
 			return jserror('含有非法关键词');
 		}
 		if($result2['errcode']!='0'){
 			return jserror('含有非法关键词');
 		}

  //保存
  $res = Db::name('post')->insert($data);
  if($res){
   return jssuccess('发布成功');
  }else{
   return jserror('发布失败');
  }
 }
 
public function upload_pic(){
  $file = request()->file('file');
  $info = $file->validate(['ext'=>config()['web']['file_ext']])->move('./public/upload/admin/file');
  $getSaveName = str_replace('\\', '/', $info->getSaveName());//win下反斜杠替换成斜杠
  $msg = 'http://'.$_SERVER['SERVER_NAME'].'/public/upload/admin/file/'.$getSaveName;
   if(is_file('./public/upload/admin/file/'.$getSaveName)){
   //验证图片
   $miniProgram = Factory::miniProgram($this->config);
   $result = $miniProgram->content_security->checkImage('./public/upload/admin/file/'.$getSaveName);
   if($result['errcode']!='0'){
    return '非法图片';
   }else{
    return $msg;
   }
   ################
  }else{
   return '0';
  }
  
 }

到此这篇关于小程序上传帖子(含有文字图片的微信验证)的文章就介绍到这了,更多相关小程序上传帖子内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
如何让DIV可编辑、可拖动示例代码
Sep 18 Javascript
js中for in的用法示例解析
Dec 25 Javascript
js报$ is not a function 的问题的解决方法
Jan 20 Javascript
IE浏览器中图片onload事件无效的解决方法
Apr 29 Javascript
jQuery异步验证用户名是否存在示例代码
May 21 Javascript
H5移动端适配 Flexible方案
Oct 24 Javascript
Canvas 绘制粒子动画背景
Feb 15 Javascript
js指定步长实现单方向匀速运动
Jul 17 Javascript
使用angular-cli webpack创建多个包的方法
Oct 16 Javascript
vant(ZanUi)结合async-validator实现表单验证的方法
Dec 06 Javascript
vue 详情跳转至列表页实现列表页缓存
Mar 27 Javascript
基于vue框架手写一个notify插件实现通知功能的方法
Mar 31 Javascript
详解JavaScript匿名函数和闭包
Jul 10 #Javascript
Vue watch响应数据实现方法解析
Jul 10 #Javascript
详解Vue之事件处理
Jul 10 #Javascript
jQuery开发仿QQ版音乐播放器
Jul 10 #jQuery
Element图表初始大小及窗口自适应实现
Jul 10 #Javascript
Vue路由切换页面不更新问题解决方案
Jul 10 #Javascript
简单了解Vue computed属性及watch区别
Jul 10 #Javascript
You might like
如何在PHP中使用Oracle数据库(3)
2006/10/09 PHP
QueryPath PHP 中的jQuery
2010/04/11 PHP
发款php蜘蛛统计插件只要有mysql就可用
2010/10/12 PHP
php+ajax实现无刷新分页的方法
2014/11/04 PHP
CentOS6.5 编译安装lnmp环境
2014/12/21 PHP
thinkphp3.x中cookie方法的用法分析
2016/05/19 PHP
PHP new static 和 new self详解
2017/02/19 PHP
浅谈PHP中pack、unpack的详细用法
2018/03/12 PHP
Jquery实现仿新浪微博获取文本框能输入的字数代码
2013/02/22 Javascript
jquery队列queue与原生模仿其实现方法分享
2014/03/25 Javascript
Javascript 读取操作Sql中的Xml字段
2014/10/09 Javascript
Javascript实现Web颜色值转换
2015/02/05 Javascript
jquery实现简单实用的弹出层效果代码
2015/10/15 Javascript
详解JavaScript基于面向对象之创建对象(1)
2015/12/10 Javascript
jQuery实现的分子运动小球碰撞效果
2016/01/27 Javascript
深入探秘jquery瀑布流的实现
2016/01/30 Javascript
AngularJS  ng-table插件设置排序
2016/09/21 Javascript
jQuery实现弹出窗口弹出div层的实例代码
2017/01/09 Javascript
jQuery Masonry瀑布流插件使用方法详解
2017/01/18 Javascript
Vuejs+vue-router打包+Nginx配置的实例
2018/09/20 Javascript
详解vue父子组件关于模态框状态的绑定方案
2019/06/05 Javascript
一篇文章带你从零快速上手Rollup
2020/09/07 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
2020/11/04 Javascript
[14:20]刀塔大凶女神互压各路奇葩屌丝
2014/05/16 DOTA
[02:15]2015国际邀请赛选手档案IG.Ferrari 430
2015/07/30 DOTA
[02:00]DAC2018主宣传片——龙征四海,剑问东方
2018/03/20 DOTA
[01:09:50]VP vs Pain 2018国际邀请赛小组赛BO2 第二场
2018/08/20 DOTA
浅谈Python 字符串格式化输出(format/printf)
2016/07/21 Python
python每5分钟从kafka中提取数据的例子
2019/12/23 Python
Python实现分数序列求和
2020/02/25 Python
Python文件操作及内置函数flush原理解析
2020/10/13 Python
舞会礼服和舞会鞋:PromGirl
2019/04/22 全球购物
聘任书模板
2014/03/29 职场文书
奶茶店创业计划书
2014/08/14 职场文书
Python破解极验滑动验证码详细步骤
2021/05/21 Python
Win11运行育碧游戏总是崩溃怎么办 win11玩育碧游戏出现性能崩溃的解决办法
2022/04/06 数码科技