---效果图片预览---
 

 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);
}
}

原创:微信小程序调用PHP后台接口,解析纯html文本的更多相关文章

  1. 原创:微信小程序开发要点总结

    废话不多少,下面是对我从开发微信小程序的第一步开始到发布的总结,觉得对您有帮助的话,可以赞赏下,以对我表示鼓励. 一:首先注册登录微信公众平台,这个平台很重要,以后查文档全在上面看.https://m ...

  2. 微信小程序与Java后台通信

    一.写在前面 最近接触了小程序的开发,后端选择Java,因为小程序的代码运行在腾讯的服务器上,而我们自己编写的Java代码运行在我们自己部署的服务器上,所以一开始不是很明白小程序如何与后台进行通信的, ...

  3. 微信小程序与Java后台的通信

    一.写在前面 最近接触了小程序的开发,后端选择Java,因为小程序的代码运行在腾讯的服务器上,而我们自己编写的Java代码运行在我们自己部署的服务器上,所以一开始不是很明白小程序如何与后台进行通信的, ...

  4. 微信小程序的Web API接口设计及常见接口实现

    微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,通过小程序的请求Web API 平台获取JSON数据后,可以在小程序界面上进行数据的动态展示.在数据的关键 一环中,我们 ...

  5. 微信小程序登录JAVA后台

    代码地址如下:http://www.demodashi.com/demo/12736.html 登录流程时序登录流程时序 具体的登录说明查看 小程序官方API 项目的结构图: springboot项目 ...

  6. 微信小程序需要https后台的创业机会思考

    最近比较关注微信小程序,而且微信小程序的后台必须强制要求https, https相对http成本要高很多了. 这里我感觉有2个商机 (1)提供https 中转服务器 ,按流量来收费 (2) 微信小程序 ...

  7. 图解微信小程序---调用API操作步骤

    图解微信小程序---调用API操作步骤 什么是API API(Application Programming Interface,应用程序编程接口:是一些预先定义的函数,目的是提供应用程序与开发人员基 ...

  8. 小程序调用wx.chooseLocation接口的时候无法获取权限(ios)

    ios手机小程序调用wx.chooseLocation接口的时候,获取权限的时候报authorize:fail:require permission desc这样子的错误,这是由于苹果的安全机制导致需 ...

  9. 记录一次用宝塔部署微信小程序Node.js后端接口代码的详细过程

    一直忙着写毕设,上一次写博客还是元旦,大半年过去了.... 后面会不断分享各种新项目的源码与技术.欢迎关注一起学习哈! 记录一次部署微信小程序Node.js后端接口代码的详细过程,使用宝塔来部署. 我 ...

随机推荐

  1. Cocos2d-x

    http://blog.csdn.net/ccf19881030/article/details/9204801 Cocos2d-x相关的博客以及官网信息 1.CSDN博主无幻的博客:http://b ...

  2. spring IOC的常见几种以来注入的方式

    在spring ioc中有三种依赖注入,分别是:a.接口注入:b.setter方法注入:c.构造方法注入: 接口注入: public class ClassA { private InterfaceB ...

  3. OpenCV 脸部跟踪(1)

        本文中的知识来自于Mastering  opencv with practical computer vision project一书.     本文实施的脸部跟踪算法都是基于数据驱动的,主要 ...

  4. 3D屏保程序:汉诺塔

    学过程序的人一定记得汉诺塔.我们学的第一个程序是HelloWorld,而碰到的第一个坑就是汉诺塔,短短十几行代码,不知花费了多少时间精力去理解.我记得当年的开发环境还是蓝屏的,汉诺塔程序的输出还是一行 ...

  5. Winform中用了皮肤控件之后,报错:容量超出了最大容量 参数名:capacity

    解决方案: 设置      skin.SkinDialogs = false;

  6. iOS开发-Interface Builder的前世今生

    Interface Builder,是用于苹果公司Mac OS X操作系统的软件开发程序,Xcode套件的一部分,于1988年创立.它的创造者Jean-Marie Hullot自称是“一个热爱旅行.充 ...

  7. Android中XML解析-SAX解析

    昨天由于时间比较匆忙只写了Android中的XML解析的Dom方式,这种方式比较方便,很容易理解,最大的不足就是内容多的时候,会消耗内存.SAX(Simple API for XML)是一个解析速度快 ...

  8. HTML5, CSS3, ES5新的web标准和浏览器支持一览 转

    本文整理了一些最重要(或者说人气比较高罢)的新标准,虽然它们多数还只是w3c的草案,离Recommendation级别还早,却已经成为新一轮浏览器大战中备受追捧的明星,开发者社区里也涌现出大量相关的d ...

  9. Web.config中加了system.diagnostics节点后就不能访问了

    Web.config中加了system.diagnostics节点后就不能访问了,怎么回事? [解决方法] 不要把system.diagnostics节点作为web.config的第一个节点.

  10. java编程思想---对象

    一.对象 对于每种语言来说,都有自己操纵内存中元素的方法. 在java中,一切被视为对象.可是操纵对象的是一个"引用".举个样例,能够比作为遥控器对电视的操作,遥控器就是引用,而电 ...