微信小程序调用PHP后台接口 解析纯html文本


Posted in Javascript onJune 13, 2017

微信小程序调用PHP后台接口,解析纯html文本,效果图片预览 

微信小程序调用PHP后台接口 解析纯html文本

1、微信js动态传参:

wx.request({
  url: 'https://m.****.com/index.php/Home/Xiaoxxf/activity_detail?a_id='+options.id,//含富文本html
  data: {
   is_detail:1
  },
  method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
  header: {
   'Content-Type': 'application/json'
  },
  success: function (res) {
   that.setData({
   Article: res.data //一维数组json编码后对象
   })
   
  /**
   * html解析
  */ 
   var article = that.data.Article;
  console.log("article = " + article);
   WxParse.wxParse('article', 'html', article, that, 5);
   console.log(res.data);
  },
  fail: function (res) { },
  complete: function (res) { },
  }),

其中,options.id是由前一个wxml页面动态传过来的参数。

2、wxParse插件使用:

github地址: https://github.com/icindy/wxParse,版本0.2
解决问题:微信小程序富文本html、md解析组件

1)复制wxParse文件夹到pages同目录
2)在wxml页面引入模板代码:

<import src="../../wxParse/wxParse.wxml"/>
<!--这里可以添加其他的任何wxml代码-->

富文本html框内容:<template is="wxParse" data="{{wxParseData:article.nodes}}"/>

3)在js的page({})里面引入执行文件

// 引入wxParse.js解析文件
var WxParse = require('../../wxParse/wxParse.js');
page({...})

4)在js文件里面解析获取的纯html字符串,注意:这里必须得是字符串(如:'<div>2112</div>'),如果有'\'就要去掉。
示例代码:

wx.request({
  url: 'https://m.*****.com/index.php/Home/Xiaoxxf/activity_detail?a_id='+options.id,//含富文本html
  data: {
   is_detail:1
  },
  method: 'GET', 
  header: {
   'Content-Type': 'application/json'
  },
  success: function (res) {
   that.setData({
   Article: res.data //一维数组json编码后对象,全部数据
   })

  /**
   * html解析
  */ 
   var article = that.data.Article;
  console.log("article = " + article);
   WxParse.wxParse('article', 'html', article, that, 5);
   console.log(res.data);
  },
  fail: function (res) { },
  complete: function (res) { },
  })

3、PHP后台接口(本接口仅做示例,未做安全和过滤校验):

