微信小程序调用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禁止小键盘输入数字功能代码
Aug 01 Javascript
javascript二维数组转置实例
Jan 22 Javascript
JS实现双击屏幕滚动效果代码
Oct 28 Javascript
javascript拖拽效果延伸学习
Apr 04 Javascript
jQuery继承extend用法详解
Oct 10 Javascript
jQuery用noConflict代替$的实现方法
Apr 12 jQuery
jQuery表单验证之密码确认
May 22 jQuery
详解vee-validate的使用个人小结
Jun 07 Javascript
jQuery:unbind方法的使用详解
Aug 14 jQuery
解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
Sep 22 jQuery
深入理解requireJS-实现一个简单的模块加载器
Jan 15 Javascript
ndm:NPM的桌面GUI应用程序
Oct 15 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
PHP 类相关函数的使用详解
2013/05/10 PHP
浅析PHP中strlen和mb_strlen的区别
2014/08/31 PHP
下拉列表select 由左边框移动到右边示例
2013/12/04 Javascript
js将控件隐藏及display属性的使用介绍
2013/12/30 Javascript
项目中常用的JS方法整理
2015/01/30 Javascript
js实现仿京东2级菜单效果(带延时功能)
2015/08/27 Javascript
基于Bootstrap重置输入框内容按钮插件
2016/05/12 Javascript
js弹出窗口返回值的简单实例
2016/05/28 Javascript
Javascript 普通函数和构造函数的区别
2016/11/05 Javascript
微信小程序链接传参并跳转新页面
2016/11/29 Javascript
详解node单线程实现高并发原理与node异步I/O
2017/09/21 Javascript
vue 中动态绑定class 和 style的方法代码详解
2018/06/01 Javascript
element-ui表格合并span-method的实现方法
2019/05/21 Javascript
vue实现简单瀑布流布局
2020/05/28 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
python实现猜数字游戏(无重复数字)示例分享
2014/03/29 Python
C#返回当前系统所有可用驱动器符号的方法
2015/04/18 Python
Eclipse和PyDev搭建完美Python开发环境教程(Windows篇)
2016/11/16 Python
libreoffice python 操作word及excel文档的方法
2019/07/04 Python
Python内置数据类型list各方法的性能测试过程解析
2020/01/07 Python
win10下opencv-python特定版本手动安装与pip自动安装教程
2020/03/05 Python
Python matplotlib 绘制双Y轴曲线图的示例代码
2020/06/12 Python
Python自动化测试中yaml文件读取操作
2020/08/20 Python
python math模块的基本使用教程
2021/01/16 Python
Myprotein蛋白粉美国官网:欧洲畅销运动营养品牌
2016/11/15 全球购物
Trip.com澳大利亚:在线旅行社
2019/12/01 全球购物
JBL加拿大官方商店:扬声器、耳机等
2020/10/23 全球购物
广州喜创信息技术有限公司JAVA软件工程师笔试题
2012/10/17 面试题
Overload和Override的区别
2012/09/02 面试题
老教师工作总结的自我评价
2013/09/27 职场文书
魅力教师事迹材料
2014/01/10 职场文书
打架检讨书300字
2014/02/02 职场文书
八项规定整改方案
2014/10/01 职场文书
公司感谢信范文
2015/01/22 职场文书
yyds什么意思?90后已经听不懂00后讲话了……
2022/02/03 杂记
Docker 镜像介绍以及commit相关操作
2022/04/13 Servers