分类目录归档：小程序

如何在小程序中添加广告并获取收益

发表评论

1、申请成为流量主
首先进入小程序后台，点击流量主，点击开通。

同意协议并点击下一步。

填写个人的相关信息，包括身份证、收款账户等等。

最后提交，系统会进行审核，审核时间说是大约一周，但是我上午提交的申请，下午就通过了，效率还是挺高的。

2、在小程序中嵌入广告
审核通过后，后台界面会做出相应的变化，我们根据提示来创建广告位。

点击立即创建，填写广告的名称，点击确定。

创建好后就会显示在管理页面中，你也可以选择创建多个广告，但是有些广告的曝光率会比较低。

点击获取代码，将广告位的代码复制下来，并放在小程序的相应位置

然后打开微信开发者工具，打开你的小程序工程，在相应的位置粘贴广告代码，保存编译，广告就显示在小程序中了。至于广告的位置，建议放在底部最为合适，如果放在中间，用户的体验会非常的不好。

最后上传代码，并提交给后台进行审核，审核通过后，你的小程序便可以重新发布，小程序下面就出现了广告banner。扫描下面的小程序码查看效果，记得点一下小程序的广告哦，点广告的人一天都会有好运气的。

3、收益统计

在后台可以对小程序广告的点击次数、曝光量以及收益进行统计，平均点击一次的收益为0.5元，所以假如你的小程序的用户数量足够庞大，完全就能够实现财务自由了。


————————————————
原文链接：https://blog.csdn.net/qq_37954086/article/details/81052989

JS里的md5加密

发表评论

https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js

源码：

/*
 * JavaScript MD5
 * https://github.com/blueimp/JavaScript-MD5
 *
 * Copyright 2011, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * https://opensource.org/licenses/MIT
 *
 * Based on
 * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message
 * Digest Algorithm, as defined in RFC 1321.
 * Version 2.2 Copyright (C) Paul Johnston 1999 - 2009
 * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
 * Distributed under the BSD License
 * See http://pajhome.org.uk/crypt/md5 for more info.
 */

/* global define */

