收藏
回答

JSSDK调用,怎么一直提示invalid signature?

调用微信JSSDK一直提示无效签名,用微信提供的工具检查了签名,都是比对得上的,也按照官方文档对url进行截取掉#,前后台的appid也是一样的,还是出现invalid signature,然后同样的前后台代码,用我同事的电脑调用是可以调微信jssdk的摄像头接口的,防火墙也是关闭了,都不行,这是什么问题呢?



下面是调用的代码

$(function(){
$(".butt").bind("click",function(){
console.log((location.href.split('#')[0]))
var signUrl = encodeURIComponent(window.location.href.split('#')[0]);
     $.ajax({
url: "http://hzf.free.idcfengye.com/ncgascip-app/weixinsdk/config",
        method: "post",
        data: {
url: signUrl
},
        success: function (data) {
console.log(data);
           console.log("wx.config() ---> 接收后台返回的参数");
           wx.config({
debug: true,
              appId: "wx7728a7e3070b5acd",
              timestamp: data.data.timestamp,
              nonceStr: data.data.nonceStr,
              signature: data.data.signature,
              jsApiList: [ 'chooseImage', 'previewImage', 'uploadImage', 'downloadImage', 'chooseWXPay', 'getLocalImgData' ]
});
           wx.error(function (res) {
console.log(res);
                  });
           wx.ready(function(){
wx.chooseImage({
count: 1, // 默认9
                 sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有
                 sourceType: ['camera'], // 可以指定来源是相册还是相机,默认二者都有
                 success: function (res) {
$("#photolist").html(""); //每次选择图片完成后都清空之前已经添加的html节点
                   let rows = ""; //声明一个空字符串用于保存循环出来的html
                   // var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
                   images.localId = images.localId.concat(res.localIds);
                   if (window.__wxjs_is_wkwebview) { //判断ios是不是用的 wkwebview 内核
                    for (var i = 0; i < images.localId.length; i++) {
wx.getLocalImgData({ //循环调用 getLocalImgData
                       localId: res.localIds[i],
                       // 图片的localID
                       success: function(res) {
var localData = res.localData; // localData是图片的base64数据,可以用img标签显示
                         localData = localData.replace('jgp', 'jpeg'); //iOS 系统里面得到的数据,类型为 image/jgp,因此需要替换一下
                         ioslocId.push(localData) //把base64格式的图片添加到ioslocId数组里 这样该数组里的元素都是base64格式的
                         rows = "";
                         for (var j = 0; j < ioslocId.length; j++) {
rows += `<div class = "z_file" style = "background-image: url(` + ioslocId[j] + `);height:100px;"> <div class = "delete"data - id = "` + j + `" > </div></div> `;
                         }
$("#photolist").html(rows);
                       },
                       fail: function(res) {
alert("res");
                       }
});
                    }
alert(rows)
} else { //如果不是用的wkwebview 内核 或者是用的安卓系统 执行下面的循环
                    $.each(images.localId,
                       function(index, el) {
rows += `<div class = "z_file" style = "background-image: url(` + el + `); height:100px;" > <div class = "delete" data-id= "` + index + `"> </div></div>`;
                       }
);
                    $("#photolist").html(rows);
                   }
}
});
           })
}
});
  });
});

后台代码

package com.ucap.ncgascip.app.controller.weixin;

import com.ucap.ncgascip.app.util.WeiXinUtil;
import com.ucap.ncgascip.base.data.RestResultBuilder;
import com.ucap.ncgascip.base.data.ResultModel;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import java.io.UnsupportedEncodingException;
import java.net.URLDecoder;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.util.Formatter;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

@RestController
@RequestMapping("/weixinsdk")
public class WeixinJsSdkController {

private static final String jsapi_ticket = "";

   @RequestMapping(value = "/config")
public ResultModel getConfig(@RequestParam(name = "url") String url) {
System.out.println(url);
       Map<String, String> ret = new HashMap<>();
       String jsapi_ticket = WeiXinUtil.getJsapiTicket();
       System.out.println(URLDecoder.decode(url));
       ret = sign(jsapi_ticket,URLDecoder.decode(url));
       return RestResultBuilder.builder().data(ret).build();
   }

public 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  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 String create_nonce_str() {
return UUID.randomUUID().toString();
   }

private String create_timestamp() {
return Long.toString(System.currentTimeMillis() / 1000);
   }

}


