2018-01-15 22:14:46 MYTLJP 阅读数 4952
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27828 人正在学习 去看看 秦子恒

用了好几个小时的时间,整理了一下关于公众号的思维导图,由于CSDN不能上传相对应的文件,所以萍子一一的分解开的截图附上来,希望对大家有所帮助哦~
因为是电脑设备自动截图,又鉴于内容比较多,可能不是太清楚,需要的小伙伴们,可以联系我,我可以随时发给你。

学习微信公众号需要的配置

这里写图片描述


微信开发的主体、请求方式、数据类型和环境

主体

这里写图片描述

请求方式

这里写图片描述
这里写图片描述

数据类型和环境

这里写图片描述


开始开发

获取access_token值并存储

这里写图片描述
这里写图片描述


账号管理

生成带参数的二维码

这里写图片描述

长链接转短链接

这里写图片描述


消息管理

获取微信服务器的IP地址

接收普通消息

接收事件推送

被动回复用户消息

这里写图片描述


微信网页授权

微信网页授权步骤

第一步:跳转页面,用户同意授权,获取code

这里写图片描述

第二步:通过code换取网页授权access_token(与普通的access_token不一样,具体见下方)
第三步:如果需要,刷新access_token值

这里写图片描述

第四步:拉取用户信息(需要scope为snsapi_userinfo)
第五步:附,检验授权凭证access_token是否有效,一般用不到

这里写图片描述


微信JS-SDK

说明

这里写图片描述

JS-SDK使用步骤

这里写图片描述

上传图片素材

这里写图片描述


微信公众号

握手协议

这里写图片描述

自定义菜单

自定义菜单类型

这里写图片描述

自定义菜单的设置

这里写图片描述

自定义菜单参数说明

这里写图片描述

获取自定义菜单

这里写图片描述


自定义菜单事件推送/被动回复用户信息

自定义事件推送

这里写图片描述

被动回复用户信息

这里写图片描述

根据菜单类型的点击,被动回复

点击按钮事件

这里写图片描述

公众号首次被某个用户关注的推送

这里写图片描述

微信扫一扫,并展示扫的内容

这里写图片描述

推送图文消息

这里写图片描述

回复图片消息
没有点击按钮

这里写图片描述

2018-03-07 12:07:51 qq_35713752 阅读数 31103
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27828 人正在学习 去看看 秦子恒

微信小程序开发交流qq群   173683895

   承接微信小程序开发。扫码加微信。

正文:

一:微信小程序跳转

使用限制

需要用户触发跳转

从 2.3.0 版本开始,若用户未点击小程序页面任意位置,则开发者将无法调用此接口自动跳转至其他小程序。

需要用户确认跳转

从 2.3.0 版本开始,在跳转至其他小程序前,将统一增加弹窗,询问是否跳转,用户确认后才可以跳转其他小程序。如果用户点击取消,则回调 fail cancel

每个小程序可跳转的其他小程序数量限制为不超过 10 个

从 2.4.0 版本以及指定日期(具体待定)开始,开发者提交新版小程序代码时,如使用了跳转其他小程序功能,则需要在代码配置中声明将要跳转的小程序名单,限定不超过 10 个,否则将无法通过审核。该名单可在发布新版时更新,不支持动态修改。配置方法详见 配置。调用此接口时,所跳转的 appId 必须在配置列表中,否则回调 fail appId "${appId}" is not in navigateToMiniProgramAppIdList

配置方法:

在app.json文件修改如下:

代码:

  "navigateToMiniProgramAppIdList": [
    "wx313490c64bc53c23"
  ]

示例:小程序a跳转到小程序b

小程序a代码: 跳转到小程序b并传id

wx.navigateToMiniProgram({
  appId: '',
  path: 'pages/index/index?id=123',
  extraData: {},
  envVersion: 'develop',
  success(res) {
    // 打开成功
  }
})

 

小程序b代码:

//index.js  接收并打印小程序a传递过来的参数

Page({
onLoad: function (options) {
    console.log(options)
  }
})

 

二:返回上一个微信小程序

wx.navigateBackMiniProgram({
  extraData: {},
  success(res) {
    // 返回成功
  }
})
2017-05-27 14:47:26 qq_37111953 阅读数 4556
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27828 人正在学习 去看看 秦子恒

初步学习微信小程序,开发过程中发现许多常用的代码块,特此记之,方便以后调用。
一、 tabar

"tabBar": {
      "list": [
        {
          "iconPath": "images/index.png",
          "selectedIconPath": "images/index.png",
          "pagePath": "pages/index/index",
          "text": "搜索"
        },
        {
          "pagePath": "pages/dreams/dreams",
          "text": "首页"
        },
        {
          "pagePath": "pages/myDream/myDream",
          "text": "我"
        }
      ]
    }

二、 页面跳转

方法一:

<navigator url="../index/index">跳转到新页面</navigator>
<navigator url="../index/index"open-type="redirect">在当前页打开</navigator>
<navigator url="../index/index"open-type="switchTab">切换到首页Tab</navigator>