;(function ($) {
  'use strict'

  /*
  * Add integers, wrapping at 2^32. This uses 16-bit operations internally
  * to work around bugs in some JS interpreters.
  */
  function safeAdd (x, y) {
    var lsw = (x & 0xffff) + (y & 0xffff)
    var msw = (x >> 16) + (y >> 16) + (lsw >> 16)
    return (msw << 16) | (lsw & 0xffff)
  }

  /*
  * Bitwise rotate a 32-bit number to the left.
  */
  function bitRotateLeft (num, cnt) {
    return (num << cnt) | (num >>> (32 - cnt))
  }

  /*
  * These functions implement the four basic operations the algorithm uses.
  */
  function md5cmn (q, a, b, x, s, t) {
    return safeAdd(bitRotateLeft(safeAdd(safeAdd(a, q), safeAdd(x, t)), s), b)
  }
  function md5ff (a, b, c, d, x, s, t) {
    return md5cmn((b & c) | (~b & d), a, b, x, s, t)
  }
  function md5gg (a, b, c, d, x, s, t) {
    return md5cmn((b & d) | (c & ~d), a, b, x, s, t)
  }
  function md5hh (a, b, c, d, x, s, t) {
    return md5cmn(b ^ c ^ d, a, b, x, s, t)
  }
  function md5ii (a, b, c, d, x, s, t) {
    return md5cmn(c ^ (b | ~d), a, b, x, s, t)
  }

  /*
  * Calculate the MD5 of an array of little-endian words, and a bit length.
  */
  function binlMD5 (x, len) {
    /* append padding */
    x[len >> 5] |= 0x80 << (len % 32)
    x[((len + 64) >>> 9 << 4) + 14] = len

    var i
    var olda
    var oldb
    var oldc
    var oldd
    var a = 1732584193
    var b = -271733879
    var c = -1732584194
    var d = 271733878

    for (i = 0; i < x.length; i += 16) {
      olda = a
      oldb = b
      oldc = c
      oldd = d

      a = md5ff(a, b, c, d, x[i], 7, -680876936)
      d = md5ff(d, a, b, c, x[i + 1], 12, -389564586)
      c = md5ff(c, d, a, b, x[i + 2], 17, 606105819)
      b = md5ff(b, c, d, a, x[i + 3], 22, -1044525330)
      a = md5ff(a, b, c, d, x[i + 4], 7, -176418897)
      d = md5ff(d, a, b, c, x[i + 5], 12, 1200080426)
      c = md5ff(c, d, a, b, x[i + 6], 17, -1473231341)
      b = md5ff(b, c, d, a, x[i + 7], 22, -45705983)
      a = md5ff(a, b, c, d, x[i + 8], 7, 1770035416)
      d = md5ff(d, a, b, c, x[i + 9], 12, -1958414417)
      c = md5ff(c, d, a, b, x[i + 10], 17, -42063)
      b = md5ff(b, c, d, a, x[i + 11], 22, -1990404162)
      a = md5ff(a, b, c, d, x[i + 12], 7, 1804603682)
      d = md5ff(d, a, b, c, x[i + 13], 12, -40341101)
      c = md5ff(c, d, a, b, x[i + 14], 17, -1502002290)
      b = md5ff(b, c, d, a, x[i + 15], 22, 1236535329)

      a = md5gg(a, b, c, d, x[i + 1], 5, -165796510)
      d = md5gg(d, a, b, c, x[i + 6], 9, -1069501632)
      c = md5gg(c, d, a, b, x[i + 11], 14, 643717713)
      b = md5gg(b, c, d, a, x[i], 20, -373897302)
      a = md5gg(a, b, c, d, x[i + 5], 5, -701558691)
      d = md5gg(d, a, b, c, x[i + 10], 9, 38016083)
      c = md5gg(c, d, a, b, x[i + 15], 14, -660478335)
      b = md5gg(b, c, d, a, x[i + 4], 20, -405537848)
      a = md5gg(a, b, c, d, x[i + 9], 5, 568446438)
      d = md5gg(d, a, b, c, x[i + 14], 9, -1019803690)
      c = md5gg(c, d, a, b, x[i + 3], 14, -187363961)
      b = md5gg(b, c, d, a, x[i + 8], 20, 1163531501)
      a = md5gg(a, b, c, d, x[i + 13], 5, -1444681467)
      d = md5gg(d, a, b, c, x[i + 2], 9, -51403784)
      c = md5gg(c, d, a, b, x[i + 7], 14, 1735328473)
      b = md5gg(b, c, d, a, x[i + 12], 20, -1926607734)

      a = md5hh(a, b, c, d, x[i + 5], 4, -378558)
      d = md5hh(d, a, b, c, x[i + 8], 11, -2022574463)
      c = md5hh(c, d, a, b, x[i + 11], 16, 1839030562)
      b = md5hh(b, c, d, a, x[i + 14], 23, -35309556)
      a = md5hh(a, b, c, d, x[i + 1], 4, -1530992060)
      d = md5hh(d, a, b, c, x[i + 4], 11, 1272893353)
      c = md5hh(c, d, a, b, x[i + 7], 16, -155497632)
      b = md5hh(b, c, d, a, x[i + 10], 23, -1094730640)
      a = md5hh(a, b, c, d, x[i + 13], 4, 681279174)
      d = md5hh(d, a, b, c, x[i], 11, -358537222)
      c = md5hh(c, d, a, b, x[i + 3], 16, -722521979)
      b = md5hh(b, c, d, a, x[i + 6], 23, 76029189)
      a = md5hh(a, b, c, d, x[i + 9], 4, -640364487)
      d = md5hh(d, a, b, c, x[i + 12], 11, -421815835)
      c = md5hh(c, d, a, b, x[i + 15], 16, 530742520)
      b = md5hh(b, c, d, a, x[i + 2], 23, -995338651)

      a = md5ii(a, b, c, d, x[i], 6, -198630844)
      d = md5ii(d, a, b, c, x[i + 7], 10, 1126891415)
      c = md5ii(c, d, a, b, x[i + 14], 15, -1416354905)
      b = md5ii(b, c, d, a, x[i + 5], 21, -57434055)
      a = md5ii(a, b, c, d, x[i + 12], 6, 1700485571)
      d = md5ii(d, a, b, c, x[i + 3], 10, -1894986606)
      c = md5ii(c, d, a, b, x[i + 10], 15, -1051523)
      b = md5ii(b, c, d, a, x[i + 1], 21, -2054922799)
      a = md5ii(a, b, c, d, x[i + 8], 6, 1873313359)
      d = md5ii(d, a, b, c, x[i + 15], 10, -30611744)
      c = md5ii(c, d, a, b, x[i + 6], 15, -1560198380)
      b = md5ii(b, c, d, a, x[i + 13], 21, 1309151649)
      a = md5ii(a, b, c, d, x[i + 4], 6, -145523070)
      d = md5ii(d, a, b, c, x[i + 11], 10, -1120210379)
      c = md5ii(c, d, a, b, x[i + 2], 15, 718787259)
      b = md5ii(b, c, d, a, x[i + 9], 21, -343485551)

      a = safeAdd(a, olda)
      b = safeAdd(b, oldb)
      c = safeAdd(c, oldc)
      d = safeAdd(d, oldd)
    }
    return [a, b, c, d]
  }

  /*
  * Convert an array of little-endian words to a string
  */
  function binl2rstr (input) {
    var i
    var output = ''
    var length32 = input.length * 32
    for (i = 0; i < length32; i += 8) {
      output += String.fromCharCode((input[i >> 5] >>> (i % 32)) & 0xff)
    }
    return output
  }

  /*
  * Convert a raw string to an array of little-endian words
  * Characters >255 have their high-byte silently ignored.
  */
  function rstr2binl (input) {
    var i
    var output = []
    output[(input.length >> 2) - 1] = undefined
    for (i = 0; i < output.length; i += 1) {
      output[i] = 0
    }
    var length8 = input.length * 8
    for (i = 0; i < length8; i += 8) {
      output[i >> 5] |= (input.charCodeAt(i / 8) & 0xff) << (i % 32)
    }
    return output
  }

  /*
  * Calculate the MD5 of a raw string
  */
  function rstrMD5 (s) {
    return binl2rstr(binlMD5(rstr2binl(s), s.length * 8))
  }

  /*
  * Calculate the HMAC-MD5, of a key and some data (raw strings)
  */
  function rstrHMACMD5 (key, data) {
    var i
    var bkey = rstr2binl(key)
    var ipad = []
    var opad = []
    var hash
    ipad[15] = opad[15] = undefined
    if (bkey.length > 16) {
      bkey = binlMD5(bkey, key.length * 8)
    }
    for (i = 0; i < 16; i += 1) {
      ipad[i] = bkey[i] ^ 0x36363636
      opad[i] = bkey[i] ^ 0x5c5c5c5c
    }
    hash = binlMD5(ipad.concat(rstr2binl(data)), 512 + data.length * 8)
    return binl2rstr(binlMD5(opad.concat(hash), 512 + 128))
  }

  /*
  * Convert a raw string to a hex string
  */
  function rstr2hex (input) {
    var hexTab = '0123456789abcdef'
    var output = ''
    var x
    var i
    for (i = 0; i < input.length; i += 1) {
      x = input.charCodeAt(i)
      output += hexTab.charAt((x >>> 4) & 0x0f) + hexTab.charAt(x & 0x0f)
    }
    return output
  }

  /*
  * Encode a string as utf-8
  */
  function str2rstrUTF8 (input) {
    return unescape(encodeURIComponent(input))
  }

  /*
  * Take string arguments and return either raw or hex encoded strings
  */
  function rawMD5 (s) {
    return rstrMD5(str2rstrUTF8(s))
  }
  function hexMD5 (s) {
    return rstr2hex(rawMD5(s))
  }
  function rawHMACMD5 (k, d) {
    return rstrHMACMD5(str2rstrUTF8(k), str2rstrUTF8(d))
  }
  function hexHMACMD5 (k, d) {
    return rstr2hex(rawHMACMD5(k, d))
  }

  function md5 (string, key, raw) {
    if (!key) {
      if (!raw) {
        return hexMD5(string)
      }
      return rawMD5(string)
    }
    if (!raw) {
      return hexHMACMD5(key, string)
    }
    return rawHMACMD5(key, string)
  }

  if (typeof define === 'function' && define.amd) {
    define(function () {
      return md5
    })
  } else if (typeof module === 'object' && module.exports) {
    module.exports = md5
  } else {
    $.md5 = md5
  }
})(this)

