公众号node服务与前端关联

一:前期准备:

首先你需要一台服务器,:阿里云或者腾讯云啥的,最便宜的可以选择类似阿里云这种轻量级服务器,和域名配置好A记录。

需要在服务器打架node环境:可以找客服帮忙基本配置环境搭好。

需要有一个自己的公众号:官方详见文档

二:配置

公众号配置:IP白名单:为服务器IP地址。


公众号配置:JS接口安全域名。


node后端JS代码:

var express = require('express'); //node的一个框架 就是相当于jquery

var path = require('path');

var request = require('request');

var ejs = require('ejs'); // 后台模板库

var wechat = require('wechat'); //第三方处理微信推送的库

var https = require('https'); // node 端 请求别的服务的模块

var sign = require('sign'); //微信提供的签名工具

const stringRandom = require('string-random')

const crypto = require('crypto')

var app = express();

app.use("*", function (req, res, next) {

  res.header('Access-Control-Allow-Origin', '*');

  res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");

  res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");

  // if (req.method === 'OPTIONS') {

  //  res.send(200)

  // } else {

  //  next()

  // }

    next()

});

const getSha1 = function(str) {

  var sha1 = crypto.createHash("sha1"); //定义加密方式:md5不可逆,此处的md5可以换成任意hash加密的方法名称;

  sha1.update(str);

  var res = sha1.digest("hex"); //加密后的值d

  return res;

};

const getSignature = function(nowUrl,key){

  let noncestr = stringRandom(16,{numbers:false})

  let timestamp = new Date().getTime()

  let jsapi_ticket = `jsapi_ticket=${key}&noncestr=${noncestr}×tamp=${timestamp}&url=${nowUrl}`;

  let signature = getSha1(jsapi_ticket)

  return {

    noncestr,

    timestamp,

    signature

  }

}

app.set('views', './views');

app.engine('.html', ejs.__express);

app.set('view engine', 'html');

app.use(express.static('./'));

//发送请求

app.get('/index', function(req, res) {

    console.log('this is index')

    res.render('index');

});

//处理URL 验证的 微信服务器要通过get请求来测试的

app.get('/weixin', wechat('wechat', function(req, res, next) {

    console.log('true');

}));

//处理后台获取签名的请求

app.post('/getSignature', function(req, res) {

    let nowurl = req.headers['referer']

    console.log(nowurl)

    console.log('this is getSignature')

    var token = 'wechat',

        appsecret = '', //你申请的

        APPID = '', //你申请的id

        url = '' //JS接口安全域名 参与签名用的

    Res = res;

    //发送https get请求 获取 access_token;l

    https.get("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + APPID + "&secret=" + appsecret, function(res) {

        var datas = [];

        var size = 0;

        res.on('data', function(data) {

            datas.push(data);

            size += data.length;

        });

        res.on("end", function() {

            var buff = Buffer.concat(datas, size);

            var result = buff.toString();

            //console.log(JSON.parse(result).access_token);

            // 获取 jsapi_ticket //异步嵌套是不合理的 不推荐这样 使用promise

            https.get('https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=' + JSON.parse(result).access_token + '&type=jsapi', function(res) {

                var datas = [];

                var size = 0;

                res.on('data', function(data) {

                    datas.push(data);

                    size += data.length;

                });

                res.on('end', function() {

                    var buff = Buffer.concat(datas, size);

                    var rlt = buff.toString();

                    let resultData = getSignature(nowurl,JSON.parse(rlt).ticket)

                    rlt = Object.assign(JSON.parse(rlt),resultData)

                    // var config = sign(JSON.parse(rlt).ticket, url);

                    // console.log(111,config)

                    Res.json(rlt);

                });

            }).on('error', function(e) {

                console.log("Got error: " + e.message);

            })

        });

    }).on('error', function(e) {

        console.log("Got error: " + e.message);

    });

});

var server = app.listen(80, function() {

    var host = server.address().address;

    var port = server.address().port;

    console.log('Example app listening at http://%s:%s', host, port);

});

前端代码:

先设置wx.config

this.$post("/getSignature", {}).then(config => {

                console.log(config)

                // config = JSON.parse(config);

                if (config != undefined && config != null) {

                    wx.config({

                        debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。

                        appId: '', // 必填,appID公众号的唯一标识

                        timestamp: config.timestamp, // 必填,生成签名的时间戳

                        nonceStr: config.noncestr, // 必填,生成签名的随机串

                        signature: config.signature,// 必填,签名,见附录1

                        jsApiList: ['getLocation', 'scanQRCode', 'closeWindow', 'checkJsApi', 'startRecord', 'stopRecord', 'translateVoice', 'openCard','chooseImage']

                        // 必填,需要使用的JS接口列表,所有JS接口列表见附录2

                    });

                    // alert('配置成功!');

                }

            });

在调取微信接口

wx.ready(function () {

    wx.getLocation({

        type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'

        success: function (res) {

            var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90

            var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。

            var speed = res.speed; // 速度,以米/每秒计

            var accuracy = res.accuracy; // 位置精度

            console.log(latitude,longitude,speed,accuracy)

            alert(latitude,longitude,speed,accuracy)

        }

    });

    wx.scanQRCode({

        needResult: 0, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,

        scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有

        success: function (res) {

            var result = res.resultStr; // 当needResult 为 1 时,扫码返回的结果

            alert(result);

        }

    });

})

你可能感兴趣的:(公众号node服务与前端关联)