目錄
欢迎来到微信jsapi测试界面-V型知识库
首頁 微信小程式 微信開發 微信開發之判斷目前客戶端是否支援指定的js介面的方法

微信開發之判斷目前客戶端是否支援指定的js介面的方法

Mar 26, 2017 pm 02:55 PM
微信開發

由於微信jsapi的使用介面有使用權限,所以我們有必要判斷客戶端是否支援js介面。

基礎介面、判斷目前客戶端版本是否支援指定JS介面

第一、jsapi.jsp程式碼

##
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>微信jsapi测试-V型知识库</title>
    <meta name="viewport" content="width=320.1,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
   <script src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"> </script> 
</head>
  <body>
  <center><h3 id="欢迎来到微信jsapi测试界面-V型知识库">欢迎来到微信jsapi测试界面-V型知识库</h3></center>
  <br>
     <p>timestamp:${ timestamp}</p>  
     <p>nonceStr:${ nonceStr}</p>  
     <p>signature:${ signature}</p>  
     <p>appId:${ appId}</p>  
     <!--   
    <input type="button" value="upload" onclick="uploadImg();"/>  
    <input type="button" value="获取当前位置" onclick="getLocation();"/>  
     -->
     <p>基础接口之判断当前客户端是否支持指定的js接口</p>   
     <input type="button" value="checkJSAPI" id="checkJsApi">
  <br>
  <script type="text/javascript">
  wx.config({  
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。  
    appId: &#39;${appId}&#39;, // 必填,公众号的唯一标识  
    timestamp: &#39;${ timestamp}&#39; , // 必填,生成签名的时间戳  
    nonceStr: &#39;${ nonceStr}&#39;, // 必填,生成签名的随机串  
    signature: &#39;${ signature}&#39;,// 必填,签名,  
    jsApiList: [&#39;chooseImage&#39;,&#39;getLocation&#39;,&#39;openLocation&#39;] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2  
});  
wx.ready(function(){  
    // 1 判断当前版本是否支持指定 JS 接口,支持批量判断
  document.querySelector(&#39;#checkJsApi&#39;).onclick = function () {
    wx.checkJsApi({
      jsApiList: [
        &#39;getNetworkType&#39;,
        &#39;previewImage&#39;
      ],
      success: function (res) {
        alert(JSON.stringify(res));
      }
    });
  };
});  
 //初始化jsapi接口 状态
wx.error(function (res) {
  alert("调用微信jsapi返回的状态:"+res.errMsg);
});
 </script>
  </body>
</html>
登入後複製


點選按鈕checkJSAPI會觸發wx.ready(function(){})方法體中的方法,並且會在介面中彈出是否支援的狀態.

##參數名稱說明appId
網頁中的四個必要參數,如下方表格

必填,公眾號碼的唯一識別 

timestamp必填,產生簽章的時間戳 

#nonceStr必填,產生簽章的隨機串 

signature必填,簽名#那麼這四個參數是怎麼來的呢,請看下面第二步驟。 #我們在跳到jsapi.jsp介面之前,必須取得上面四個參數才能成功調用微信jsapi的接口,也就是說上面四個參數是調用微信jsapi接口的憑證,缺一不可。 ,可登陸微信公眾平台查看。到jsapi.jsp介面,使用者在公眾號中點選這個連結位址,跳到jsapi.jsp介面,我們在

wxJsAPIServlet中必須取得上述三個參數,並且把參數儲存到request物件##在 #中,然後jsp介面取出。

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

System.out.println("wxJSAPI====================");

String jsapi_ticket =JsapiTicketUtil.getJSApiTicket();;

<a href="http://www.php.cn/code/9794.html" target="_blank">Map</a><String,String> map = Sign.sign(jsapi_ticket, "http://www.vxzsk.com/weChat/wxJsAPIServlet");

String timestamp = map.get("timestamp");

String nonceStr = map.get("nonceStr");

String signature = map.get("signature");

String appId = "你自己的应用id";

request.setAttribute("appId", appId);

request.setAttribute("timestamp", timestamp);

request.setAttribute("signature",signature);

request.setAttribute("nonceStr", nonceStr);

request.getRequestDispatcher("jsapi/jsapi.jsp").forward(request, response);

}

注意用户点击的地址必须和签名算法中的地址保持一致,如果要带参数那么参数也要带上而且参数的顺序不能改变,否则签名算法得到的签名 字符串和用户请求的地址的签名字符串不一致导致调用jsapi失败。

当然我在这里用的servlet跳转,读者也可以把doGET方法中的代码复制到spring的一个普通controller中或者struts中的一个普通的action方法中。

Sign.java代码