小程序里使用，把最后的部分修改一下即可：

/*
 * JavaScript MD5
 * https://github.com/blueimp/JavaScript-MD5
 *
 * Copyright 2011, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * https://opensource.org/licenses/MIT
 *
 * Based on
 * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message
 * Digest Algorithm, as defined in RFC 1321.
 * Version 2.2 Copyright (C) Paul Johnston 1999 - 2009
 * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
 * Distributed under the BSD License
 * See http://pajhome.org.uk/crypt/md5 for more info.
 */

/* global define */

 
  /*
  * Add integers, wrapping at 2^32. This uses 16-bit operations internally
  * to work around bugs in some JS interpreters.
  */
  function safeAdd (x, y) {
    var lsw = (x & 0xffff) + (y & 0xffff)
    var msw = (x >> 16) + (y >> 16) + (lsw >> 16)
    return (msw << 16) | (lsw & 0xffff)
  }

  /*
  * Bitwise rotate a 32-bit number to the left.
  */
  function bitRotateLeft (num, cnt) {
    return (num << cnt) | (num >>> (32 - cnt))
  }

  /*
  * These functions implement the four basic operations the algorithm uses.
  */
  function md5cmn (q, a, b, x, s, t) {
    return safeAdd(bitRotateLeft(safeAdd(safeAdd(a, q), safeAdd(x, t)), s), b)
  }
  function md5ff (a, b, c, d, x, s, t) {
    return md5cmn((b & c) | (~b & d), a, b, x, s, t)
  }
  function md5gg (a, b, c, d, x, s, t) {
    return md5cmn((b & d) | (c & ~d), a, b, x, s, t)
  }
  function md5hh (a, b, c, d, x, s, t) {
    return md5cmn(b ^ c ^ d, a, b, x, s, t)
  }
  function md5ii (a, b, c, d, x, s, t) {
    return md5cmn(c ^ (b | ~d), a, b, x, s, t)
  }

  /*
  * Calculate the MD5 of an array of little-endian words, and a bit length.
  */
  function binlMD5 (x, len) {
    /* append padding */
    x[len >> 5] |= 0x80 << (len % 32)
    x[((len + 64) >>> 9 << 4) + 14] = len

    var i
    var olda
    var oldb
    var oldc
    var oldd
    var a = 1732584193
    var b = -271733879
    var c = -1732584194
    var d = 271733878

    for (i = 0; i < x.length; i += 16) {
      olda = a
      oldb = b
      oldc = c
      oldd = d

      a = md5ff(a, b, c, d, x[i], 7, -680876936)
      d = md5ff(d, a, b, c, x[i + 1], 12, -389564586)
      c = md5ff(c, d, a, b, x[i + 2], 17, 606105819)
      b = md5ff(b, c, d, a, x[i + 3], 22, -1044525330)
      a = md5ff(a, b, c, d, x[i + 4], 7, -176418897)
      d = md5ff(d, a, b, c, x[i + 5], 12, 1200080426)
      c = md5ff(c, d, a, b, x[i + 6], 17, -1473231341)
      b = md5ff(b, c, d, a, x[i + 7], 22, -45705983)
      a = md5ff(a, b, c, d, x[i + 8], 7, 1770035416)
      d = md5ff(d, a, b, c, x[i + 9], 12, -1958414417)
      c = md5ff(c, d, a, b, x[i + 10], 17, -42063)
      b = md5ff(b, c, d, a, x[i + 11], 22, -1990404162)
      a = md5ff(a, b, c, d, x[i + 12], 7, 1804603682)
      d = md5ff(d, a, b, c, x[i + 13], 12, -40341101)
      c = md5ff(c, d, a, b, x[i + 14], 17, -1502002290)
      b = md5ff(b, c, d, a, x[i + 15], 22, 1236535329)

      a = md5gg(a, b, c, d, x[i + 1], 5, -165796510)
      d = md5gg(d, a, b, c, x[i + 6], 9, -1069501632)
      c = md5gg(c, d, a, b, x[i + 11], 14, 643717713)
      b = md5gg(b, c, d, a, x[i], 20, -373897302)
      a = md5gg(a, b, c, d, x[i + 5], 5, -701558691)
      d = md5gg(d, a, b, c, x[i + 10], 9, 38016083)
      c = md5gg(c, d, a, b, x[i + 15], 14, -660478335)
      b = md5gg(b, c, d, a, x[i + 4], 20, -405537848)
      a = md5gg(a, b, c, d, x[i + 9], 5, 568446438)
      d = md5gg(d, a, b, c, x[i + 14], 9, -1019803690)
      c = md5gg(c, d, a, b, x[i + 3], 14, -187363961)
      b = md5gg(b, c, d, a, x[i + 8], 20, 1163531501)
      a = md5gg(a, b, c, d, x[i + 13], 5, -1444681467)
      d = md5gg(d, a, b, c, x[i + 2], 9, -51403784)
      c = md5gg(c, d, a, b, x[i + 7], 14, 1735328473)
      b = md5gg(b, c, d, a, x[i + 12], 20, -1926607734)

      a = md5hh(a, b, c, d, x[i + 5], 4, -378558)
      d = md5hh(d, a, b, c, x[i + 8], 11, -2022574463)
      c = md5hh(c, d, a, b, x[i + 11], 16, 1839030562)
      b = md5hh(b, c, d, a, x[i + 14], 23, -35309556)
      a = md5hh(a, b, c, d, x[i + 1], 4, -1530992060)
      d = md5hh(d, a, b, c, x[i + 4], 11, 1272893353)
      c = md5hh(c, d, a, b, x[i + 7], 16, -155497632)
      b = md5hh(b, c, d, a, x[i + 10], 23, -1094730640)
      a = md5hh(a, b, c, d, x[i + 13], 4, 681279174)
      d = md5hh(d, a, b, c, x[i], 11, -358537222)
      c = md5hh(c, d, a, b, x[i + 3], 16, -722521979)
      b = md5hh(b, c, d, a, x[i + 6], 23, 76029189)
      a = md5hh(a, b, c, d, x[i + 9], 4, -640364487)
      d = md5hh(d, a, b, c, x[i + 12], 11, -421815835)
      c = md5hh(c, d, a, b, x[i + 15], 16, 530742520)
      b = md5hh(b, c, d, a, x[i + 2], 23, -995338651)

      a = md5ii(a, b, c, d, x[i], 6, -198630844)
      d = md5ii(d, a, b, c, x[i + 7], 10, 1126891415)
      c = md5ii(c, d, a, b, x[i + 14], 15, -1416354905)
      b = md5ii(b, c, d, a, x[i + 5], 21, -57434055)
      a = md5ii(a, b, c, d, x[i + 12], 6, 1700485571)
      d = md5ii(d, a, b, c, x[i + 3], 10, -1894986606)
      c = md5ii(c, d, a, b, x[i + 10], 15, -1051523)
      b = md5ii(b, c, d, a, x[i + 1], 21, -2054922799)
      a = md5ii(a, b, c, d, x[i + 8], 6, 1873313359)
      d = md5ii(d, a, b, c, x[i + 15], 10, -30611744)
      c = md5ii(c, d, a, b, x[i + 6], 15, -1560198380)
      b = md5ii(b, c, d, a, x[i + 13], 21, 1309151649)
      a = md5ii(a, b, c, d, x[i + 4], 6, -145523070)
      d = md5ii(d, a, b, c, x[i + 11], 10, -1120210379)
      c = md5ii(c, d, a, b, x[i + 2], 15, 718787259)
      b = md5ii(b, c, d, a, x[i + 9], 21, -343485551)

      a = safeAdd(a, olda)
      b = safeAdd(b, oldb)
      c = safeAdd(c, oldc)
      d = safeAdd(d, oldd)
    }
    return [a, b, c, d]
  }

  /*
  * Convert an array of little-endian words to a string
  */
  function binl2rstr (input) {
    var i
    var output = ''
    var length32 = input.length * 32
    for (i = 0; i < length32; i += 8) {
      output += String.fromCharCode((input[i >> 5] >>> (i % 32)) & 0xff)
    }
    return output
  }

  /*
  * Convert a raw string to an array of little-endian words
  * Characters >255 have their high-byte silently ignored.
  */
  function rstr2binl (input) {
    var i
    var output = []
    output[(input.length >> 2) - 1] = undefined
    for (i = 0; i < output.length; i += 1) {
      output[i] = 0
    }
    var length8 = input.length * 8
    for (i = 0; i < length8; i += 8) {
      output[i >> 5] |= (input.charCodeAt(i / 8) & 0xff) << (i % 32)
    }
    return output
  }

  /*
  * Calculate the MD5 of a raw string
  */
  function rstrMD5 (s) {
    return binl2rstr(binlMD5(rstr2binl(s), s.length * 8))
  }

  /*
  * Calculate the HMAC-MD5, of a key and some data (raw strings)
  */
  function rstrHMACMD5 (key, data) {
    var i
    var bkey = rstr2binl(key)
    var ipad = []
    var opad = []
    var hash
    ipad[15] = opad[15] = undefined
    if (bkey.length > 16) {
      bkey = binlMD5(bkey, key.length * 8)
    }
    for (i = 0; i < 16; i += 1) {
      ipad[i] = bkey[i] ^ 0x36363636
      opad[i] = bkey[i] ^ 0x5c5c5c5c
    }
    hash = binlMD5(ipad.concat(rstr2binl(data)), 512 + data.length * 8)
    return binl2rstr(binlMD5(opad.concat(hash), 512 + 128))
  }

  /*
  * Convert a raw string to a hex string
  */
  function rstr2hex (input) {
    var hexTab = '0123456789abcdef'
    var output = ''
    var x
    var i
    for (i = 0; i < input.length; i += 1) {
      x = input.charCodeAt(i)
      output += hexTab.charAt((x >>> 4) & 0x0f) + hexTab.charAt(x & 0x0f)
    }
    return output
  }

  /*
  * Encode a string as utf-8
  */
  function str2rstrUTF8 (input) {
    return unescape(encodeURIComponent(input))
  }

  /*
  * Take string arguments and return either raw or hex encoded strings
  */
  function rawMD5 (s) {
    return rstrMD5(str2rstrUTF8(s))
  }
  function hexMD5 (s) {
    return rstr2hex(rawMD5(s))
  }
  function rawHMACMD5 (k, d) {
    return rstrHMACMD5(str2rstrUTF8(k), str2rstrUTF8(d))
  }
  function hexHMACMD5 (k, d) {
    return rstr2hex(rawHMACMD5(k, d))
  }

  function md5 (string, key, raw) {
    if (!key) {
      if (!raw) {
        return hexMD5(string)
      }
      return rawMD5(string)
    }
    if (!raw) {
      return hexHMACMD5(key, string)
    }
    return rawHMACMD5(key, string)
  }

   
