DingTalk Micro Application Services

Abstract: The basic access of DingTalk enterprise micro-applications is listed

Let's start with how to access the DingTalk micro-app and get the free login code.

1. Need DingTalk enterprise number and create DingTalk enterprise

2. Create a micro application within DingTalk.

3. Build your own local service or external network web service

4. Set the homepage of the micro-app to the address of the local service or the address of the external network

5. Introduce the SDK provided by DingTalk

6. Download address: https://github.com/ddtalk/client_sdk

        (1) Backend: Get accesstoken and js_ticket

                The incoming parameters are the CorpId and CorpSecret obtained by the new enterprise

                

ServiceFactory serviceFactory = ServiceFactory.getInstance();
 CorpConnectionService corpConnectionService = serviceFactory.getOpenService(CorpConnectionService.class);
 accessToken = corpConnectionService.getCorpToken(CorpID,CorpSecret);

                After getting accesstoken, we can get js_ticket through accesstoken

                

 ServiceFactory serviceFactory = ServiceFactory.getInstance();
 JsapiService jsapiService = serviceFactory.getOpenService(JsapiService.class);
 JsapiTicket jsapiTicket = jsapiService.getJsapiTicket(accessToken , "jsapi");
 JSTicket = jsapiTicket.getTicket(); 

                Get the js_ticket and we can get the signature signature information

@RequestMapping("/get_js_config")
    @ResponseBody
    public Map<String,Object> getJsConfig(@RequestParam(value = "url" ,required = false) String url
            ,@RequestParam(value = "corpId",required = false) String corpId){
        String accessToken = authHelper.getAccessToken();
        String JSTicket = authHelper.getJSTicket(accessToken);

        String nonceStr = Utils.getRandomStr(8);
        Long  timeStamp = System.currentTimeMillis();

        try {
            String signature = DingTalkJsApiSingnature.getJsApiSingnature(url ,nonceStr ,timeStamp ,JSTicket);
            Map<String,Object> JsApiConfig = new HashMap<String,Object>();

            JsApiConfig.put("signature",signature);
            JsApiConfig.put("nonceStr",nonceStr);
            JsApiConfig.put("timeStamp",timeStamp);
            JsApiConfig.put("corpId",corpId);

            return JsApiConfig;
        } catch (Exception e) {
            e.printStackTrace();
            logger.info(" message ", e.getMessage());

        }

        return null;
    }

                The parameter URL is the home page address we set earlier. CorpId is what I can get for my new enterprise.

The parameters that the backend needs to acquire and the acquisition is completed.

    ( 2 ). The parameters passed by the front end to the front end through the back end are authenticated by dd.config

Front-end processing work:

$(document).ready(function () {
        var url = window.location.href;
        console.log("url", url);
        var corpId = "xxxxxxxxxxxxxxxxxxxxxxxx";  // 企业的corpId
        var signature = "";
        var nonceStr = "";
        var timeStamp = "";
        var agentId = "";

        $.post(
            'get_js_config',
            {
                "url": url,
                "corpId": corpId
            },
            function (result) {
                console.log("result", result);
                signature = result.signature;
                nonceStr = result.nonceStr;
                timeStamp = result.timeStamp;
                agentId = result.agentId;
                corpId = result.corpId;

                dd.config({
                    agentId: agentId,
                    corpId: corpId,
                    timeStamp: timeStamp,
                    nonceStr: nonceStr,
                    signature: signature,
                    jsApiList: [
                        'runtime.info',
                        'biz.contact.choose',
                        'device.notification.confirm',
                        'device.notification.alert',
                        'device.notification.prompt',
                        'biz.ding.post',
                        'biz.util.openLink'] //必填，需要使用的jsapi列表
                });

                dd.ready(function () {
                        console.log('dd.ready rocks!')

                        dd.runtime.info({
                            onSuccess: function (info) {
                                console.log('runtime info: ' + JSON.stringify(info));
//                                alert(JSON.stringify(info));
                            },
                            onFail: function (err) {
                                console.log('fail: ' + JSON.stringify(err));
//                                alert(JSON.stringify(err));
                            }
                        });

                        dd.runtime.permission.requestAuthCode({
                            corpId: corpId, //企业id
                            onSuccess: function (info) {
                                console.log('authcode' + info.code);
//                                alert('authcode = '+info.code);
                                Window.authcode = info.code;   //免登授权码
                            },
                            onFail: function (err) {
                                console.log('requestAuthCode fail: ' + JSON.stringify(err));
//                                alert(JSON.stringify(err));
                            }
                        });
                    }
                );
            })
    });

         With the returned result, we can get the free code 
and get the free code, and we can get the user's information through the free code.