钉钉小程序 开发 PHP + 钉钉小程序 (企业内部应用)

816 阅读4分钟

应公司需求 需要结合钉钉开发小程序 由于公司自用 所以选择了 企业内部应用 我在做之前和做的过程中 查不到几乎可用的资料 我就把我遇到的 能想起来的,给要接触的童鞋们 参考一下吧

钉钉文档: ding-doc.dingtalk.com/

目前钉钉的文档还没有完善的类似微信 有很多微信有的 钉钉还没有 希望将来可以支持吧 搞不明白的去微信看看文档 基本能弄明白

1.缓 存

微信 :wx.setStorageSync("userid", data.data.userid) wx.getStorageSync("userid", data.data.userid) 钉钉:(简直想死)

包括get 也不会让你失望(有点难受 这附近代码 我重写优化了好几次 真的 )

2.loading(钉钉文档里 在我开发时  我找遍了 没有,我拿着微信的代码 ,
有loading  但无文字 我就试了一个content 就可以了 避避坑)
钉钉:dd.showLoading({content: '正在加载',})		
微信:wx.showLoading({title: '加载中',})

3.钉钉中我没有找到弹框 于是让前端同事给我写了一个 
<view class="lightbox" style="{{light}}"></view>

 <view class="xx-tbox fl fd" style="{{box}}">
   <view class="nr-zi1">录入签名提示</view>
   <view class="nr-zi2 bottom-x">是否去补齐签名?</view>
   <view   onTap="cancel" class="link-1 fl right-x">取消</view>
   <view  onTap="sure" data-userid="{{userids}}" class="link-2 fl">确定</view>
</view>
 .lightbox{width:100%;z-index:101; height:100%;background-color:#333;filter:alpha(Opacity=20);-moz-opacity:0.2;opacity: 0.2; position: fixed; top:0px; left:0px;}

  .xx-tbox{ width: 60%; margin: 20%; background-color: #fff; margin-top: 40%; height: 130px; z-index: 999;}
  .nr-zi1{ width: 100%; font-size: 16px; text-align: center; line-height: 32px; margin-top: 15px;}
  .nr-zi2{ width: 100%; font-size: 12px; text-align: center; line-height: 22px; padding-bottom: 15px;}
  .link-1{ width: 49.5%; height: 46px; line-height: 46px; font-size: 14px; text-align: center; color: #333; }
  .link-2{ width: 49.5%; height: 46px; line-height: 46px; font-size: 14px; text-align: center; color: #71d398; }
  .right-x{border-right-width: 1px; border-right-style: solid; border-right-color: #f4f4f4; }

5.在开发调试阶段 建议增加一个 ClearCache 否则 你setData 里面清除不掉 造成其他影响 清除缓存 文档中有 写过小程序js 这句就当没看见 js中每一个方法{}, (花括号后跟英文逗号) 最后一个方法不加。

  ClearCache(event){
      dd.removeStorage({
        key: 'info',
      success: function(){
        }
      });
    },

6.钉钉小程序 每个页要单独保存 后编译 但是有批量保存 微信小程序 是只要ctrl + s 就保存所有 + 编译 7.网络请求

		
		 dd.httpRequest({
                  url: 'http://url?userid='+userid,
                  method: 'POST',
                  data: { userid: userid},
                  dataType: 'json',
                  success: (res) => {
                    // console.log('emmm res======' + res);
                    },
                 })

8.获取到的数据 要this.setData({})
data值仅在当页生效 9.开发工具(钉钉这个模拟器 还比较满意 可以分离出开发工具 有点类似android 开发了的感觉 总让我有一种android studio 的感觉)

我应该没有暴露什么吧 emmm。。。。。。。。。。。。

10.登陆钉钉账号后 开发工具左上角要选择自己在开发者后台创建的应用类型
app.js 中 需要绑定企业id

App({
  onLaunch(options) {
    // 第一次打开
    // options.query == {number:1}
    console.info('App onLaunch');
    console.info(options);
   this.globalData.corpId = options.query.corpId;
  },
  onShow(options) {
    // 从后台被 scheme 重新打开
    // options.query == {number:1}
  },
   onHide() {
    console.log('App Hide');
  },
  
   globalData: {
    corpId: "",
    hasLogin: false,
  },
});

11.获取token 我用的是TP5.1

	/**
	 *  查看缓存内是否存在token信息 并检测是否过期
	 *  如过期 则重新获取token
	 * JAM
	 * @return type $token
	 */
	public function getAccessToken()
    {
		$appkey = APP_KEY;
		$appsecret = APP_SECRET;
		$expire_time = Cache::get('expire_time');
		$access_token = Cache::get('access_token');
		//如果token緩存存在
		if(!empty($access_token)){
			if($expire_time < time()){
				$token = $this->get_token($appkey,$appsecret,$token_file_name);
			}else{
				$token = $access_token;
			}
		} else {//否则token緩存不存在
			$token = $this->get_token($appkey,$appsecret,$token_file_name);
		}
		return $token;
	}
	


	

	/**
	 *  请求钉钉接口获取token
	 *  JAM
	 * @param  type $appkey
	 * @param  type $appsecret
	 * @return type $token
	 */
	public function get_token($appkey,$appsecret)
	{
		$url = "https://oapi.dingtalk.com/gettoken?appkey=".$appkey."&appsecret=".$appsecret;
		$get_result = json_decode($this->http($url),true);
		if($get_result['errcode'] == '0')
		{
			$new_token = (object)[];
			$token = $get_result['access_token'];         
			$new_token->expire_time = time() + 7000;
			$new_token->access_token = $token;
			Cache::set("expire_time",time() + 7000);
			Cache::set("access_token",$token);
			// $this->set_php_file($token_file_name,json_encode($new_token));
		}else{
			$token = 'get_token_error';
		}
		
        return 	$token;
	}





	/**
	 * 返回用户信息
	 * @return type $value 用户信息
	 */
	public function getUserInfo()
	{
		$code = input('param.authCode');
		$token = getAccessToken();
		$url = 'https://oapi.dingtalk.com/user/getuserinfo?access_token=' . $token . '&code=' . $code;
		$result = http_request_get($url);
		$res = json_decode($result,true);

		//根据userid 单独获取钉钉用户个人info
		$url1 = 'https://oapi.dingtalk.com/user/get?access_token=' . $token . '&userid=' . $res['userid'];
		$result1 = http_request_get($url1);
		$res1 = json_decode($result1,true);
		$info['code'] = $result?1:0;
		$info['res'] = $res;
		$info['res1'] = $res1;
		return json_encode($info);

	}

钉钉获取小程序免登授权码

  				dd.getAuthCode({
                  success:(res)=>{
                  var authCode = res.authCode
                  }, fail:function(err){
                  
  					}
                  })

11.webview 我做了个类似银行签名的东西 单个字单个字签字 然后拼在一起 注意webview白名单 webview 在模拟器 无法写字 canvas 画不上去 手机就没问题了 ,不知道是不是需要对应的事件js

*服务端API若是调用不成功,看服务端ip地址是不是在白名单中,本地服务器测试的话,重启路由器后ip是会变, 不在白名单 去开发者后台配置一下 就ok 。 *钉钉开发 会涉及到一些 功能权限 需要就开一下 如果没权限就是用 会提示没有权限 注意一下就好。

一些常见的坑 我都列出来了 也有可能有我想不起来的 或者我没接触到的 如果有看到的 有不懂 留言我们探讨 后续 维护 如果碰到坑 在补充