module.exports = {  
  md5: md5  
}

微信小程序wx.request使用post方式传参入坑

发表评论

急急忙忙尝试了2天，发现问题始终解决不掉

问题：通过微信小程序实现post   

（后端是python flask 

flask的post函数)

解决方案：凭我的经验猜测 只传输一个值  data ，然后里面包含字典形式的三个元素  

{“kind”:””,

“acc”:””,

“donor”:””}

为了转换在小程序上post我费了些时间

我感觉上述没有问题，但是不知道为什么就是通不过一直 500

下面是微信小程序的客户端post的

结果：

我猜测还是我post的数据格式不对，

相应200的  正确格式

最终解决方案：

采用

在前后端交互的过程中难免会出现需要我们将字符串转成json的时候。

 json.stringify()方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串

json.parse() 方法将数据转换为 JavaScript 对象( 将字符串转成json对象。 )
 

强烈安利JavaScript 教程

http://www.w3school.com.cn/json/json_eval.asp

后记：

再传post值的过程中

应先抓包分析一下对应的 post为和值，或者直接利用开发者工具箱直接network 拉到最后直接分析

通过content-type 得到传参方式 最下方仅为post的数据，我没农商

一般来说传参方式分为

    application/json   multipart/form-data      application/x-www-form-urlencoded   

