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


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 相关文章推荐
jQuery 获取URL参数的插件
Mar 04 Javascript
可在线编辑网页文字效果代码(单击)
Mar 02 Javascript
getAsDataURL在Firefox7.0下无法预览本地图片的解决方法
Nov 15 Javascript
node.js Web应用框架Express入门指南
May 28 Javascript
AngularJS实现分页显示数据库信息
Jul 01 Javascript
jquery实现图片列表鼠标移入微动
Dec 01 Javascript
web打印小结
Jan 11 Javascript
漂亮实用的页面loading(加载)封装代码
Feb 03 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
微信小程序实现页面跳转传递参数(实体,对象)
Aug 12 Javascript
LayUI数据接口返回实体封装的例子
Sep 12 Javascript
Vue左滑组件slider使用详解
Aug 21 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
农民C键的运用技巧
2020/03/04 星际争霸
探讨捕获php错误信息方法的详解
2013/06/09 PHP
MyEclipse常用配置图文教程
2014/09/11 PHP
CI框架中数据库操作函数$this-&gt;db-&gt;where()相关用法总结
2016/05/17 PHP
PHP模块化安装教程
2016/06/01 PHP
iOS+PHP注册登录系统 PHP部分(上)
2016/12/26 PHP
php使用fputcsv实现大数据的导出操作详解
2020/02/27 PHP
基于Asp.net与Javascript控制的日期控件
2010/05/22 Javascript
jQuery bind事件使用详解
2011/05/05 Javascript
用js获取电脑信息(是使用与IE浏览器)
2013/01/15 Javascript
JS+CSS实现的漂亮渐变背景特效代码(6个渐变效果)
2016/03/25 Javascript
AngularJS优雅的自定义指令
2016/07/01 Javascript
[02:22:36]《加油!DOTA》总决赛
2014/09/19 DOTA
[02:42]岂曰无衣,与子同袍!DOTA2致敬每一位守护人
2020/02/17 DOTA
Python下的subprocess模块的入门指引
2015/04/16 Python
python中__slots__用法实例
2015/06/04 Python
用Python一键搭建Http服务器的方法
2018/06/01 Python
利用pandas将numpy数组导出生成excel的实例
2018/06/14 Python
Python批量删除只保留最近几天table的代码实例
2019/04/01 Python
Python深拷贝与浅拷贝用法实例分析
2019/05/05 Python
python实现XML解析的方法解析
2019/11/16 Python
Django DRF认证组件流程实现原理详解
2020/08/17 Python
一文读懂python Scrapy爬虫框架
2021/02/24 Python
python 制作本地应用搜索工具
2021/02/27 Python
HTML5图片预览实例分享
2014/06/04 HTML / CSS
Timberland法国官网:购买靴子、鞋子、衣服、夹克和配饰
2019/11/30 全球购物
Ibatis中如何提高SQL Map的性能
2013/05/11 面试题
为什么要做架构设计
2015/07/08 面试题
实习单位评语
2014/04/26 职场文书
数控专业毕业生求职信
2014/06/12 职场文书
开展党的群众路线教育实践活动总结报告
2014/10/31 职场文书
一年级数学上册复习计划
2015/01/17 职场文书
关于食品安全的演讲稿范文(三篇)
2019/10/21 职场文书
《卧薪尝胆》读后感3篇
2019/12/26 职场文书
分析mysql中一条SQL查询语句是如何执行的
2021/06/21 MySQL
python代码实现扫码关注公众号登录的实战
2021/11/01 Python