La vista web del subprograma WeChat llama directamente a las funciones relacionadas con el escaneo de WeChat

La vista web del subprograma WeChat llama directamente a las funciones relacionadas con el escaneo de WeChat

Cuando hacemos desarrollo web, seguimos el proceso de desarrollo web. Cuando necesitamos trasplantar rápidamente el proyecto web al mini programa, debemos utilizar el componente webview proporcionado por el mini programa. En cuanto a sus beneficios y configuración de plataforma de desarrollo, puedes configurarlo según la plataforma pública WeChat,
aquí hablaré principalmente sobre cómo utilizar funciones avanzadas en webview (html).
Primero que nada: cuando no obtenemos la configuración de jssdk, solo podemos usar algunas funciones básicas como los saltos. Pero cuando se trata de llamar directamente a funciones avanzadas como el escaneo de WeChat y abrir álbumes de fotos en la vista web (nuestro html), debe registrar este archivo html.

 Lógica de front-end:

El proceso específico es:

          ① Cuando se inicializa la página HTML, solicita datos de configuración básicos de nuestro backend. El parámetro es la ruta URL de la página actual, incluida la parte del parámetro.
          ② Obtenga los datos y llame al método wx.config para registrar esta página html (tenga en cuenta que la premisa es que el html ha cargado js antes de que pueda llamar a <script type="text/javascript" src="https://res. wx.qq.com/open/js/jweixin-1.3.2.js"></script>) 
          ③Después de que el método de configuración sea exitoso, podrá utilizar algunas funciones avanzadas.

Visualización de código específico

<!-- 这个地方是在加载配置，实际页面中是页面渲渲染时通过“java后台jssdkconfig”接口从我们的后台获取参数，然后赋值给下面对应的字段”-->
  <script type="text/javascript">
        wx.config({
           debug: true,//是否开启调试
           appId: 'xxxxxxxxxxx',//小程序appid
           timestamp: '1534925207',//时间搓，单位秒
           nonceStr: 'HT5Ab5moviaVdp7XegNnRBivrETgPmu2',//随机字符串
           signature: 'd73acd8eec5a4c1a6a86c7e0517bedff78e72fd9',//签名md5
           jsApiList: ['startRecord','stopRecord','playVoice','uploadVoice','downloadVoice','onVoiceRecordEnd','translateVoice','downloadVoice', 'onMenuShareTimeline','onMenuShareAppMessage','scanQRCode','getLocation','chooseImage','getLocalImgData','uploadImage']//当前html需要用到的接口
          });
  </script>

Lógica JAVA de fondo:

 Flujo de procesamiento:

    ① La página solicita la información de configuración por primera vez. El fondo utiliza la interfaz WeChat para calcular la información de configuración, la almacena y luego la devuelve al front-end. ② La página no se solicita por primera vez y 
    es Hace no más de dos horas, la información de configuración de la página correspondiente se encuentra directamente y se devuelve al usuario. Más de 2 horas: si son más de dos horas, se vuelve a llamar a la interfaz de WeChat para calcular la información de configuración, regresar al usuario y actualizar los datos almacenados. (La clase de Java que uso aquí se almacena en la memoria. Cambiar al almacenamiento de la base de datos puede reducir la memoria del servidor en consecuencia)
    ③¿Por qué es necesario juzgar si se necesitan más de dos horas para volver a calcular? Debido a que la primera página generalmente se actualiza con más frecuencia y, en segundo lugar, la interfaz de configuración jssdk de WeChat tiene un límite en la cantidad de veces que se puede usar y solo se puede obtener varias veces al día, por lo que no podemos calcularla cada vez. lo solicitamos.

Código detrás:

 /**
     * webview——JSSDK使用配置信息获取
     */
    @ResponseBody
    @RequestMapping(value = "User/GetJsSdk_Config")
    public Map<String, Object> GetJsSdk_Config(@RequestBody HashMap<String, Object> data, HttpSession session)
            throws KeyStoreException, NoSuchAlgorithmException, CertificateException, Exception {
        Map<String, Object> resultmap = new HashMap<String, Object>();
        User user = (User) session.getAttribute("user");
        if (user == null) {
            resultmap.put("state", false);
            resultmap.put("message", "未登录或登录超时");
            return resultmap;
        }
        if (data.get("url") == null) {
            resultmap.put("state", false);
            resultmap.put("message", "参数不全");
            return resultmap;
        }
        String url = data.get("url").toString();

        Map<String, Object> one_jassdkcofig = AllJssdkConfig.TheconfigBeoVerdue(url);
        if (one_jassdkcofig != null)// 如果当前页面配置信息还未过期
        {
            resultmap.put("sate", true);
            resultmap.put("message", "");
            resultmap.put("beta", one_jassdkcofig.get("beta"));
            resultmap.put("debug", one_jassdkcofig.get("debug"));// 是否开启调试
            resultmap.put("appId", one_jassdkcofig.get("appId"));// 公众号的appid
            resultmap.put("timestamp", one_jassdkcofig.get("timestamp"));// 时间搓、秒
            resultmap.put("nonceStr", one_jassdkcofig.get("nonceStr"));// 随即字符
            resultmap.put("signature", one_jassdkcofig.get("signature"));// sha1加密码
            resultmap.put("jsApiList", "所有需要用到的接口");// 需要使用的接口
            System.out.println("找到配置！不用计算");
            System.out.println(resultmap);
            return resultmap;
        }

        String token = user_wxAPI.GetInstance().get_jssdk_accesstoken();
        String ticket = user_wxAPI.GetInstance().get_jssdk_ticket(token);
        resultmap = user_wxAPI.GetInstance().get_jssdk_config(ticket,url);
        if (resultmap!=null) {
            resultmap.put("sate", true);
            resultmap.put("message", "");
            AllJssdkConfig.SaveOneConfig(url, resultmap);// 更新jasdk数组配置
            System.out.println("没有找到配置！重新计算");
            System.out.println(resultmap);
            return resultmap;
        } else {
            resultmap=new HashMap<String, Object>();
            resultmap.put("sate", false);
            resultmap.put("message", "后台获取jssdk_ticket出错");
            return resultmap;
        }
    }