为什么会有这么多传参方式，就是因为他的编码方式，协议规定 POST 提交的数据必须放在消息主体（entity-body）中，但协议并没有规定数据必须使用什么编码方式。  数据发送出去，还要服务端解析成功才有意义。一般服务端语言如 php、python 等，以及它们的 framework，都内置了自动解析常见数据格式的功能。
服务端通常是根据请求头（headers）中的 Content-Type 字段来获知请求中的消息主体是用何种方式编码，再对主体进行解析。

所以说到 POST 提交数据方案，包含了 Content-Type 和消息主体编码方式两部分。

原文：https://blog.csdn.net/qq_40268306/article/details/87893789

微信小程序之上传图片(含前后端代码例子)

发表评论

前端小程序代码

index.wxml:

<view class='content'>
  <view class='img-box'>
    <view class='img-list'>
      <block wx:for="{{detailPics}}" wx:key="index">
        <view class='img-item'>
          <image src='{{item}}' bindlongpress="bindlongpressimg" data-id='{{index}}'></image>
        </view>
      </block>
      <view class='chooseimg' bindtap='uploadDetailImage'>
        <view class="weui-uploader__input-box"></view>
      </view>
    </view>
    <view class='tips'>长按对应的图片即可删除</view>
  </view>
</view>

index.js:

// component/uploadImages/index.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    count: { //最多选择图片的张数，默认9张
      type: Number,
      value: 9
    },
    uploadUrl: { //图片上传的服务器路径
      type: String,
      value: ''
    },
    showUrl: { //图片的拼接路径
      type: String,
      value: ''
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    detailPics: [], //上传的结果图片集合
  },

  ready: function () {
    console.log(this.data)
  },

  /**
   * 组件的方法列表
   */
  methods: {

    uploadDetailImage: function (e) { //这里是选取图片的方法
      var that = this;
      var pics = [];
      var detailPics = that.data.detailPics;
      if (detailPics.length >= that.data.count) {
        wx.showToast({
          title: '最多选择' + that.data.count + '张！',
        })
        return;
      }
      wx.chooseImage({
        count: that.data.count, // 最多可以选择的图片张数，默认9
        sizeType: ['original', 'compressed'], // original 原图，compressed 压缩图，默认二者都有
        sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有
        success: function (res) {
          var imgs = res.tempFilePaths;
          for (var i = 0; i < imgs.length; i++) {
            pics.push(imgs[i])
          }
          that.uploadimg({
            url: "http://www.test.com//test-api/wechat/applet/api/uploadUserAvatar", //这里是你图片上传的接口
            path: pics, //这里是选取的图片的地址数组
          });
        },
      })

    },
    //多张图片上传
    uploadimg: function (data) {
      wx.showLoading({
        title: '上传中...',
        mask: true,
      })
      var that = this,
        i = data.i ? data.i : 0,
        success = data.success ? data.success : 0,
        fail = data.fail ? data.fail : 0;
      wx.uploadFile({
        url: data.url,
        filePath: data.path[i],
        name: 'file',
        formData: {"userId":"35"},
        success: (resp) => {
          wx.hideLoading();
          success++;
          var str = resp.data //返回的结果，可能不同项目结果不一样

          console.log(str);
          // var pic = JSON.parse(str);
          // var pic_name = that.data.showUrl + pic.Data;
          // var detailPics = that.data.detailPics;
          // detailPics.push(pic_name)
          // that.setData({
          //   detailPics: detailPics
          // })
        },
        fail: (res) => {
          fail++;
          console.log('fail:' + i + "fail:" + fail);
        },
        complete: () => {
          i++;
          if (i == data.path.length) { //当图片传完时，停止调用     
            console.log('执行完毕');
            console.log('成功：' + success + " 失败：" + fail);
            var myEventDetail = {
              picsList: that.data.detailPics
            } // detail对象，提供给事件监听函数
            var myEventOption = {} // 触发事件的选项
            that.triggerEvent('myevent', myEventDetail, myEventOption)//结果返回调用的页面
          } else { //若图片还没有传完，则继续调用函数
            data.i = i;
            data.success = success;
            data.fail = fail;
            that.uploadimg(data);//递归，回调自己
          }
        }
      });
    },

  }
})