方法二:

bindTp:function(){
    //保留当前页面,跳转到应用内的某个页面
    wx.navigateTo({
      url:''
    })
    //关闭当前页面,跳转到应用内的某个页面
    wx.redirectTo({
      url: '',
    })
    //跳转到tabBar页面,并关闭其他所有的tabBar页面
    wx.switchTab({
      url: '',
    })
    //返回上一页面或多级页面
    wx.navigateBack({
      data:1
    })
  },

三、设置页面分享

onShareAppMessage: function () {
    return {
      title: '周公解梦', 
      path: '/pages/index/index', 
      success: function (res) {
            console.log(res)
      }
    }
  }

带参数页面分享

onShareAppMessage: function () {
    return {
      title: '周公解梦', 
      path: '/pages/index/index?id=3', 
      success: function (res) {
            console.log(res)
      }
    }
  }

获取传递过来的参数

onLoad: function (options) {
    if (options.uid != undefined){
      wx.showToast({
        title: '来自用户:' + options.uid +"的分享",
        icon:'success',
        duration:2000
      })
    }
}

四、微信小程序之选项卡
在发现选项卡之前,要想实现这个功能我只能想到写多个xml文件实现转换,或者在wxml界面进行判断,今天又get到一个新技能!可参考以下网址:http://www.wxapp-union.com/article-2350-1.html
这里写图片描述这里写图片描述

wxml文件:

<view class="swiper-tab">  
    <view class="swiper-tab-item {{currentTab==0 ? 'on' : ''}}" data-current="0" bindtap="swichNav">最新</view>  
    <view class="swiper-tab-item {{currentTab==1 ? 'on' : ''}}" data-current="1" bindtap="swichNav">热门</view>   
</view>  

<view class="mjlist" wx:for="{{dreams}}">
<view class="nrzt" bindtap="dream" data-dreamCode="{{item.dreamCode}}">
<view class="nrztz">
<view class="tx"><image src="{{item.memberAvatar}}" style="width: 40px; height: 40px;"></image></view>
<view class="nr">
<view class="mc">{{item.memberName}}</view>
<view class="mj">{{item.dreamDetail}}</view>
<view class="ms"><image src="../../images/timeIcon.png" style="width: 15px; height: 15px; position: relative; top:3px;"></image>{{item.dateAdd}} <image src="../../images/message.png" style="width: 15px; height: 15px; position: relative; top:3px;"></image>已有{{item.dreamOneiromancy}}人解梦</view>
</view>
<view class="yj"><image src="../../images/zjt.png" style="width: 40px; height: 40px;"></image></view>
</view>
</view>
</view>
<!--梦境列表-->
<view class="ckgd" bindtap="more" data-property="{{property}}">+ 查看更多 +</view>

<!--不太清楚下面的swiper-item的作用,但是把它们都删掉以后功能却无法实现,只好保留将其样式设为隐藏-->
<swiper current="{{currentTab}}" class="swiper-box" duration="300" style="height:{{winHeight - 80}}px; display:none;" bindchange="bindChange"> 
 <swiper-item>  
    <!--<view>热门</view>  -->
  </swiper-item>  
  <swiper-item>  
    <!--<view>关注</view>  -->
  </swiper-item>  
</swiper>

wcss文件