package com.test.util;
import java.util.UUID;
import java.util.Map;
import java.util.HashMap;
import java.util.Formatter;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.io.UnsupportedEncodingException;  
  public class Sign {
    public static Map<String, String> sign(String jsapi_ticket, String url) {
        Map<String, String> ret = new HashMap<String, String>();
        String nonce_str = create_nonce_str();
        String timestamp = create_timestamp();
        String string1;
        String signature = "";
        //注意这里参数名必须全部小写,且必须有序
        string1 = "jsapi_ticket=" + jsapi_ticket +
                  "&noncestr=" + nonce_str +
                  "&timestamp=" + timestamp +
                  "&url=" + url;
        System.out.println(string1);
        try
        {
            MessageDigest crypt = MessageDigest.getInstance("SHA-1");
            crypt.reset();
            crypt.update(string1.getBytes("UTF-8"));
            signature = byteToHex(crypt.digest());
        }
        catch (NoSuchAlgorithmException e)
        {
            e.printStackTrace();
        }
        catch (UnsupportedEncodingException e)
        {
            e.printStackTrace();
        }
        ret.put("url", url);
        ret.put("jsapi_ticket", jsapi_ticket);
        ret.put("nonceStr", nonce_str);
        ret.put("timestamp", timestamp);
        ret.put("signature", signature);
        return ret;
    }
    private static String byteToHex(final byte[] hash) {
        Formatter formatter = new Formatter();
        for (byte b : hash)
        {
            formatter.format("%02x", b);
        }
        String result = formatter.toString();
        formatter.close();
        return result;
    }
    private static String create_nonce_str() {
        return UUID.randomUUID().toString();
    }
    private static String create_timestamp() {
        return Long.toString(System.currentTimeMillis() / 1000);
    }
    public static void main(String[] args) {
        String jsapi_ticket =JsapiTicketUtil.getJSApiTicket();
        // 注意 URL 一定要动态获取,不能 hardcode
        String url = "http://www.vxzsk.com/xx/x.do";//url是你请求的一个action或者controller地址,并且方法直接跳转到使用jsapi的jsp界面
        Map<String, String> ret = sign(jsapi_ticket, url);
        for (Map.Entry entry : ret.entrySet()) {
            System.out.println(entry.getKey() + ", " + entry.getValue());
        }
    };
}
登入後複製


JsapiTicketUtil.java代码

package com.test.util;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.MalformedURLException;
import java.net.URL;
import java.net.URLConnection;
import net.sf.json.JSONObject;
import com.test.weixin.TestAcessToken;
public class JsapiTicketUtil {
    /***
     * 模拟get请求
     * @param url
     * @param charset
     * @param timeout
     * @return
     */
     public static String sendGet(String url, String charset, int timeout)
      {
        String result = "";
        try
        {
          URL u = new URL(url);
          try
          {
            URLConnection conn = u.openConnection();
            conn.connect();
            conn.setConnectTimeout(timeout);
            BufferedReader in = new BufferedReader(new InputStreamReader(conn.getInputStream(), charset));
            String line="";
            while ((line = in.readLine()) != null)
            {
              result = result + line;
            }
            in.close();
          } catch (IOException e) {
            return result;
          }
        }
        catch (MalformedURLException e)
        {
          return result;
        }
        return result;
      }
     public static String getAccessToken(){
            String appid="你公众号基本设置里的应用id";//应用ID
            String appSecret="你公众号基本设置里的应用密钥";//(应用密钥)
            String url ="https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+appid+"&secret="+appSecret+"";
            String backData=TestAcessToken.sendGet(url, "utf-8", 10000);
            String accessToken = (String) JSONObject.fromObject(backData).get("access_token");  
            return accessToken;
     }
    public static String getJSApiTicket(){ 
        //获取token
        String acess_token= JsapiTicketUtil.getAccessToken();
        String urlStr = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token="+acess_token+"&type=jsapi";  
        String backData=TestAcessToken.sendGet(urlStr, "utf-8", 10000);  
        String ticket = (String) JSONObject.fromObject(backData).get("ticket");  
        return  ticket;  
    }  
    public static void main(String[] args) {
        String jsapiTicket = JsapiTicketUtil.getJSApiTicket();
        System.out.println("调用微信jsapi的凭证票为:"+jsapiTicket);
    }
}
登入後複製


第三、效果圖如下

微信開發之判斷目前客戶端是否支援指定的js介面的方法

#圖中的"微信jsapi測試介面"連接為簽章演算法中的連結位址

微信開發之判斷目前客戶端是否支援指定的js介面的方法

微信開發之判斷目前客戶端是否支援指定的js介面的方法

#

以上是微信開發之判斷目前客戶端是否支援指定的js介面的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

PHP微信開發:如何實作訊息加密解密 PHP微信開發:如何實作訊息加密解密 May 13, 2023 am 11:40 AM