后端Java代码(这里我使用的是第三方存储，如腾讯云，如果读者朋友们是使用第三方存储替换是一件很容易的事情)

核心代码如下:

@PostMapping("/uploadUserAvatar")
@ApiOperation(value = "上传用户头像", notes = "上传用户头像")
public JSONObject uploadUserAvatar(HttpServletRequest request) {

    JSONObject json = new JSONObject();
    try {

        String userId = request.getParameter("userId");

        COSClientUtil cosClientUtil = new COSClientUtil();

        MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;

        // 获取上传的文件
        MultipartFile multiFile = multipartRequest.getFile("file");

        
        
        String name = cosClientUtil.uploadFileCos(multiFile);

        // 获取文件路径
        String fileUrl = cosClientUtil.getFileUrl(name);
        
        Console.log("fileUrl:"+fileUrl);
        
        
        // 对文件路径进行处理
        String dbFileUrl = fileUrl.substring(0, fileUrl.indexOf("?"));
        
        
        Console.log("dbFileUrl:"+dbFileUrl);

        User user = new User();
        user.setId(Integer.parseInt(userId));
        user.setSmallAvatar(dbFileUrl);

        boolean isUploadUserAvatar = userService.updateById(user);

        if (isUploadUserAvatar) {
            json.put(ResponseUtils.CODE, ResponseUtils.SUCCESS_CODE);
            json.put(ResponseUtils.MSG, ResponseUtils.SUCCEESS_MSG);
        } else {
            json.put(ResponseUtils.CODE, ResponseUtils.ERROR_CODE);
            json.put(ResponseUtils.MSG, ResponseUtils.ERROR_MSG);
        }

    } catch (Exception e) {
        e.printStackTrace();

        json.put(ResponseUtils.CODE, ResponseUtils.ERROR_CODE);
        json.put(ResponseUtils.MSG, ResponseUtils.ERROR_MSG);

    }

    return json;
}

原文：https://www.cnblogs.com/youcong/p/11524006.html

微信小程序 点击复制文本到剪贴板

发表评论

调用小程序的接口来实现，没什么难点，就直接上代码啦。

wxml：

<view>内容：{{contents}} </view>
<view  bindtap='copyText' data-text="{{contents}}">复制</view>

js:

Page({
  data: {
    contents:'这是可以复制的文字,粘贴后即可看到效果'
  },
  copyText: function (e) {
    console.log(e)
    wx.setClipboardData({
      data: e.currentTarget.dataset.text,
      success: function (res) {
        wx.getClipboardData({
          success: function (res) {
            wx.showToast({
              title: '复制成功'
            })
          }
        })
      }
    })
  },
}

微信小程序实现下拉刷新

发表评论
  • 本文将简单介绍如何实现微信小程序的下拉刷新
  • 将要使用的api：
    1. wx.showNavigationBarLoading(Object object)
    2. wx.showLoading(Object object)
    3. wx.hideLoading(Object object)
    4. wx.hideNavigationBarLoading(Object object)
    5. wx.stopPullDownRefresh(Object object)
    6. wx.request(Object object)
    //刷新
    onRefresh(){
        //在当前页面显示导航条加载动画
        wx.showNavigationBarLoading(); 
        //显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框
        wx.showLoading({
          title: '刷新中...',
        })
        this.getData();
      },
    //网络请求，获取数据
    getData(){
    	wx.request({
            url: '',
            //网络请求执行完后将执行的动作
            complete(res){
                //隐藏loading 提示框
                wx.hideLoading();
                //隐藏导航条加载动画
                wx.hideNavigationBarLoading();
                //停止下拉刷新
                wx.stopPullDownRefresh();
      	  	}
    	})   
    },
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
        //调用刷新时将执行的方法
    	this.onRefresh();
    }

除了在js页面编写响应的逻辑之外，还需要再相应页面的json中写入以下配置，这个配置允许这个页面进行下拉刷新动作

    {
         "enablePullDownRefresh": true
    }

特别需要注意的是：

  • 写之前先看看有无已经存在的onPullDownRefresh:function()函数，否则将不能监听到用户的下拉刷新动作
  • 注意相关api的配对使用
  • 不要忘了在需要刷新结束时调用wx.stopPullDownRefresh()，否则，页面将会保持下拉状态、不会回弹。·

此外，除了下拉刷新，有时候可能是在某个事件进行时触发刷新动作，此时可以调用wx.startPullDownRefresh(Object object) 此api的作用是：“ 开始下拉刷新。调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。”

原文：https://www.cnblogs.com/xunxian/p/12862660.html

微信小程序之分享功能

发表评论

微信小程序之分享功能

小程序风口正盛，将小程序作为获客的来源之一实在合适不过，想要让小程序的获客产生裂变，那么从将小程序的数据发送出去势在必行，本文提供以下几种方案作为数据出口，达到老拉新/口碑传播的效果。

本文中所介绍的东西并没有高深的技术含量，都是一些很简单的技巧而已。

一、分享：

让用户使用小程序之后，再将它分享给好友，或者发送到朋友圈，实在太合适不过了。

1.转发给好友/群：

在小程序开发API中，发送给好友/群，可以有两种实现方式：

1）入口

a.小程序右上角自带的分享功能（…）：

如果在当前页面调用wx.hideShareMenu()方法，那么右上角的分享功能将被隐藏，当然，隐藏方法与现实方法是承兑出现的，调用wx.showShareMenu()方法，可以显示该功能。

b.自定义分享按钮：<butto n open-type=’share’>分享</butto n>

以上两种方式均可实现分享功能

2）分享数据类型

