企业微信对接微信客服获取客户详情

摘要：

企业微信对外客服，客户是微信接收的！但是如果用户使用的企业微信的账号和微信的一样的话，那客户详情就好办了！但是任何一个微信都可以是客户的！所以就要微信去静默授权获取到openid和unionid作为标识，企业微信侧边栏获取的userId给服务端对接对应的unionid，就知道对方微信客户的详情！

外部联系人openid转换
userid与openid互换

企业微信侧边栏抓取userId：

<template>
  <div class="customerDetail">
    <div class="customerHeader">
      <img :src="customerDetail.head_img || '../../assets/personImg.png'" />
      <div class="text">
        <span>{{customerDetail.nick_name || '--'}}</span>
        <span>@微信</span>
      </div>
    </div>

    <div class="content">
      <div class="contentItem">
        <span>事&ensp;业&ensp;部</span>
        <span>{{customerDetail.division_name || '--'}}</span>
      </div>
      <div class="contentItem">
        <span>门店编码</span>
        <span>{{customerDetail.store_code || '--'}}</span>
      </div>
      <div class="contentItem">
        <span>所属门店</span>
        <span>{{customerDetail.store_name || '--'}}</span>
      </div>
      <div class="contentItem">
        <span>咨&ensp;询&ensp;人</span>
        <span>{{customerDetail.realname || '--'}}</span>
      </div>
      <div class="contentItem">
        <span>联系方式</span>
        <span>{{customerDetail.phone || '--'}}</span>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        userId: '', //外部联系人ID
        customerDetail: []
      }
    },
    created() {
      this.getWxWorkInfo();
    },
    methods: {
      getWxWorkInfo() {
        let that = this;
        var urls = window.location.href;
        var url = urls.split("#");
        that.$axios
          .get("/commonNoSession.do", {
            params: {
              method: that.$method.WECHAT_TOKEN_GET,
              data: {
                url: url[0],
                appKey: "xxx",
              },
            },
          })
          .then((res) => {
            if (res.data.code == 0) {
              wx.config({
                beta: true, // 必须这么写，否则wx.invoke调用形式的jsapi会有问题
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: res.data.data.corpid, // 必填，企业微信的corpID
                timestamp: res.data.data.timestamp, // 必填，生成签名的时间戳
                nonceStr: res.data.data.noncestr, // 必填，生成签名的随机串
                signature: res.data.data.signature, // 必填，签名，见 附录-JS-SDK使用权限签名算法
                jsApiList: ["getCurExternalContact"], // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
              });
              wx.ready(() => {
                wx.agentConfig({
                  debug: false,
                  corpid: res.data.data.corpid,
                  agentid: res.data.data.agentid,
                  timestamp: res.data.data.timestamp,
                  nonceStr: res.data.data.noncestr,
                  signature: res.data.data.signature,
                  jsApiList: ["getCurExternalContact"],
                  success: function(response) {
                    wx.invoke('getCurExternalContact', {}, function(subRes) {
                      if (subRes.err_msg == "getCurExternalContact:ok") {
                        that.userId = subRes.userId; //返回当前外部联系人userId
                        that.getCustomerDetail();
                      } else {
                        //错误处理
                        alert(JSON.stringify(subRes) + '获取当前外部联系人userId失败！')
                      }
                    });
                  },
                  fail: function(response) {
                    if (response.errMsg.indexOf("function not exist") > -1) {
                      alert('版本过低请升级')
                    }
                  },
                });
              });
            }
          })
          .catch((error) => {});
      },
      getCustomerDetail() {
        let data = {
          external_userid: this.userId
        }
        this.$axios
          .get("/commonNoSession.do", {
            params: {
              method: this.$method.USERWECHATCUSTOMER_CUSTOMER_GET,
              data: data,
            },
          })
          .then((response) => {
            let res = response.data;
            if (res.code == 0) {
              this.customerDetail = res.data;
            }
          })
      }
    }
  }
</script>

<style lang="less" scoped>
  .customerDetail {
    padding: 8vw;

    .customerHeader {
      display: flex;
      align-items: center;

      img {
        width: 18vw;
        height: 18vw;
        border-radius: 1vw;
        margin-right: 5vw;
      }

      .text {
        span:nth-child(1) {
          font-size: 5vw;
          font-weight: bold;
        }

        span:nth-child(2) {
          color: #21BE59;
        }
      }
    }

    .content {
      font-size: 4.3vw;
      padding: 10vw 0;
      text-align: left !important;

      .contentItem {
        padding: 2vw 0;

        span:nth-child(1) {
          width: 5vw;
          padding-right: 5vw;
          color: #939393;
        }

        span:nth-child(2) {}
      }
    }
  }
</style>

微信去静默授权获取到openid和unionid
假如没有关注公众号引导去关注公众号

<template>
  <div class="myChart">
    <Popup v-model="pickershow" round>
      <img src="../../assets/snmy_sheq.jpg" />
    </Popup>
  </div>
</template>

<script>
  import {
    Toast,
    Popup
  } from "vant";
  export default {
    components: {
      Toast,
      Popup
    },
    data() {
      return {
        pickershow: false
      }
    },
    created() {
      this.getCode()
    },
    methods: {
      getCode() {
        let appid = "wxcsssssssss"; //个人开发者appid
        let redirect = encodeURIComponent(`https://xxxx.xxxxxxx.com/phone.html?#/myChart`); //重定向回来的地址
        let wx_code = this.getUrlParam("code"); // 截取url中的code
        if (!wx_code) {
          window.location.href =
            `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`;
        } else {
          this.getOpenId(wx_code); //把code传给后台获取用户信息
        }
      },
      getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]);
        return null;
      },
      getOpenId(code) {
        let data = {
          type: "community",
          code: code
        }
        this.$axios
          .get("/commonNoSession.do", {
            params: {
              method: this.$method.USERWECHAT_DATA_USER_WECHAT_GET,
              data: data
            },
          })
          .then((response) => {
            let res = response.data;
            if (res.code == 0) {
              this.addUserid(res.data.openid, res.data.unionid)
              if (!res.data.unionid) {
                this.pickershow = true;
              }
            }
          })
      },
      addUserid(openid, unionid) {
        let data = {
          openid: openid,
          unionid: unionid || ''
        }
        this.$axios
          .get("/commonNoSession.do", {
            params: {
              method: this.$method.USERWECHATCUSTOMER_USERID_TO_CONVERT_FROM_ADD,
              data: data
            },
          })
          .then((response) => {
            // wx.close();
            // window.close();
            WeixinJSBridge.call('closeWindow');
            if (res.code == 0) {

            }
          })
      }
    }
  }
</script>

<style>
</style>