public synchronized static String getJsapiTicket() {

//将用户信息写入redis
   String jsApiTicket = null;

   String key = WX_JSAPITICKET;

   // 获取redis的微信token
   Object jsApiTicketObject = CacheUtil.getCache(CacheCodeEnum.APPWEB.getValue()).get(key);

   if (jsApiTicketObject != null) {

jsApiTicket = String.valueOf(jsApiTicketObject);

   } else {
try {
Ticket ticket = getJsSdkComponent().getJsApiTicket();
           if (ticket != null) {
jsApiTicket = ticket.getTicket();
               long overTime = ticket.getExpires_in() / 60;
               CacheUtil.getCache(CacheCodeEnum.APPWEB.getValue()).add(key, jsApiTicket, overTime);
               logger.info("catch的jsApiTicket值" + jsApiTicket);
           }
} catch (Exception e) {
e.printStackTrace();
       }
}
return jsApiTicket;
}



最后一次编辑于  2019-08-16
回答关注问题邀请回答
收藏

6 个回答

  • 辰尘
    辰尘
    2020-03-23

    请问排查出问题所在了吗?


    2020-03-23
    有用
    回复
  • 威威酱
    威威酱
    2019-12-27

    遇到同样的问题,签名验证成功的,url自己写死试了好多种,就是无效签名。请问你解决了吗?

    2019-12-27
    有用
    回复
  • 😃
    😃
    2019-09-29

    虽然url的可能性大,但是写死可以测出来。 看看你获取jsapi_ticket的时候,那个url对不对。type=jsapi还是type=wx_card。 两天的坑总结的经验

    送给坑里的兄弟,希望微信早日倒闭

    2019-09-29
    有用
    回复
  • 未命名科技
    未命名科技
    2019-08-16

    发现你之前提过这个问题了。这种问题都是自己调用的问题,也只能手动排查了。而且像我上次说的,你向后端提交了个 encode 过的 url,后端得到的也肯定是 encode 过的,这一步至少是有问题的。你不如把后端代码也放出来吧。

    2019-08-16
    有用
    回复 4
    • H
      H
      2019-08-16
      你好,后台代码更新上去了,麻烦大佬帮忙看下
      2019-08-16
      回复
    • 未命名科技
      未命名科技
      2019-08-16回复H
      传到后端的 url 不要 encode。然后你是不是测试和正式环境用同个号了,access_token 是不是两端都获取冲突了。实在不行,github 找个成熟的工具库来调用吧。
      2019-08-16
      回复
    • H
      H
      2019-08-17
      不encode,url的地址就是乱码了,我现在就一直在用测试号,而且签名跟工具签名对的上,同样代码在我同事电脑可以调用成功,这是不是电脑网络设置的问题
      2019-08-17
      回复
    • 未命名科技
      未命名科技
      2019-08-17回复H
      这是 post 又不是 get,怎么会乱码。
      2019-08-17
      回复
  • 思男
    思男
    2019-08-16

    验签坑很大,99%都是url问题,先尽量精简url试一下。

    2019-08-16
    有用
    回复 2
    • H
      H
      2019-08-16
      想问下,url这个问题怎么排查呢?
      2019-08-16
      回复
    • 😃
      😃
      2019-09-29
      虽然url的可能性大,但是写死可以测出来。 看看你获取jsapi_ticket的时候,那个url对不对。type=jsapi还是type=wx_card。 两天的坑总结的经验
      2019-09-29
      回复
  • TNT
    TNT
    2019-08-16

    验签 的方法都挨个跑了?

    1. 确认签名算法正确,可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验。

    2. 确认config中nonceStr(js中驼峰标准大写S), timestamp与用以签名中的对应noncestr, timestamp一致。

    3. 确认url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认),包括'http(s)://'部分,以及'?'后面的GET参数部分,但不包括'#'hash后面的部分。

    4. 确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。

    5. 确保一定缓存access_token和jsapi_ticket。

    6. 确保你获取用来签名的url是动态获取的,动态页面可参见实例代码中php的实现方式。如果是html的静态页面在前端通过ajax将url传到后台签名,前端需要用js获取当前页面除去'#'hash部分的链接(可用location.href.split('#')[0]获取,而且需要encodeURIComponent),因为页面一旦分享,微信客户端会在你的链接末尾加入其它参数,如果不是动态获取当前链接,将导致分享后的页面签名失败。 

    2019-08-16
    有用
    回复 3
    • H
      H
      2019-08-16
      这6个情况都跑了个遍,最奇怪的是同样代码在我同事电脑是可以调成功的
      2019-08-16
      回复
    • TNT
      TNT
      2019-08-16回复H
      那你本地时间是不是有问题哦
      2019-08-16
      回复
    • Miko。
      Miko。
      2019-08-29回复H
      老兄你这个问题解决了吗?
      2019-08-29
      回复
登录 后发表内容
问题标签