不管采用以上何种方法，转发给好友的数据总归有它的数据模型，该数据模型是通过onShareAppMessage(options)返回的，也就是return一个object即可。其中，options.from可以用来判断是从自定义button打开的转发页面，还是从右上角的打开的转发页面。

以下是该object的数据模型：

如上所示，如果开发人员在onShareAppMessage(options)不进行任何处理，那么微信将会有一个默认的数据转发出去，title为当前小程序名称，path为当前页面的路径，imageUrl为当前页面的截图。根据imageUrl的定义，开发人员可以上传自定义图片，那么这个口子给了运营人员一定的发挥空间，这个问题，文章的后边会详细提及。

2.分享至朋友圈：

微信小程序目前没有直接提供方法来将小程序分享至朋友圈，不过可以采用曲线救国的方式来达到目的。

曲线救国的方式分为两步：

1.通过浏览器将希望分享的东西分享至朋友圈：

微信小程序自身没有任何入口可以进入到微信的浏览器中，那么就更加不可能让用户进入到自身操作系统中的浏览器进行分享了。

那么能否有其他的途径可以达到此目的呢？

答案是客服消息。

微信小程序本身提供客服消息是用来更好的为客户服务

小程序提供了入口，允许用户给客服发送消息，同时，也允许小程序的客服主动给用户发送消息，其中，可以发送图文链接

开发者可以在用户打开该聊天对话框时，主动给用户发送图文链接，用户点击该链接之后，将会跳转到微信的浏览器（H5）页面，该页面不同于小程序内打开的H5页面，如下图

开发者和用户对于这种样式的页面应该相当熟悉了，至此，从小程序进行分享至朋友圈的第一步完成了。

2.用户分享至朋友圈后，用户的好友通过该链接进入朋友圈

众所周知，微信目前还并未提供入口，将微信小程序直接在朋友圈进行展示，但是同样的，微信也没有禁止在朋友圈内展示小程序码，而我们通过小程序进行分享的是图文链接，那么图片自然就可以是需要分享的微信小程序码，至于文字，还可以作为运营人员的推广。

以上，就完成了从微信小程序分享至好友/好友群/朋友圈的路径。

注：小程序的二维码分两种，一种是常规的二维码，还有一种是小程序码，我们这里进行分享的是小程序码。

二、数据追踪

运营人员经常会期望知道哪些用户是自然量，哪些用户是推广量，不仅如此，他们常常期望给那些乐于分享的用户一些奖励。

那么，奖励的标准是什么？无外乎谁拉来的人多，谁就可以获得更多的奖励。开发人员需要满足运营的需求，所以需要记录每个用户通过分享获客的数量等等。

如何进行记录呢，还是老生常谈，无外乎以下几种方式：

1.简单粗暴型：

比如Uber和滴滴的获客方式，通过邀请码来进行获客。这种通过现金奖励的土豪方式不适合绝大多数的推广，而且简单粗暴，本文不再赘述。

2.数据匹配型：

现有的一些第三方推广渠道的合作方式常常都是如此，比如iOS通过用户的IDFA来进行标记用户，用户通过第三方app打开第三方渠道的短链时，由app将IDFA传给短链进行记录，当用户注册账号时，app端通过获取IDFA来和第三方渠道进行比对，如果一致，则认为是通过第三方渠道推广而来的量，最后进行结算。

微信小程序也可以模仿该方式进行记录。

上文提供了三种分享的方式，分享给好友/好友群/朋友圈，它们需要使用不同的方式来进行记录。

1）朋友圈：

分享至朋友圈是通过分享小程序码来达到分享功能的，那么想要进行数据匹配，肯定是通过小程序码来做文章了。

通过调用微信的不同的接口，可以生成类型不同的小程序码，我们调用接口：https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN，具体参数如下：

关注参数scene和page即可，我们可以将用户的userid或者唯一标识放入其中，这样在其他被拉进小程序的用户打开page页面时，我们可以通过以下方式获取到分享发起者的用户唯一标识：

此时，便可以根据此唯一标识来给对应的用户发放奖励了。

2）分享至好友/群：

分享至好友/群和分享至朋友圈的内容并不一致，后者是分享图文链接，而分享至好友群的往往是小程序本身，群中的用户通过该分享可以直接进入小程序，那么如何进行数据匹配呢？

其实方法大同小异，通过查看微信小程序的api，如下：

此处的path中可以加入用户的唯一标识，接下来的流程和分享至朋友圈便是一样了。

部分运营人员期望能知道分享的群的一些信息，可以参考此文：http://news.ifeng.com/a/20170510/51071063_0.shtml

本文参考微信小程序开发文档：

1.转发：https://mp.weixin.qq.com/debug/wxadoc/dev/api/share.html

2.客服消息：https://mp.weixin.qq.com/debug/wxadoc/dev/api/custommsg/conversation.html

3.获取二维码：https://mp.weixin.qq.com/debug/wxadoc/dev/api/qrcode.html

原文：https://www.jianshu.com/p/c100d21bcc9c

微信小程序navigateBack如何带参数

发表评论

wx.navigateBack({//返回

delta:1

})

方法如下：

一.

var pages = getCurrentPages();

var prevPage = pages[pages.length – 2]; //上一个页面

//直接调用上一个页面的setData()方法，把数据存到上一个页面中去

prevPage.setData({

mydata: {a:1, b:2}

})

二.

回到上一页，在data里定义mydata，然后在onshow里

var pages = getCurrentPages();

var currPage = pages[pages.length – 1]; //当前页面

console.log(currPage) ，就可以看到data里mydata的值了

小程序上传图片or文件到阿里云OSS

发表评论

搞了大半天，累死了，原本在阿里云官网通过后台取签上传的方式，前端会用到lib，例子下载后无法加入到小程序中使用，后来在CSDN的一篇博文里找到了解决方案