PHP是一種開源的腳本語言,廣泛應用於網頁開發和伺服器端編程,尤其在微信開發中得到了廣泛的應用。如今,越來越多的企業和開發者開始使用PHP進行微信開發,因為它成為了真正的易學易用的開發語言。在微信開發中,訊息的加密和解密是一個非常重要的問題,因為它們涉及資料的安全性。對於沒有加密和解密方式的消息,駭客可以輕鬆取得其中的數據,對用戶造成威脅

用PHP開發微信群發工具 用PHP開發微信群發工具 May 13, 2023 pm 05:00 PM

隨著微信的普及,越來越多的企業開始將其作為行銷工具。而微信群發功能,則是企業進行微信行銷的重要手段之一。但是,如果只依靠手動發送,對於行銷人員來說是一件極為費時費力的工作。所以,開發一款微信群發工具就顯得格外重要。本文將介紹如何使用PHP開發微信群發工具。一、準備工作開發微信群發工具,我們需要掌握以下幾個技術點:PHP基礎知識微信公眾平台開發開發工具:Sub

PHP微信開發:如何實現使用者標籤管理 PHP微信開發:如何實現使用者標籤管理 May 13, 2023 pm 04:31 PM

在微信公眾號開發中,使用者標籤管理是一個非常重要的功能,可以讓開發者更了解和管理自己的使用者。本篇文章將介紹如何使用PHP實作微信使用者標籤管理功能。一、取得微信用戶openid在使用微信用戶標籤管理功能之前,我們首先需要取得用戶的openid。在微信公眾號開發中,透過使用者授權的方式取得openid是比較常見的做法。在使用者授權完成後,我們可以透過以下程式碼取得用

PHP微信開發:如何實作群發訊息傳送記錄 PHP微信開發:如何實作群發訊息傳送記錄 May 13, 2023 pm 04:31 PM

隨著微信成為了人們生活中越來越重要的通訊工具,其敏捷的訊息傳遞功能迅速受到廣大企業和個人的青睞。對企業而言,將微信發展為一個行銷平台已經成為趨勢,而微信開發的重要性也逐漸凸顯。在其中,群發功能更是被廣泛使用,那麼,作為PHP程式設計師,如何實現群發訊息發送記錄呢?以下將為大家簡單介紹一下。 1.了解微信公眾號相關開發知識在了解如何實現群發訊息發送記錄之前,我

PHP微信開發:如何實現客服聊天視窗管理 PHP微信開發:如何實現客服聊天視窗管理 May 13, 2023 pm 05:51 PM

微信是目前全球用戶規模最大的社群平台之一,隨著行動網路的普及,越來越多的企業開始意識到微信行銷的重要性。在進行微信行銷時,客服服務是至關重要的一環。為了更好地管理客服聊天窗口,我們可以藉助PHP語言進行微信開發。一、PHP微信開發簡介PHP是一種開源的伺服器端腳本語言,廣泛用於Web開發領域。結合微信公眾平台提供的開發接口,我們可以使用PHP語言進行微信

PHP微信開發:如何實現投票功能 PHP微信開發:如何實現投票功能 May 14, 2023 am 11:21 AM

在微信公眾號開發中,投票功能經常被運用。投票功能是讓使用者快速參與互動的好方式,也是舉辦活動和調查意見的重要工具。本文將為您介紹如何使用PHP實作微信投票功能。在取得微信公眾號授權首先,你需要取得微信公眾號的授權。在微信公眾平台上,你需要設定微信公眾號碼的api地址、官方帳號和公眾號碼對應的token。在我們使用PHP語言開發的過程中,我們需要使用微信官方提供的PH

使用PHP實現微信公眾號開發的步驟 使用PHP實現微信公眾號開發的步驟 Jun 27, 2023 pm 12:26 PM

如何使用PHP實現微信公眾號開發微信公眾號已經成為了許多企業推廣和互動的重要管道,而PHP作為常用的Web語言,也可以用來進行微信公眾號的開發。本文將介紹使用PHP實現微信公眾號開發的具體步驟。第一步:取得微信公眾號的開發者帳號在開始微信公眾號開發之前,需要先去申請一個微信公眾號的開發者帳號。具體的註冊流程可參考微信公眾平台的官方網

如何使用PHP進行微信開發? 如何使用PHP進行微信開發? May 21, 2023 am 08:37 AM

隨著網路和行動智慧型裝置的發展,微信成為了社交和行銷領域不可或缺的一部分。在這個越來越數位化的時代,如何使用PHP進行微信開發已經成為了許多開發者的關注點。本文主要介紹如何使用PHP進行微信發展的相關知識點,以及其中的一些技巧和注意事項。一、開發環境準備在進行微信開發之前,首先需要準備好對應的開發環境。具體來說,需要安裝PHP的運作環境,以及微信公眾平台提

See all articles