详解微信第三方小程序代开发


Posted in Javascript onJune 23, 2017

详解微信第三方小程序代开发

微信申请第三方之后可以获取授权方的很多权限,主要的是生码和待开发,生码的第三方授权之前已经写了一篇文章,最近做了小程序待开发,总结一下写下来供大家参考

注意事项:如果在调试过程中返回了错误码请到小程序代开发api页面查看,

  小程序代开发使用的域名是你申请第三方时候填写的域名,

 小程序代码模板最多只有50个,可以删除然后重新添加。

准备工作:

申请微信第三方并且权限那边要选上代开发,第三方申请成功之后就是准备小程序了,需要两个小程序,一个作为小程序代码库,一个作为用户测试用,需要在第三方授权。

添加小程序代码库: 在第三方那边将小程序添加为开发小程序,然后该小程序就成为了第三方的开发小程序,之后该小程序提交的代码都会存入第三方草稿箱,你可以选择版本添加为模板,一个第三方最             多只能有50个模板。

代开发流程:

post请求公共方法,与微信服务器交互用

代码如下

protected function curl_post( $curlHttp, $postdata ) {
    $ch = curl_init(); //用curl发送数据给api
    curl_setopt( $ch, CURLOPT_POST, true );
    curl_setopt( $ch, CURLOPT_POST, true );
    curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
    curl_setopt( $ch, CURLOPT_URL, $curlHttp );
    curl_setopt( $ch, CURLOPT_POSTFIELDS, $postdata );
    curl_setopt( $ch, CURLOPT_SSL_VERIFYPEER, FALSE );
    curl_setopt( $ch, CURLOPT_SSL_VERIFYHOST, FALSE );

    $response = curl_exec( $ch );
    curl_close( $ch );
    $result = json_decode( $response, true );
    return $result;
  }

get请求公共方法,与微信服务器交互用

代码如下

protected function buildRequestForm( array $param, $method, $target='',$jump=false) {
    $sHtml = "<meta http-equiv='Content-Type' content='text/html; charset=utf-8' /><form id='autoSubmit' action='".$target."' method='".$method."'>";

    if ( !empty( $param ) ) {
      foreach( $param as $key => $value ) {
        $sHtml.= "<input type='hidden' name='".$key."' value='".urldecode($value)."'/>";
      }
    }
    $sHtml .= "</form>";

    if($jump) $sHtml = $sHtml."<script>document.getElementById(\"autoSubmit\").submit();</script>";

    return $sHtml;
  }

获取授权方api调用拼成access_token公共方法

代码如下

protectd function getAccessToken( $appId ) {
    $accessToken = '';

    if ( empty( $appId ) ) {
      return $accessToken;
    }
    
    // 中间的逻辑自己填充

    return $accessToken;
  }

首先是开发一套小程序并且上传,之后再第三方里边把该版本设置成模板,这个时候你就用了模板id(用于代码指定用)

通过调用微信接口,给用户小程序指定小程序代码

代码如下

public function commitCode() {
    $appId = input( 'app_id', '' );
    $descript = input( 'descript', '测试代码指定' );
    $version = input( 'version', 'V.1.0' );
    $templateId = input( 'template_id', 1 );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    if ( empty( $templateId ) && ( $templateId != 0 ) ) {
      $this->error( '模板id不能为空' );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );

    // 个人信息我给清除了,空字符部分请自己补充
    $extJson = array(
      'extAppid' => $appId,
      'ext' => array(
        'attr1' => 'value1'
      ),
      'extPages' => array(
          'pages/index/index' => array(
            'navigationBarTitleText'  => ''
          ),
          'pages/media/media' => array(
            'navigationBarTitleText'  => ''
          )
      ),
      'pages' => array(
          'pages/index/index',
          'pages/media/media'
      ),
      'window' => array(
          'backgroundColor'      => '#f8f8f8',
          'navigationBarTextStyle'  => 'white',
          "navigationBarTitleText"  => "",
          'navigationBarBackgroundColor' => '#2b3b48'
      ),
      'tabBar' => array(
        'list' => array(
          array(
            'text'   => '',
            'pagePath' => 'pages/index/index',
          ),
          array(
            'text'   => '',
            'pagePath' => 'pages/media/media',
          )
        )
      ),
      'networkTimeout' => array(
          'request'    => 10000,
          'uploadFile'  => 10000,
          'downloadFile' => 10000,
          'connectSocket' => 10000
      )
    );

    $params = array(
      'template_id'  => $templateId,
      'user_version' => $version,
      'user_desc'   => $descript,
      'ext_json'   => json_encode( $extJson, JSON_UNESCAPED_UNICODE )
    );
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/commit?access_token='.$accessToken, json_encode( $params, JSON_UNESCAPED_UNICODE ) );
    if ( empty( $result ) || !empty( $result['errcode'] ) ) {
      $this->error( '代码指定错误' );
      return;
    }

    $this->success( '操作成功' );
    return;
  }

