微信小程序调用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 相关文章推荐
js中判断数字\字母\中文的正则表达式 (实例)
Jun 29 Javascript
Flexigrid在IE下不显示数据的处理的解决方法
Oct 24 Javascript
JS小功能(onmouseover实现选择月份)实例代码
Nov 28 Javascript
JQuery中Bind()事件用法分析
May 05 Javascript
php利用curl获取远程图片实现方法
Oct 26 Javascript
JavaScript实现星级评分
Jan 12 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
react-native-fs实现文件下载、文本存储的示例代码
Sep 22 Javascript
javascript 判断用户有没有操作页面
Oct 17 Javascript
vue路由跳转时判断用户是否登录功能的实现
Oct 26 Javascript
JavaScript学习笔记之图片库案例分析
Jan 08 Javascript
angular8和ngrx8结合使用的步骤介绍
Dec 01 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
百度站点地图(百度sitemap)生成方法分享
2014/01/09 PHP
PHP实现链式操作的核心思想
2015/06/23 PHP
php基于协程实现异步的方法分析
2019/07/17 PHP
MacOS下PHP7.1升级到PHP7.4.15的方法
2021/02/22 PHP
12个非常有创意的JavaScript小游戏
2010/03/18 Javascript
Jquery阻止事件冒泡 event.stopPropagation
2011/12/11 Javascript
关于跨站脚本攻击问题
2011/12/22 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
2013/08/09 Javascript
javascript去除空格方法小结
2015/05/21 Javascript
jQuery实现高亮显示网页关键词的方法
2015/08/07 Javascript
jQuery实现滑动页面固定顶部显示(可根据显示位置消失与替换)
2015/10/28 Javascript
JavaScript程序开发之JS代码放置的位置
2016/01/15 Javascript
Javascript 调用 ActionScript 的简单方法
2016/09/22 Javascript
javascript checkbox/radio onchange不能兼容ie8处理办法
2017/06/13 Javascript
jquery基于layui实现二级联动下拉选择(省份城市选择)
2017/06/20 jQuery
js中getter和setter用法实例分析
2018/08/14 Javascript
微信小程序实现多选功能
2018/11/04 Javascript
vue-better-scroll 的使用实例代码详解
2018/12/03 Javascript
vue 表单验证按钮事件交由父组件触发的方法
2018/12/17 Javascript
9102年webpack4搭建vue项目的方法步骤
2019/02/20 Javascript
react中hook介绍以及使用教程
2020/12/11 Javascript
[36:43]NB vs Optic 2018国际邀请赛小组赛BO1 B组加赛 8.19
2018/08/21 DOTA
Python3 加密(hashlib和hmac)模块的实现
2017/11/23 Python
python爬取指定微信公众号文章
2018/12/20 Python
python实现年会抽奖程序
2019/01/22 Python
印度购物网站:TATA CLiQ
2017/11/23 全球购物
Erwin Müller穆勒家居瑞士官网:您整个家庭的邮购公司
2019/12/28 全球购物
Skyscanner香港:机票比价, 平机票和廉价航空机票预订
2020/02/07 全球购物
《放小鸟》教学反思
2014/04/20 职场文书
给校长的建议书500字
2014/05/15 职场文书
学校党支部承诺书
2015/04/30 职场文书
2015年语文教学工作总结
2015/05/25 职场文书
毕业论文答辩开场白
2015/05/27 职场文书
《将心比心》教学反思
2016/02/23 职场文书
世界十大狙击步枪排行榜
2022/03/20 杂记
Python+OpenCV实现图片中的圆形检测
2022/04/07 Python