public function activity_detail(){
  $is_detail = I('is_detail');
  if(!empty($is_detail)){   //富文本html文章
   $a_id = I('a_id');
   $a_id = intval($a_id)?$a_id:0;
   if(empty($a_id)){
    $data['code'] = 500;
    $data['msg'] = '抱歉,文章已失效';
    echo json_encode($data);
   }else{
    /* php方法:stripslashes() 将html文章去掉json转移字符\ --xzz0608*/
    //获取结果为指定字段的二维数组,下面截取一维数组
    $data =D()->query("select act_detail from xxf_witkey_activity where is_show = 1 and a_id = ".$a_id." order by a_id desc");
    //var_dump($data);return ;
    $data = $data[0];
    $data = stripslashes(implode(',', $data));
    $data = str_replace(array('src="/data/uploads/','src="data/uploads/'),array('src="http://www.xxiangfang.com/data/uploads/','src="http://www.xxiangfang.com/data/uploads/'),$data);
    echo $data;
   }
  }else{    //普通字段(封面、特色、活动名称)
   $a_id = intval(I('GET.a_id'));
   $data =D()->query("select a_id,act_name,pic_url,introduction from xxf_witkey_activity where is_show = 1 and a_id = ".$a_id." order by a_id desc");
   if($data) 
    $data = $data[0];
    echo json_encode($data);
  }
 }

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
列表内容的选择
Jun 30 Javascript
背景音乐每次刷新都可以自动更换
Feb 01 Javascript
jQuery EasyUI API 中文文档 - PropertyGrid属性表格
Nov 18 Javascript
JavaScript 学习笔记之一jQuery写法图片等比缩放以及预加载
Jun 28 Javascript
js中的replace方法使用介绍
Oct 28 Javascript
使用js实现关闭js弹出层的窗口
Feb 10 Javascript
AngularJS之依赖注入模拟实现
Aug 19 Javascript
js鼠标按键事件和键盘按键事件用法实例汇总
Oct 03 Javascript
JavaScript数组去重的几种方法效率测试
Oct 23 Javascript
分享vue.js devtools遇到一系列问题
Oct 24 Javascript
微信小程序App生命周期详解
Jan 31 Javascript
如何在Angular8.0下使用ngx-translate进行国际化配置
Jul 24 Javascript
vue时间格式化实例代码
Jun 13 #Javascript
详解vue slot插槽的使用方法
Jun 13 #Javascript
详解Vue.js分发之作用域槽
Jun 13 #Javascript
Javascript实现从小到大的数组转换成二叉搜索树
Jun 13 #Javascript
微信小程序实现移动端滑动分页效果(ajax)
Jun 13 #Javascript
详解AngularJs路由之Ui-router-resolve(预加载)
Jun 13 #Javascript
微信小程序动态显示项目倒计时效果
Jun 13 #Javascript
You might like
浅析echo(),print(),print_r(),return之间的区别
2013/11/27 PHP
php mysqli查询语句返回值类型实例分析
2016/06/29 PHP
PHP实现的防止跨站和xss攻击代码【来自阿里云】
2018/01/29 PHP
PHP设计模式(八)装饰器模式Decorator实例详解【结构型】
2020/05/02 PHP
php与阿里云短信接口接入操作案例分析
2020/05/27 PHP
从URL中提取参数与将对象转换为URL查询参数的实现代码
2012/01/12 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
2013/10/14 Javascript
javascript代码运行不出来执行错误的可能情况整理
2013/10/18 Javascript
JavaScript中的parse()方法使用简介
2015/06/12 Javascript
JavaScript动态创建form表单并提交的实现方法
2015/12/10 Javascript
JS拖拽组件学习使用
2016/01/19 Javascript
谈一谈JS消息机制和事件机制的理解
2016/04/14 Javascript
canvas快速绘制圆形、三角形、矩形、多边形方法介绍
2016/12/29 Javascript
Vue.js 2.0窥探之Virtual DOM到底是什么?
2017/02/10 Javascript
vue源码入口文件分析(推荐)
2018/01/30 Javascript
解决使用vue.js路由后失效的问题
2018/03/17 Javascript
jquery使用FormData实现异步上传文件
2018/10/25 jQuery
js实现数字从零慢慢增加到指定数字示例
2019/11/07 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
[59:15]EG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/29 DOTA
Python中统计函数运行耗时的方法
2015/05/05 Python
Python读取系统文件夹内所有文件并统计数量的方法
2018/10/23 Python
Python操作qml对象过程详解
2019/09/26 Python
python selenium实现发送带附件的邮件代码实例
2019/12/10 Python
Python类的继承super相关原理解析
2020/10/22 Python
CSS3实例分享--超炫checkbox复选框和radio单选框
2014/09/01 HTML / CSS
Java语言程序设计测试题判断题部分
2013/01/06 面试题
优秀员工获奖感言
2014/03/01 职场文书
作文批改评语大全
2014/04/23 职场文书
排查整治工作方案
2014/06/09 职场文书
集体生日活动方案
2014/08/18 职场文书
档案工作个人总结
2015/03/03 职场文书
导游词之无锡古运河
2019/11/14 职场文书
单身狗福利?Python爬取某婚恋网征婚数据
2021/06/03 Python
解决redis批量删除key值的问题
2022/03/23 Redis
【海涛DOTA】D-cup邀请赛NV.cn vs DT.Love
2022/04/01 DOTA