后端get.php，callback.php从阿里云例子中取，直接用

get.php代码

<?php
    function gmt_iso8601($time) {
        $dtStr = date("c", $time);
        $mydatetime = new DateTime($dtStr);
        $expiration = $mydatetime->format(DateTime::ISO8601);
        $pos = strpos($expiration, '+');
        $expiration = substr($expiration, 0, $pos);
        return $expiration."Z";
    }

    $id= 'xxxxxxxx';          // 请填写您的AccessKeyId。
    $key= 'xxxxxxxx';     // 请填写您的AccessKeySecret。
    // $host的格式为 bucketname.endpoint，请替换为您的真实信息。
    $host = 'https://bucket名称.oss-cn-地域.aliyuncs.com/';  
    // $callbackUrl为上传回调服务器的URL，请将下面的IP和Port配置为您自己的真实URL信息。
    $callbackUrl = 'callback.php的网络路径';
    $dir = '文件保存路径';          // 用户上传文件时指定的前缀。
	
    $callback_param = array('callbackUrl'=>$callbackUrl, 
                 'callbackBody'=>'filename=${object}&size=${size}&mimeType=${mimeType}&height=${imageInfo.height}&width=${imageInfo.width}', 
                 'callbackBodyType'=>"application/x-www-form-urlencoded");
    $callback_string = json_encode($callback_param);

    $base64_callback_body = base64_encode($callback_string);
    $now = time();
    $expire = 30;  //设置该policy超时时间是10s. 即这个policy过了这个有效时间，将不能访问。
    $end = $now + $expire;
    $expiration = gmt_iso8601($end);


    //最大文件大小.用户可以自己设置
    $condition = array(0=>'content-length-range', 1=>0, 2=>1048576000);
    $conditions[] = $condition; 

    // 表示用户上传的数据，必须是以$dir开始，不然上传会失败，这一步不是必须项，只是为了安全起见，防止用户通过policy上传到别人的目录。
    $start = array(0=>'starts-with', 1=>'$key', 2=>$dir);
    $conditions[] = $start; 


    $arr = array('expiration'=>$expiration,'conditions'=>$conditions);
    $policy = json_encode($arr);
    $base64_policy = base64_encode($policy);
    $string_to_sign = $base64_policy;
    $signature = base64_encode(hash_hmac('sha1', $string_to_sign, $key, true));

    $response = array();
    $response['accessid'] = $id;
    $response['host'] = $host;
    $response['policy'] = $base64_policy;
    $response['signature'] = $signature;
    $response['expire'] = $end;
    $response['callback'] = $base64_callback_body;
    $response['dir'] = $dir;  // 这个参数是设置用户上传文件时指定的前缀。
    echo json_encode($response);
?>

callback.php不用改

小程序前端：

uploadAliyun(str){   //str是wx.chooseImage返回的res.tempFilePaths[0]
  var that = this;
  wx.uploadFile({
    url: 'xxxx/get.php', //你的服务器地址
    filePath: str, //要上传文件资源的路径
    name: 'headimg', //文件对应的 key，开发者在服务端可以通过这个 key 获取文件的二进制内容
    formData: {
	adminid: app.globalData.adminid  //HTTP 请求中其他额外的参数比如 用户id
    },
    success(res) {
        console.log(res)
        if(res.statusCode == 200){
          var info = JSON.parse(res.data);
          //  随机生成文件名称
          var fileRandName = Date.now() + "" + parseInt(Math.random() * 1000)
          var fileName = fileRandName + '.' + that.get_suffix(str)
          wx.uploadFile({
            url: 'https://bucket名称.oss-cn-地域.aliyuncs.com', 
            filePath: str,
            name: 'file',
            formData: {
              name: str,
              key: info.dir + fileName,
              policy: info.policy,
              signature: info.signature,
              expire : info.expire,
              success_action_status: "200",
              host: info.host,
              OSSAccessKeyId : info.accessid
            },
            success: function (res) {
              var data = res.data
              console.log(res)
              if(res.statusCode == 200){ }
            }
          })
        }
    }
   })
  },

补充get_suffix功能函数

get_suffix: function(filename) {
    var pos = filename.lastIndexOf('.')
    var suffix = ''
    if (pos != -1) {
        suffix = filename.substring(pos)
    }
    return suffix;
  },

微信小程序弹窗提示怎么写

发表评论

第一种：弹出提示框，可以选择确定或者取消。

代码：

wx.showModal({
 title: '提示',
 content: '这是一个模态弹窗',
 success: function (res) {
   if (res.confirm) {//这里是点击了确定以后
     console.log('用户点击确定')
   } else {//这里是点击了取消以后
     console.log('用户点击取消')
   }
 }
})

第二种：不带确定和取消的，直接提示成功

代码：

wx.showToast({
 title: '成功',
 icon: 'success',
 duration: 2000//持续的时间
})

第三种：提示等待中…

代码：

wx.showToast({
 title: '等待...',
 icon: 'loading',
 duration: 2000//持续的时间
})

第四种：提示文字，没有任何图标效果，但是文字可以写的很多。

代码：

wx.showToast({
 title: '这里面可以写很多的文字，比其他的弹窗都要多！',
 icon: 'none',
 duration: 2000//持续的时间
})

第五种：弹窗提示选择，例如选择ABCD那种

代码：

wx.showActionSheet({
 itemList: ['A', 'B', 'C'],
 success: function (res) {
   if (!res.cancel) {
     console.log(res.tapIndex)//这里是点击了那个按钮的下标
   }
 }
})


第六种：多用于页面提示加载

代码：

<loading hidden="{{hidden}}">
       加载中...
</loading>

hidden有两个值：false和true

原文：https://jingyan.baidu.com/article/456c463b38ca900a5831449a.html