.nav{ width: 100%; height: 50px; margin: 0 auto; background: #fff; border-bottom: 1px solid #e8e3dd;}
.nav .navz{ width: 50%; height: 50px; float:left; background:#f9f9f9; border-right: 1px solid #e8e3dd; text-align: center; line-height: 50px; color:#7e7e7e; font-size: 18px;}
.nav .navy{ width: 49%; height: 50px; float: right; background: #fff; line-height: 50px; color:#bcbcbc; font-size: 18px;  text-align: center;}

/*梦境列表*/
.mjlist{ width: 100%; height: auto; margin: 0 auto;  background: #fff; border-bottom:1px solid #e8e3dd; padding-top: 10px; padding-bottom: 10px; overflow: hidden;}
.mjlist .nrzt{ width: 90%; height: auto; margin: 0 auto;}
.mjlist .nrztz{ width: 100%; height:auto; margin: 0 auto;}
.mjlist .nrztz .tx{ width: 17%; height: auto; float: left;}
.mjlist .nrztz .nr{ width: 65%; height: auto; float:left;}
.mjlist .nrztz .nr .mc{ width: 100%; height: 40px; line-height: 40px; font-size: 14px; color: #b2b2b2;}
.mjlist .nrztz .nr .mj{ width: 100%; line-height: 20px;  font-size: 14px; color: #666;}
.mjlist .nrztz .nr .ms{ width: 100%; height: 24px; line-height: 24px; font-size: 13px; color: #b2b2b2;}
.mjlist .nrztz .yj{ width: 15%; height: auto; float: right; }
 .ckgd { width: 100%; height: 45px; margin: 0 auto; background: #fff;  line-height: 45px; text-align: center; color: #b7b7b7; font-size: 14px; }

 .swiper-tab{  
    width: 100%;  height: 50px; 
    border-bottom: 2rpx solid #eeeeee;  
    text-align: center;  
    line-height: 50px; background: #fff;}  
.swiper-tab-item{  font-size: 18px;  
    display: inline-block;  
    width: 50%;  
    color: #666666;  
}  
.on{ color: #666;  
     background:#f9f9f9;}  
.swiper-box{ display: block; height: auto; width: 100%; overflow: hidden; }  
.swiper-box view{  
    text-align: center;  
}  

js文件

var app = getApp()
var limit = app.globalData.limit
var url = app.globalData.url
var i = 0
Page({
    data: {
        winWidth: 0,
        winHeight: 0,
        // tab切换  
        currentTab: 0,

      },
    bindChange: function (e) {
        var that = this;
        that.setData({ currentTab: e.detail.current });
        console.log("bindChange");
        if (e.detail.current=='0' ){
          console.log("这是0");
          that.newlist();
        }else{
          console.log("这是1");
          that.hot();
        }
      },
      swichNav: function (e) {
        console.log("swichNav");
        var that = this;
        if (this.data.currentTab === e.target.dataset.current) {
          console.log('false');
          return false;
        } else {
          that.setData({
            currentTab: e.target.dataset.current
          })

        }
      },
    onLoad: function (options) {
        var that= this
        wx.getSystemInfo({
          success: function (res) {
            that.setData({
              winWidth: res.windowWidth,
              winHeight: res.windowHeight
            });
          }
        });
        this.newlist();
      },
 })

五、小程序分页之点击加载更多
若想实现点击加载更多功能,主要是使用了concat函数,具体使用可以参考
http://www.jb51.net/article/98558.htm

 onLoad: function (options) {
    var s="123"
    console.log(s)
    console.log(s.concat("aass"));
 }

六、radio样式的修改
在实际开发中经常需要对原生的radio样式进行大小和选中样式的修改,具体代码如下:

radio .wx-radio-input {
  width: 48rpx;
  height: 48rpx;
}
radio .wx-radio-input.wx-radio-input-checked {
  background-color: #15b2e2 !important;
  border-color: #15b2e2 !important;
}
2016-10-12 10:53:11 qq_31383345 阅读数 131901
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27828 人正在学习 去看看 秦子恒

  微信小程序的页面跳转,页面之间传递参数笔记.

CSDN微信小程序开发专栏,欢迎关注!

  先上demo图:

  


为了简化逻辑,所以index.wxml里面只写了两个text.既然是跳转,那就还有其他页面.

目录如下:


三个页面,但是代码很简单.直接上代码.

<span style="font-size:24px;"><!--index.wxml-->  
<view class="btn-area">  
  <navigator url="../navigator/navigator?title=我是navigate" >跳转到新页面</navigator>  
  <navigator url="../redirect/redirect?title=我是redirect" redirect>在当前页打开</navigator>  
</view></span>



index.wxml中的URL就是跳转的页面路径.上面代码中就是navigator目录下的navigator页面,title是参数.
navigator下redirect属性是值在当前页打开.如果不加redirect就是跳转到新页面.都可以携带参数.
navigator下redirect属性是值在当前页打开.如果不加redirect就是跳转到新页面.都可以携带参数.


<span style="font-size:24px;"><!--navigatort.wxml-->  
<view style="text-align:center"> {{title}} </view></span>

在navigatort.wxml中通过js代码可以获取到title,代码如下

//navigatort.js

Page({  
  onLoad: function(options) {  
    this.setData({  
      title: options.title  
    })  
  }  
})


<span style="font-size:24px;"><!--redirect.wxml-->  
<view style="text-align:center"> {{title}} </view></span>


<span style="font-size:24px;">//redirect.js  
Page({  
  onLoad: function(options) {  
    this.setData({  
      title: options.title  
    })  
  }  
})</span>



最后上两张跳转后的图.

1.跳转到新页面




2.在原来的页面打开



有没有发现一个细节,在原来的页面打开是不会出现返回按钮的,而跳转到新页面后会出返回按钮.

这是因为我写了两个页面.如果indexwxml不是一级页面,这里都会出现返回按钮.

当然返回的结果是不一样的:

1.跳转到新页面,返回是回到之前的页面;

2.在原来页面打开,返回是回到上一级页面.

微信开发文档

http://blog.csdn.net/qq_31383345

2018-08-09 11:20:09 qq_41912505 阅读数 3542
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27828 人正在学习 去看看 秦子恒

1.自动回复消息文本带链接跳转

效果图:

操作是很简单,但是搜百度却搜不到如何实现,所以有了这篇博客

在需要加链接的文本用a标签,而且a标签的href属性用单引号把URL地址括起来,如图:

2.客服消息文本带链接跳转

效果图:

a标签的属性href用双引号需要转义字符“\”,代码如下图

注:

\n:换行

\:转义字符

有用的话,记得点个赞哦!!

 

 

 

 

ios 应用内跳转微信

阅读数 12930

没有更多推荐了,返回首页