指定代码之后就是查看功能是否正常了,所以就要调用微信接口获取体验二维码扫码体验,

代码如下

public function getExpCode() {
    $appId = input( 'app_id', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }

    $params = array(
      'access_token' => $accessToken
    );
    $result = $this->buildRequestForm( $params, 'GET', 'https://api.weixin.qq.com/wxa/get_qrcode?access_token='.$accessToken, true );
    echo $result;
    exit;
  }

如果授权用户没有体验权限则扫码之后不能进行小程序功能体验,这个时候就需要你通过微信接口将用户设置为体验者了,这一步可以在小程序平台用户管理里边操作,为了提高逼格,你可可以通过微       信接口进行体验者的添加和删除,添加的时候需要被添加者微信确认

代码如下

public function bindTester() {
    $appId = input( 'app_id', '' );
    $wxNumber = input( 'wx_number', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }
    if ( empty( $wxNumber ) ) {
      $this->error( 微信号不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }
    $params = array(
      'wechatid' => $wxNumber
    );
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/bind_tester?access_token='.$accessToken, json_encode( $params ) );
    print_r($result);
    exit;
    return;
  }

public function unBindTester() {
    $appId = input( 'app_id', '' );
    $wxNumber = input( 'wx_number', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }
    if ( empty( $wxNumber ) ) {
      $this->error( 微信号不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }
    $params = array(
      'wechatid' => $wxNumber
    );
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/unbind_tester?access_token='.$accessToken, json_encode( $params ) );
    print_r($result);
    exit;
    return;
  }

如果体验功能有问题则重新调整小程序代码逻辑然后上传之后设置为模板,如果没有问题则将小程序代码提交审核,但是提交审核的时候需要指定category,所以需要调用微信接口查看

如果授权用户没有设置的话,需要对方进入小程序平台,在填写小程序信息的地方添加服务条目

代码如下

public function getCategory() {
    $appId = input( 'app_id', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }

    $params = array(
      'access_token' => $accessToken
    );
    $result = $this->buildRequestForm( $params, 'GET', 'https://api.weixin.qq.com/wxa/get_category?access_token='.$accessToken, true );

    echo $result;
    exit;
  }

拿到服务条目之后就是提交代码审核了

代码如下

public function submitAudit() {
    $appId = input( 'app_id', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }

    $params = array(
      'item_list' => array(
          array(
            'address' => 'pages/index/index',
            'tag' => 'IT科技',
            'first_class' => 'IT科技',
            'second_class' => '硬件与设备',
            'title' => '生成二维码'
          ),
          array(
            'address' => 'pages/media/media',
            'tag' => '工具',
            'first_class' => '工具',
            'second_class' => '办公',
            'title' => '多媒体上传'
          )
      )
    );
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/submit_audit?access_token='.$accessToken, json_encode( $params, JSON_UNESCAPED_UNICODE ) );

    echo'<pre>';
    print_r($result);
    exit;
    $this->success( '操作成功' );
    return;
  }

提交审核之后,微信服务器会返回一个审核id,你可以通过该审核id查询审核状态

当审核通过之后,微信会给你第三方注册的回调地址推送一个审核结果

代码如下

public function getAuditStatus (){
    $appId = input( 'app_id', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }
    $params = array(
      'auditid' => 12334
    );
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/get_auditstatus?access_token='.$accessToken, json_encode( $params ) );
    print_r($result);
    exit;
    return;
  }

当小程序审核通过了接下来就是小程序发布了

代码如下

public function release (){
    $appId = input( 'app_id', '' );
    if ( empty( $appId ) ) {
      $this->error( appid不能为空 );
      return;
    }

    $accessToken = $this->getAccessToken( $appId );
    if ( empty( $accessToken ) ) {
      $this->error( '获取授权accessToken错误' );
      return;
    }
    $result = $this->curl_post( 'https://api.weixin.qq.com/wxa/release?access_token='.$accessToken, '{}' );
    print_r($result);
    exit;
    return;
  }

就这样,小程序代开发就完成了,逻辑很简单,代码也没难度,本文章的代码仅供大家参考,如果有问题请评论指出,我尽量补充。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JQuery DataTable删除行后的页面更新利用Ajax解决
May 17 Javascript
当json键为数字时的取值方法解析
Nov 15 Javascript
JQuery boxy插件在IE中边角图片不显示问题的解决
May 20 Javascript
详解JavaScript中数组的相关知识
Jul 29 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
Apr 17 Javascript
用jQuery获取table中行id和td值的实现代码
May 19 Javascript
AngularJS表单详解及示例代码
Aug 17 Javascript
js实现加载页面就自动触发超链接的示例
Aug 31 Javascript
vue实现简单的MVVM框架
Aug 05 Javascript
解决vue v-for 遍历循环时key值报错的问题
Sep 06 Javascript
react ant Design手动设置表单的值操作
Oct 31 Javascript
vue elementUI表格控制对应列
Apr 13 Vue.js
Easyui在treegrid添加控件的实现方法
Jun 23 #Javascript
详解用vue.js和laravel实现微信支付
Jun 23 #Javascript
详解用vue.js和laravel实现微信授权登陆
Jun 23 #Javascript
妙用Angularjs实现表格按指定列排序
Jun 23 #Javascript
VUE中v-model和v-for指令详解
Jun 23 #Javascript
JavaScript正则表达式简单实用实例
Jun 23 #Javascript
js中的事件委托或是事件代理使用详解
Jun 23 #Javascript
You might like
十大感人催泪爱情动漫 第一名至今不忍在看第二遍
2020/03/04 日漫
PHP 动态随机生成验证码类代码
2010/04/09 PHP
linux环境apache多端口配置虚拟主机的方法深入介绍
2013/06/09 PHP
PHP随机生成唯一HASH值自定义函数
2015/04/20 PHP
PHP实践教程之过滤、验证、转义与密码详解
2017/07/24 PHP
使用正则替换变量
2007/05/05 Javascript
Node.js生成HttpStatusCode辅助类发布到npm
2013/04/09 Javascript
js全选按钮的实现方法
2015/11/17 Javascript
node.js入门实例helloworld详解
2015/12/23 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
javascript基础知识之html5轮播图实例讲解(44)
2017/02/17 Javascript
jQuery实现元素的插入
2017/02/27 Javascript
JS开发中百度地图+城市联动实现实时触发查询地址功能
2017/04/13 Javascript
移动端触摸滑动插件swiper使用方法详解
2017/08/11 Javascript
JS自定义滚动条效果
2020/03/13 Javascript
vue实现编辑器键盘抬起时内容跟随光标距顶位置向上滚动效果
2020/05/28 Javascript
toString.call()通用的判断数据类型方法示例
2020/08/28 Javascript
Vant picker 多级联动操作
2020/11/02 Javascript
Vue 防止短时间内连续点击后多次触发请求的操作
2020/11/11 Javascript
JavaScript实现10秒后再次获取验证码
2020/12/02 Javascript
JS常用跨域方法实现原理解析
2020/12/09 Javascript
Python脚本实现自动将数据库备份到 Dropbox
2017/02/06 Python
Python编程实现的简单Web服务器示例
2017/06/22 Python
PyQt 线程类 QThread使用详解
2017/07/16 Python
Python使用pylab库实现绘制直方图功能示例
2018/06/01 Python
python使用zip将list转为json的方法
2018/12/31 Python
python中的测试框架
2020/11/13 Python
HTML5引入的新数组TypedArray介绍
2012/12/24 HTML / CSS
COACH德国官方网站:纽约现代奢侈品牌,1941年
2018/06/09 全球购物
酒店保安员岗位职责
2014/01/31 职场文书
置业顾问岗位职责
2015/02/09 职场文书
看古人们是如何赞美老师的?
2019/07/08 职场文书
Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件
2021/04/17 Vue.js
详细总结Python常见的安全问题
2021/05/21 Python
关于SpringBoot 使用 Redis 分布式锁解决并发问题
2021/11/17 Redis
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技