js调用api接口实例
- 格式:docx
- 大小:13.59 KB
- 文档页数:4
微信JS SDK 调用详解概述微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。
通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力,为微信用户提供更优质的网页体验。
此文档面向网页开发者介绍微信JS-SDK如何使用及相关注意事项。
使用说明在使用微信JS-SDK对应的JS接口前,需确保公众号已获得使用对应JS接口的权限,可登录微信公众平台进入“开发者中心”查看对应的接口权限。
注意:所有的JS接口只能在公众号绑定的域名下调用,公众号开发者需要先登录微信公众平台进入“公众号设置”》“功能设置”里填写“JS接口安全域名”。
步骤一:引入JS文件在需要调用JS接口的页面引入如下JS文件,(支持https):/open/js/jweixin-1.0.0.js备注:支持使用AMD/CMD 标准模块加载方法加载步骤二:通过config接口注入权限验证配置所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用)。
wx.config({debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert 出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识timestamp: , // 必填,生成签名的时间戳nonceStr: '', // 必填,生成签名的随机串signature: '',// 必填,签名,见附录1jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2});步骤三:通过ready接口处理成功验证wx.ready(function(){// config信息验证后会执行ready方法,所有接口调用都必须在config 接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。
JS API目录 [隐藏]1 语言相关o o o o o o o o o o o o o o o o o o o语言相关 数组1.1 数组 1.2 对象 1.3 函数 1.4 字符串 1.5 数字 1.6 Math 1.7 Date 1.8 RegExp 1.9 全局变量(函数) 2.1 document 2.2 Node 2.3 HTMLInputElement 2.4 HTMLSelectElement 2.5 HTMLOptionElement 3.1 KISSY.DOM 3.2 KISSY.Event 3.3 EventObject 3.4 UA 3.5 Anim2 dom 相关3 淘宝类库建立 通过变量赋值为 [] 来建立一个数组 : var x=[]; // x 是一个数组 注意数组的下标从 0 开始 获取长度 通过 length 属性来获得 : var x=[1,2]; console.log(x.length); // => 2 合并数组 调用 concat 函数产生一个新的合并后的函数 :var x=[1,2]; console.log(x.concat([3,4])); // => 1,2,3,4 console.log(x); // => 1,2 转化为字符串 调用 join 将数组中的元素以分隔符合并为一个字符串 var x=[1,2]; console.log(x.join(":")); // => 1:2弹出最后一个元素 调用 pop 弹出数组的最后一个元素并返回 var x=[1,2]; console.log(x.pop()); // => 2 console.log(x); // => [1] 添加元素到数组尾部 调用 push 添加新元素到数组尾部 var x=[1,2]; console.log(x.push(3)); console.log(x); // => [1,2,3] 倒转数组元素的位置 调用 reverse 来颠倒数组元素的位置 var x=[1,2]; x.reverse(); console.log(x); // => [2,1] 弹出数组的第一个元素并返回 调用 shift 弹出数组的第一个元素并返回 var x=[1,2]; console.log(x.shift()); // => 1 console.log(x); // => [2] 添加元素到数组头部 调用 unshift 添加新元素到数组头部var x=[1,2]; console.log(x.unshift(3)); console.log(x); // => [3,1,2] 获取子数组 调用 slice 获取数组指定范围的子数组 var x=[1,2,3,4,5,6]; console.log(x.slice(1,3)); // => [2,3] console.log(x); // => [1,2,3,4,5,6] 替换数组元素 调用 splice 将数组的连续元素替换为另外一批元素 var x=[1,2,3,4]; console.log(x.splice(1,2,5,6)); // => [2,3] ,替换从第 1 个下标开始的两个数为 5,6,并返回被替换的数组成的数组 console.log(x); // => [1,5,6,4] 排序 调用 sort 对数组进行排序,默认为从小到大,也可以自定义排序规则 var x=[1,3,2,4]; console.log(x.sort()); // =>1,2,3,4 . 默认从小到大排序 console.log(x.sort(function(a,b){return b-a;})); // => 4,3,2,1. 也可从大到小对象建立 通过对变量赋值 {} 建立对象 var x={}; // x 是一个对象判断属性包含 调用 hasOwnProperty 判断对象是否包含某个属性 var x={ z:1 }; console.log(x.hasOwnProperty("z")); // => true console.log(x.hasOwnProperty("y")); // => false函数建立 通过函数声明或将变量赋值函数表达式创建一个函数 function x(){} // 通过函数声明创建函数 var y=function(){}; // 通过函数表达式创建函数 调用 通过函数名加()传入参数后调用相关函数 function x(a,b){return a+b;} x(1,2); // => 3 指定 this 调用 调用函数的 call/apply 可以指定函数内的 this 值 ,call 传参和普通调用一致,apply 则需 要传入参数数组. function x(c){return this.a+this.b+c;} x.call({a:1,b:2},3); // => 6 , 参数列表可直接传递 x.apply({a:1,b:2},[3]); // => 6 , 参数列表需要包装为数组字符串建立 通过变量赋值 " 包裹的字符串创建 var x="123"; // => x 为包含 123 的字符串 注意:字符串的字符下标从 0 开始. 从 unicode 中产生 调用 String.fromCharCode 从给定的 unicode 数值得到包含一个字符的字符串 var x=String.fromCharCode(65); // => "A" 得到指定下标的字符 调用 charAt 得到包含指定下标的字符的字符串 var x="abc".charAt(0); // => "a" 得到指定下标的字符的 unicode 值 调用 charCodeAt 得到指定下标的字符的 unicode 值 var x="ABC".charCodeAt(0); // => 65合并字符串 通过 + 操作符合并两个字符串 "abc"+"123" // => "abc123" 查找子串的首次出现位置 调用 indexOf 获取子串的首次出现位置 "a123bc123de".indexOf("123") // => 1 查找子串最后一次出现位置 调用 lastIndexOf 获取子串的末次出现位置 "a123bc123de".lastIndexOf("123") // => 6 获取子串 调用 slice 获取字符串指定范围的子串 "a123bc123de".slice(1,4)// => 123 , 获取下标位于 1-4 范围内的子串(包括 1,不 包括 4) 转化小写 调用 toLowerCase 返回源字符串的小写形式 "ABC".toLowerCase() // => "abc" 转化大写 调用 toUpperCase 返回源字符串的大写形式 "abc".toUpperCase() // => "ABC" 获取正则匹配结果 调用 match 并传入正则表达式得到正则匹配的结果,具体返回结果和正则表达式相关 如果设置了全局标志,返回所有的匹配项 "1 加 2 等于 3".match(/\d+/g) // => ["1", "2", "3"] 否则返回第一个匹配项以及它的捕获分组 var url = /(\w+):\/\/([\w.]+)\/(\S*)/; var text = "访问淘宝 /index.php /"; var result = text.match(url); if (result != null) {var fullurl = result[0];// => "/index.php"var protocol = result[1]; // => "http" var host = result[2]; var path = result[3]; } 查找匹配正则的起始位置 调用 search 返回匹配正则的起始位置 var s="TaoBao 开放 js"; s.search(/t.o/i) // => 0 // => "" // => "index.php"s.search(/x+/) // => -1 分割字符串为数组 调用 split 将字符串依据传入的分割符分割为数组 分隔符为字符串 "1:2:3:4:5".split(":"); 分隔符为正则 "1::2:3:4:5".split(":"); // => ["1","","2","3","4","5"] // => ["1","2","3","4","5"]"1::2:3:4:5".split(/:+/); // => ["1","2","3","4","5"] 如果正则为括号起始,则匹配到的分隔符也包含在返回结果中 "1::2:3:4:5".split(/(:)/); // => ["1",":","",":","2",":","3",":","4",":","5"] 替换子串 调用 replace 将正则匹配到的子串替换为指定的字符串 替换为指定的字符串,注意字符串中 $ 具有特殊含义: $1 表示第一个捕获分组 ... $& 表示 匹配字符串 "tao bao".replace(/(\w+) (\w+)/g,"$2 $1") // => "bao tao" 替换为指定的函数返回结果,改函数传入参数:匹配字符串以及各个匹配分组 "tao bao".replace(/(\w+)/g,function(w){ return w.charAt(0).toUpperCase()+w.slice(1); }); //=> Tao Bao数字最大正数 通过 Number.MAX_VALUE 来获取最大正数 console.log(Number.MAX_VALUE); 最小正数 通过 Number.MIN_VALUE 来获取最小正数 console.log(Number.MIN_VALUE); 正溢出值 Number.POSITIVE_INFINITY 表示运算正溢出时的值 console.log(1/0 === Number.POSITIVE_INFINITY); 负溢出值 Number.NEFATIVE_INFINITY 表示运算负溢出时的值 console.log(-1/0 === Number.NEFATIVE_INFINITY); 小数点位数控制 调用 toFixed 返回代表限定小数点位数的字符串 var n = 12345.6789; n.toFixed( ); n.toFixed(1); n.toFixed(6); (1.23e+20).toFixed(2); (1.23e-10).toFixed(2) // => '12346': 去除小数点的数字 // => '12345.7': 保留一位,进行四舍五入 // => '12345.678900' 保留六位,不足补零 // => '123000000000000000000.00' // => '0.00'总体精度控制 调用 toPrecison 来返回代表限定数字有效位的字符串var n = 12345.6789; n.toPrecision(1); // => 1e+4 n.toPrecision(3); // => 1.23e+4 n.toPrecision(5); // => 12346 (四舍五入) n.toPrecision(10); // => 12345.67890 (四舍五入)科学计数法精度控制 调用 toExponential 返回代表限定小数点位数的科学计数法字符串 var n = 12345.6789;n.toExponential(1); n.toExponential(5); n.toExponential(10); n.toExponential( );Math// => '1.2e+4' // => '1.23457e+4' // => '1.2345678900e+4' // => '1.23456789e+4'获取数学常量 e 通过 Math.E 获取数学常量 e console.log(Math.E); 自然对数 通过 Math.log(x) 获取 x 的自然对数 console.log(Math.log(10)===Math.LN10); // => true 10 的自然对数 通过 Math.LN10 获取 10 的自然对数 console.log(Math.LN10);2 的自然对数 通过 Math.LN2 获取 2 的自然对数 console.log(Math.LN2); 以 2 为底 e 的对数 通过 Math.LOG2E 获取以 2 为底 e 的对数 console.log(Math.LOG2E); 以 10 为底 e 的对数 通过 Math.LOG10E 获取以 10 为底 e 的对数 console.log(Math.LOG10E); 圆周率 通过 Math.PI 获取圆周率常量 console.log(Math.PI);根号 2通过 Math.SQRT2 获取常量根号 2 console.log(Math.SQRT2); 绝对值 调用 Math.abs 获取变量的绝对值 console.log(Math.abs(1)); // => 1 console.log(Math.abs(-1)); // => 1 余弦 调用 Math.cos 获取角度的余弦值 console.log(Math.cos(0.5)); // => 0.877... console.log(Math.cos(-0.5)); // => 0.877... 正弦 调用 Math.sin 获取角度的正弦值 console.log(Math.sin(0.5)); // => 0.497... console.log(Math.sin(-0.5)); // => -0.497... 正切 调用 Math.atan 获取角度的正切值 console.log(Math.tan(0.5)); // => 0.546... console.log(Math.tan(-0.5)); // => -0.546... 反余弦 调用 Math.acos 获取变量的反余弦值 console.log(Math.acos(0.5)); // => 1.047... console.log(Math.acos(-0.5)); // => 2.094... 反正弦 调用 Math.asin 获取变量的反正弦值 console.log(Math.asin(0.5)); // => 0.523... console.log(Math.asin(-0.5)); // => -0.523... 反正切 调用 Math.atan 获取变量的反正切值 console.log(Math.atan(0.5)); // => 0.523...console.log(Math.atan(-0.5)); // => -0.523... 大于或等于某数的最近整数 调用 Math.ceil 大于或等于某数的最近整数 console.log(Math.ceil(0.5)); // => 1 console.log(Math.ceil(-0.5)); // => 0 小于或等于某数的最近整数 调用 Math.floor 得到小于或等于某数的最近整数 console.log(Math.floor(0.5)); // => 0 console.log(Math.floor(-0.5)); // => -1 幂计算 调用 Math.pow(x,y) 返回 x 的 y 次方 console.log(Math.pow(2,3)); // => 8 console.log(Math.pow(3,2)); // => 9 四舍五入 调用 Math.round 返回四舍五入后的值 console.log(Math.round(2.3)); // => 2 console.log(Math.round(2.5)); // => 3 最大值 调用 Math.max 获得参数列表中最大的参数值 console.log(Math.max(2,4,3,-9); // => 4 最小值 调用 Math.min 获取参数列表中的最小的参数值 console.log(Math.min(2,4,3,-9); // => -9 随机数 调用 Math.random 返回一个范围在 0.0 与 1.0 之间的伪随机数 console.log(Math.random()!==Math.random()); // => trueDate根据 GMT 时间获取绝对时间值调用 Date.UTC(year, month, day, hours, minutes, seconds, ms) 来获取给定的 GMT 时间 相对于 GMT 1970.1.1 的毫秒数 注意: year 为四位数 month 从 0 开始(0 表示一月) day 可选参数,范围 1-31 hours 可选参数,范围 0-23 minutes 可选参数,范围 0-59 seconds 可选参数,范围 0-59 ms 可 选参数,范围 0-999 console.log(Date.UTC(1970,0,1)); // => 0 console.log(Date.UTC(1970,0,1,0,0,0,1)); // => 1创建一个 Date 对象 调用 new Date() 创建一个表示当前时间的 Date 对象 或 new Date(milliseconds) 创建一个举 例 1970.1.1 GMT 时间指定毫秒的 Date 对象 或 new Date(year,month,day,hours,minutes,seconds,ms) 创建一个指定本地时间的 Date 对象, 参数格式要求同 Date.UTC console.log(new Date().toLocaleString()); // => "Fri Sep 09 2011 12:13:30 GMT+0800 (中国标准时间)" 得到区域时间格式化表示 调用 date.toLocaleString() 得到时间对象的当前区域格式化表示 (不同浏览器间可能不同) console.log(new Date().toLocaleString()); // => "Fri Sep 09 2011 12:13:30 GMT+0800 (中国标准时间)" 得到绝对毫秒值 调用 date.getTime() 得到当前时间实例距离 1970/1/1 GMT 的毫秒数 console.log(new Date().getTime()); // => 1315881421972 得到年 调用 date.getFullYear() 得到时间实例的当前区域四位年份表示 console.log(new Date().getFullYear()); // => 2011 得到月份 调用 date.getMonth() 得到时间实例的当前区域月份表示 注意:返回值范围为 0-11 , 0 表示一月 console.log(new Date().getMonth()); // => 8 (9 月)得到日期 调用 date.getDate() 得到时间实例的当前区域的日期表示 console.log(new Date().getDate()); // => 13 得到星期 调用 date.getDay() 得到时间实例的当前区域的星期 注意:返回值范围为 0-6 , 0 表示星期天,1 表示星期一 ... console.log(new Date().getDay()); // => 2 (星期二) 得到时值 调用 date.getHours() 得到时间实例的当前区域的时数值 注意:返回值范围为 0-23 , 0 表示午夜 12 点. console.log(new Date().getHours()); // => 10得到分值 调用 date.getMinutes() 得到时间实例的当前区域的分数值 注意:返回值范围为 0-59 console.log(new Date().getMinutes()); // => 56 得到秒数 调用 date.getSeconds() 得到时间实例的当前区域的秒数 注意:返回值范围为 0-59 console.log(new Date().getSeconds()); // => 13 得到毫秒值 调用 date.getMilliseconds() 得到时间实例的当前区域的毫秒位数值 注意:返回值范围为 0-999 console.log(new Date().getMilliseconds()); // => 564得到 GMT 年 调用 date.getUTCFullYear() 得到时间实例的 GMT 标准时间四位年份表示 console.log(new Date().getUTCFullYear()); // => 2011 得到 GMT 月份 调用 date.getUTCMonth() 得到时间实例的 GMT 标准时间月份表示 注意:返回值范围为 0-11 , 0 表示一月console.log(new Date().getUTCMonth()); // => 8 (9 月) 得到 GMT 日期 调用 date.getUTCDate() 得到时间实例的 GMT 标准时间日期表示 console.log(new Date().getUTCDate()); // => 13 得到 GMT 星期 调用 date.getUTCDay() 得到时间实例的 GMT 标准时间星期 注意:返回值范围为 0-6 , 0 表示星期天,1 表示星期一 ... console.log(new Date().getUTCDay()); // => 2 (星期二) 得到 GMT 时值 调用 date.getUTCHours() 得到时间实例的 GMT 标准时间时数值 注意:返回值范围为 0-23 , 0 表示午夜 12 点. console.log(new Date().getUTCHours()); // => 2得到 GMT 分值 调用 date.getUTCMinutes() 得到时间实例的 GMT 标准时间分数值 注意:返回值范围为 0-59 console.log(new Date().getUTCMinutes()); // => 56 得到 GMT 秒数 调用 date.getUTCSeconds() 得到时间实例的 GMT 标准时间秒数 注意:返回值范围为 0-59 console.log(new Date().getUTCSeconds()); // => 13得到 GMT 毫秒值 调用 date.getUTCMilliseconds() 得到时间实例的 GMT 标准时间毫秒位数值 注意:返回值范围为 0-999 console.log(new Date().getUTCMilliseconds()); // => 564得到时区差异 调用 date.getTimezoneOffset() 得到 GMT 标准时区和当前时区的差异分钟数console.log(new Date().getTimezoneOffset()); // => -480 , 8*60 , 北京处于东八 区 设置绝对毫秒值 调用 date.setTime() 设置当前时间实例距离 1970/1/1 GMT 的毫秒数 console.log(new Date().setTime(1315881421972)); 设置年 调用 date.setFullYear() 设置时间实例在当前区域的年份 console.log(new Date().setFullYear(2011)); 设置月份 调用 date.setMonth() 设置时间实例在当前区域的月份 注意:参数范围为 0-11 , 0 表示一月 console.log(new Date().setMonth(8)); 设置日期 调用 date.setDate() 设置时间实例在当前区域的日期 console.log(new Date().setDate(13)); 设置时值 调用 date.setHours() 得到时间实例在当前区域的时值 注意:参数范围为 0-23 , 0 表示午夜 12 点. console.log(new Date().setHours(10));设置分值 调用 date.setMinutes() 设置时间实例在当前区域的分数值 注意:参数范围为 0-59 console.log(new Date().setMinutes(56)); 设置秒数 调用 date.setSeconds() 设置时间实例在当前区域的秒数 console.log(new Date().setSeconds(13)); 设置毫秒值 调用 date.setMilliseconds() 设置时间实例在当前区域的毫秒位数值console.log(new Date().setMilliseconds(564));得到 GMT 年 调用 date.getUTCFullYear() 得到时间实例的 GMT 标准时间四位年份表示 console.log(new Date().getUTCFullYear()); // => 2011 得到 GMT 月份 调用 date.getUTCMonth() 得到时间实例的 GMT 标准时间月份表示 注意:返回值范围为 0-11 , 0 表示一月 console.log(new Date().getUTCMonth()); // => 8 (9 月) 得到 GMT 日期 调用 date.getUTCDate() 得到时间实例的 GMT 标准时间日期表示 console.log(new Date().getUTCDate()); // => 13 得到 GMT 星期 调用 date.getUTCDay() 得到时间实例的 GMT 标准时间星期 注意:返回值范围为 0-6 , 0 表示星期天,1 表示星期一 ... console.log(new Date().getUTCDay()); // => 2 (星期二) 得到 GMT 时值 调用 date.getUTCHours() 得到时间实例的 GMT 标准时间时数值 注意:返回值范围为 0-23 , 0 表示午夜 12 点. console.log(new Date().getUTCHours()); // => 2得到 GMT 分值 调用 date.getUTCMinutes() 得到时间实例的 GMT 标准时间分数值 注意:返回值范围为 0-59 console.log(new Date().getUTCMinutes()); // => 56 得到 GMT 秒数 调用 date.getUTCSeconds() 得到时间实例的 GMT 标准时间秒数 注意:返回值范围为 0-59 console.log(new Date().getUTCSeconds()); // => 13得到 GMT 毫秒值 调用 date.getUTCMilliseconds() 得到时间实例的 GMT 标准时间毫秒位数值 注意:返回值范围为 0-999 console.log(new Date().getUTCMilliseconds()); // => 564 设置 GMT 年 调用 date.setUTCFullYear() 设置时间实例在 GMT 标准时区的年份 console.log(new Date().setUTCFullYear(2011)); 设置 GMT 月份 调用 date.setUTCMonth() 设置时间实例在 GMT 标准时区的月份 注意:参数范围为 0-11 , 0 表示一月 console.log(new Date().setUTCMonth(8)); 设置 GMT 日期 调用 date.setUTCDate() 设置时间实例在 GMT 标准时区的日期 console.log(new Date().setUTCDate(13)); 设置 GMT 时值 调用 date.seUTCHours() 得到时间实例在 GMT 标准时区的时值 注意:参数范围为 0-23 , 0 表示午夜 12 点. console.log(new Date().setUTCHours(10));设置 GMT 分值 调用 date.setUTCMinutes() 设置时间实例在 GMT 标准时区的分数值 注意:参数范围为 0-59 console.log(new Date().setUTCMinutes(56)); 设置 GMT 秒数 调用 date.setUTCSeconds() 设置时间实例在 GMT 标准时区的秒数 console.log(new Date().setUTCSeconds(13)); 设置 GMT 毫秒值 调用 date.setUTCMilliseconds() 设置时间实例在 GMT 标准时区的毫秒位数值console.log(new Date().setUTCMilliseconds(564));RegExp创建 通过 /code/flag 来创建正则表达式实例,其中 code 表示正则表达式,flag 表示该表达式 的模式修饰符,包括 i(大小写模式) , m(多行模式) ,g(全局模式) console.log(/x/i); 查看全局模式 通过 reg.global 来判断该正则表达式是否设置了全局模式 console.log(/x/g.global); // => true console.log(/x/.global); // => false 查看大小写模式 通过 reg.ignoreCase 来判断该正则表达式是否设置了大小写不敏感 console.log(/x/.ignoreCase); // => false console.log(/x/i.ignoreCase); // => true 查看多行模式 通过 reg.multiline 来判断该正则表达式是否设置了多行模式 console.log(/x/.multiline); // => false console.log(/x/m.multiline); // => true 下次开始查找位置 通过 stIndex 来获取或设置带有全局模式的正则式下次开始查找的位置 var x=/x/g; console.log(stIndex); // => 0 x.test("xyzxyz"); console.log(stIndex); // => 1通用模式匹配 调用 reg.exec 来对参数字符串进行通用模式匹配 如果匹配成功返回数组,数组第一项表示匹配的字符串,其余表示匹配分组,数组还具有 index 属性表示匹配字符串的开始下标,否则返回 nullvar x=/(j)ava\w*/g,result; while(result=x.exec("javascript is not java")){ console.log("匹配到:" + result[0] + " 捕获分组 :"+result[1]+ " 位于: " + result.index + " 下次匹配开始于:" + stIndex); } // 匹配到:javascript 捕获分组 :j 位于: 0 下次匹配开始于:10// 匹配到:java 捕获分组 :j 位于: 18 下次匹配开始于:22 是否匹配字符串 调用 reg.test 来判断参数字符串是否匹配当前模式,相当于 reg.exec(str) != null var pattern = /java/i; pattern.test("JavaScript"); pattern.test("ECMAScript");全局变量(函数)// => true // => falsenull 特殊的空对象 false true NaN 特殊的数字,不等于任何数字包括自身 console.log(Number("x")) // => NaN console.log(NaN === NaN); // => false Infinity 特殊的数字表示无穷大,运算溢出时返回 console.log(1/0); // => Infinity undefined 特殊值,表示不存在的变量或属性 parseInt 将字符串转化为整数 parseInt("12x") // => 12parseFloat 将字符串转化为浮点数 parseFloat("12.98x") // => 12.98 isNaN 判断一个字符串或数字是否是非 NaN 数字 isNaN("12") // => false isNaN("12x") // => true isNaN(NaN) => true isNaN(Infinity) => false isFinite 判断一个字符串或数字是否是非 Infinity 或 -Infinity 或 NaN 数字 isFinite("12") // => true isFinite("12x") // => false isFinite(NaN) => false isFinite(Infinity) => false encodeURI 对 url 进行编码,除了以下字符外其它字符都被编码为 utf-8 格式的 %xx 1. ascii 字符和数字 2. - _ . ! ~ * ' ( ) 3. ; / ? : @ & = + $ , # encodeURI("/?arg1=1&arg2=hello world"); // => "/?arg1=1&arg2=hello%20world" decodeURI 对调用 encodeURI 后的 url 进行解码 decodeURI("/?arg1=1&arg2=hello%20world"); // => "/?arg1=1&arg2=hello world" encodeURIComponent 对 url 进行编码,除了以下字符外其它字符都被编码为 utf-8 格式的 %xx 1. ascii 字符和数字 2. - _ . ! ~ * ' ( ) encodeURIComponent("hello ?"); // => "hello%20%3f"decodeURIComponent 对调用 encodeURIComponent 后的 url 进行解码decodeURIComponent("hello%20%3f"); // => "hello ?" setTimeout 延迟执行一个函数,返回一个可以用 clearTimeout 取消的句柄 setTimeout(function(){ alert("run"); },10); // => 10 毫秒后执行clearTimeout 取消执行用 setTimeout 延迟的函数 var id=setTimeout(function(){ alert("run"); },10); clearTimeout(id); setInterval 定时重复执行某个函数,返回一个可以用 clearInterval 取消的句柄 var id=setInterval(function(){ alert("run"); // 每 10 毫秒执行一次 },10); clearInterval 取消 setInterval 定时重复执行的函数 var id=setInterval(function(){ alert("run"); },10); setInterval(id); console.log 调用 console.log 可在控制台打出参数信息 注意:ie6,7 需要安装 companionJS console.log("log"); // => 控制台打印出 "log" // => 永远不会执行 // => 永远不会执行dom 相关document可通过常量 document 的一些方法来获得节点实例 body 通过 document.body 来获得模块的根节点 getElementsByTagName 通过 document.getElementsByTagName 来获得模块的制定标签的节点集合 console.log(document.getElementsByTagName("a")); // => 得到模块内的全部链接节 点createElement 通过 document.createElement 来返回一个节点实例 console.log(document.createElement("button")); // => 返回一个按钮节点实例 createTextNode 通过 document.createTextNode 来返回一个文本节点实例 console.log(document.createTextNode("button")); // => 返回一个文本节点,内容 为 button createDocumentFragment 通过 createDocumentFragment 来返回一个节点碎片集合,然后可以通过往这个集合上添 加节点,用于提高批量节点添加性能 console.log(document.createDocumentFragment());Node所有的节点实例都是从 Node 产生出来,都具备一下方法和属性 nodeType 返回整数,表明当前节点的类型,常用的含义如下 1 表示 element(元素) 2 表示属性 3 表示元素或属性中的文本内容 4 表示文档中的 CDATA 区段(文本不会被解析器解析) 5 表示实体引用元素 6 表示实体 7 表示处理指令 8 表示注释 9 表示整个文档 10 向为文档定义的实体提供接口 11 节点碎片集合 12 表示在 DTD 中声明的符号 console.log(document.createDocumentFragment().nodeType); // => 11 console.log(document.createTextNode("button").nodeType); // => 3 console.log(document.createElement("button").nodeType); // => 1nodeName 返回字符串,返回节点的标签内容,文本节点则返回 "#text" console.log(document.createElement("button").nodeName); // => button console.log(document.createElement("div").nodeName); // => div firstChild 返回元素的第一个子节点 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t1")[0].firstChild.className); // => t2 lastChild 返回元素的最后一个子节点 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t1")[0].lastChild.className); // => t3 nextSibling 返回节点的下一个兄弟节点 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t2")[0].nextSibling.className); // => t3 previousSibling 返回节点的上一个兄弟节点 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div>console.log(KISSY.DOM.query(".t3")[0].previousSibling.className); // => t2 parentNode 返回节点的父亲节点 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t3")[0].parentNode.class); // => t1 childNodes 返回元素的全部子节点数组 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t1")[0].childNodes); // => [KISSY.DOM.query(".t2")[0] , KISSY.DOM.query(".t3")[0]] clientWith 返回元素的可视区域宽度(不包括滚动条,边框以及被滚动的区域),类型整数 KISSY.DOM.query(".t1")[0].clientWidth clientHeight 返回元素的可视区域高度(不包括滚动条,边框以及被滚动的区域),类型整数 KISSY.DOM.query(".t1")[0].clientHeight offsetWith 返回元素的实际宽度(不包括被滚动的区域),类型整数 KISSY.DOM.query(".t1")[0].offsetWidth offsetHeight 返回元素的实际高度(不包括被滚动的区域),类型整数 KISSY.DOM.query(".t1")[0].offsetHeight scrollLeft 返回元素的向左滚动值,类型整数 KISSY.DOM.query(".t1")[0].scrollLeft scrollTop 返回元素的向上滚动值,类型整数KISSY.DOM.query(".t1")[0].scrollTop scrollHeight 返回元素内容的实际高度(包含滚动区域),类型整数 KISSY.DOM.query(".t1")[0].scrollHeight innerHTML 访问元素的所有子节点的 html 代码 html: <div class='t1'><a class='t2'></a><a class='t3'></a></div> console.log(KISSY.DOM.query(".t1")[0].innerHTML); // => "<a class='t2'></a><a class='t3'></a>" className 返回元素的 class 属性值 html: <div class='test warn'></div> console.log(KISSY.DOM.query(".test")[0].className); // => "test warn"appendChild 调用 appendChild(node) 给当前元素添加一个子节点 html: <div class='t1'></div> KISSY.DOM.query(".t1")[0].appendChild(document.createElement("span")); html: <div class='t1'><span></span></div> insertBefore 通过调用 parent.insertBefore(newNode,refNode) 将 newNode 插入到 refNode 前面 html: <div class='t1'><a class='t3'></a></div>KISSY.DOM.query(".t1")[0].insertBefore(document.createElement("span"),KISSY.DOM .query(".t3")[0]);html: <div class='t1'><span></span><a class='t3'></a></div> removeChild 调用 parent.removeChild(node) 将 node 从 parent 中去除 html: <div class='t1'><a class='t3'></a></div> KISSY.DOM.query(".t1")[0].removeChild(KISSY.DOM.query(".t3")[0]); html: <div class='t1'></div> replaceChild 调用 parent.replaceChild(newNode,exsitNode) 将 exsitNode 替换为 newNode html: <div class='t1'><a class='t3'></a></div>KISSY.DOM.query(".t1")[0].replaceChild(document.createElement("span"),KISSY.DOM .query(".t3")[0]); html: <div class='t1'><span></span></div> getElementsByTagName 调用 parent.getElementsByTagName(tagName) 获取 parent 下标签名为 tagName 的节 点数组 html: <div class='t1'><a class='t3'></a><div class='t4'><div class='t5'></div></div></div> console.log(KISSY.DOM.query(".t1")[0].getElementsByTagName("div")); // => [KISSY.DOM.query(".t4")[0],KISSY.DOM.query(".t5")[0]]HTMLInputElement代表输入框的节点( input ) 类型,可提供输入区域,包括以下属性和方法 value 可通过 value 属性获取用户的输入值或设置输入框的值 html:<input class='inp' /> console.log(KISSY.DOM.query(".inp")[0].value); // => 当前用户的输入值type 可通过 type 属性获取输入框的类型,包括 checkbox ,radio ,text ,默认为 text 注意:该 属性只读 html: <input class='inp' /> <input class='inp2' type='checkbox'/> console.log(KISSY.DOM.query(".inp")[0].type); // => "text" console.log(KISSY.DOM.query(".inp2")[0].type); // => "checkbox" name 可通过 name 属性获取输入框的名称属性 注意:该属性只读 html: <input class='inp' name='inp_in'/> console.log(KISSY.DOM.query(".inp")[0].name); // => "inp_in"disabled 可通过 disabled 读取或设置输入框元素是否禁用(允许用户输入) html: <input class='inp'/> console.log(KISSY.DOM.query(".inp")[0].disabled); // => false KISSY.DOM.query(".inp")[0].disabled = true; // => 用户将不能输入 console.log(KISSY.DOM.query(".inp")[0].disabled); // => true readOnly 可通过 readOnly 读取或设置输入框元素是否只读(不允许用户输入) html: <input class='inp'/> console.log(KISSY.DOM.query(".inp")[0].readOnly); // => false KISSY.DOM.query(".inp")[0].readOnly= true; // => 用户将不能输入 console.log(KISSY.DOM.query(".inp")[0].readOnly); // => true checked可通过 checked 读取或设置类型为 checkbox 或 radio 的输入框是否被选中 html: <input class='inp' type='checkbox' /> console.log(KISSY.DOM.query(".inp")[0].checked); // => false KISSY.DOM.query(".inp")[0].checked= true; // => 用户将不能输入 console.log(KISSY.DOM.query(".inp")[0].checked); // => trueHTMLSelectElement代表 select 的节点类型。
微信JSAPITicket接⼝签名详解本⽂实例为⼤家分享了微信JS接⼝签名的具体代码,供⼤家参考,具体内容如下1、微信 JS 接⼝签名校验⼯具2、具体开发2.1 获取access_token,然后jsapi_ticket/*** 获取access_token,然后jsapi_ticket*/private String getAccessToken_ticket(String path) {String access_token = null; // access_tokenString atime = null;// 获取时间String a_expires_in = null;// 有效时间(s)String ticket = null;// jsapi_ticketString ttime = null;// 得到时间String t_expires_in = null;// 有效时间(s)String access_tokenStr = TUtils.getAccessToken(APPID,API_KEY);if (access_tokenStr != null&& access_tokenStr.indexOf("access_token") != -1) {try {JSONObject jsonObject = new JSONObject(access_tokenStr);access_token = jsonObject.getString("access_token");a_expires_in = jsonObject.getString("expires_in");atime = getCurrentDateStr();} catch (JSONException e) {// e.printStackTrace();}}if (access_token != null && !access_token.equals("")) {String ticketStr = TicketUtils.getJSAPITicket(access_token);// System.out.println("ticketStr:" + ticketStr);if (ticketStr != null && ticketStr.indexOf("ticket") != -1) {try {JSONObject jsonObject = new JSONObject(ticketStr);ticket = jsonObject.getString("ticket");t_expires_in = jsonObject.getString("expires_in");ttime = getCurrentDateStr();} catch (JSONException e) {// e.printStackTrace();}}}String result = null;if (ticket != null && !ticket.equals("")) {result = "{\"access_token\":\"" + access_token+ "\",\"a_expires_in\":\"" + a_expires_in+ "\",\"atime\":\"" + atime + "\",\"ticket\":\"" + ticket+ "\",\"t_expires_in\":\"" + t_expires_in+ "\",\"ttime\":\"" + ttime + "\"}";if (MyFileUtils.writeIntoText(path, result)) {// System.out.println("写⼊⽂件成功");// System.out.println(result);} else {System.out.println("写⼊微信签名⽂件失败");}}return result;}public static String getAccessToken(String APPID, String APPSECRET) {String url = "https:///cgi-bin/token";String params = "grant_type=client_credential&appid=" + APPID+ "&secret=" + APPSECRET;String resultStr = HttpRequest.sendGet(url, params);// sendGet:⽤get⽅法获取数据 ,具体请参考之间的关于微信的⽂章 /jiduoduo/p/5749363.html return resultStr;}/*** 根据access_token获取ticket { "errcode":0, "errmsg":"ok", "ticket":* "bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA" * , "expires_in":7200 }** @param access_token* @return*/public static String getJSAPITicket(String access_token) {String url = "https:///cgi-bin/ticket/getticket";String params = "type=jsapi&access_token=" + access_token;String resultStr = HttpRequest.sendGet(url, params);return resultStr;}2.2具体⽣成签名signaturepublic String Wx_Signature() {String path = ServletActionContext.getServletContext().getRealPath("/wx/");// System.out.println(path);try {String tokenJSON = MyFileUtils.readText(path);// String access_token = null; // access_tokenString atime = null;// 获取时间String a_expires_in = null;// 有效时间(s)String ticket = null;// jsapi_ticket// String ttime = null;// 得到时间// String t_expires_in = null;// 有效时间(s)String result = tokenJSON;if (result == null || result.equals("")) {tokenJSON = getAccessToken_ticket(path);}// System.out.println(result);if (tokenJSON != null && !tokenJSON.equals("")&& tokenJSON.indexOf("access_token") != -1) {try {JSONObject jsonObject = new JSONObject(tokenJSON);// access_token = jsonObject.getString("access_token");//// access_tokenatime = jsonObject.getString("atime");// 开始时间a_expires_in = jsonObject.getString("a_expires_in");// 有效时间ticket = jsonObject.getString("ticket");// jsapi_ticket// System.out.println(ticket);// ttime = jsonObject.getString("ttime");// 开始时间// t_expires_in = jsonObject.getString("t_expires_in");//// 有效时间String t1 = getCurrentDateStr();String t2 = atime;// System.out.println(atime);// System.out.println(a_expires_in);// System.out.println(TimeInterval.getInterval(t2, t1));long end_time = Long.parseLong(a_expires_in) - 60;if (TimeInterval.getInterval(t2, t1) > end_time) {ticket = getAccessToken_ticket(path);}} catch (JSONException e) {msg = e.getMessage();}} else {}// System.out.println(ticket);String url = getParameter("url");String noncestr = TUtils.getRandomString(16);String timestamp = System.currentTimeMillis() + "";timestamp = timestamp.substring(0, 10);String data = "jsapi_ticket=" + ticket + "&noncestr=" + noncestr+ "×tamp=" + timestamp + "&url=" + url;String digest = new SHA1().getDigestOfString(data.getBytes());String signature = digest.toLowerCase();// signatureresult = "{\"noncestr\":\"" + noncestr + "\",\"timestamp\":\""+ timestamp + "\",\"url\":\"" + url + "\",\"signature\":\""+ signature + "\" ,\"ticket\":\"" + ticket + "\"}"; msg = result;} catch (IOException e) {msg = e.getMessage();}return msg}说明:签名是有调⽤次数,需要将其cache到服务器的⽂件中。
前端调⽤api接⼝⽅法总结我⽤得最多的⼤概就是jquery中的ajax了吧,就从ajax总结起⾛:⼀、ajax:参数解释:(主要就⽤到url、type、data、dataType、success、error等,其他的看需求⽽定)$.ajax({ url:" ", //请求的地址,类型为string type:" ", //请求⽅式,类型为string,两种“get”或者“post”,默认为“get” timeout: //要求为Number类型的参数,设置请求超时时间(毫秒)。
此设置将覆盖$.ajaxSetup()⽅法的全局设置。
async: //要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。
如果需要发送同步请求,请将此选项设置为false。
注意,同步请求将锁住浏览器,⽤户其他操作必须等待请求完成 cache: //要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false),设置为false将不会从浏览器缓存中加载请求信息。
data: //要求为Object或String类型的参数,发送到服务器的数据。
如果已经不是字符串,将⾃动转换为字符串格式。
get请求中将附加在url后 dataType: //要求为String类型的参数,预期服务器返回的数据类型。
如果不指定,JQuery将⾃动根据http包mime信息返回responseXML或responseText 作为回调函数参数传递。
可⽤的类型如下: xml:返回XML⽂档,可⽤JQuery处理。
html:返回纯⽂本HTML信息;包含的script标签会在插⼊DOM时执⾏。
script:返回纯⽂本JavaScript代码。
不会⾃动缓存结果。
除⾮设置了cache参数。
注意在远程请求时(不在同⼀个域下),所有post请求都将转为get请求。
JavaScript API接口文档V2.0天地图有限公司2013年3月文档说明本文档包含所有的内容除说明以外,版权均属天地图有限公司所有,受《中华人民共和国著作权法》保护及相关法律法规和中国加入的所有知识产权方面的国际条约的保护。
未经本公司书面许可,任何单位和个人不得以任何方式翻印和转载本文档的任何内容,否则视为侵权,天地图有限公司保留已发追究其法律责任的权利。
本文档是天地图Java Script API的用户使用参考手册,详细阐述了API提供用户的类和方法,以及可以实现的功能介绍。
天地图Java Script API让您可以将地图嵌入您自己的网页中。
API 提供了许多方法与地图进行交互,以及一系列向地图添加内容的服务,从而使您可以在自己的网站上创建稳定的地图应用程序。
本文档分为地图主类、控件类、工具类、叠加物、右键菜单类、实体类、事件类7个大章节。
以类(描述、属性、构造函数、方法)为索引讲述接口用法。
用户在阅读下面的文档时,可以根据需求对文档进行查询或跳跃式阅读。
从而更好地应用API类服务于自己的领域。
JavaScript API 整体概要设计API接口基本结构图API接口类基本关系图目录JavaScript API接口文档V2.0..........................................................................................................................I JavaScript API 整体概要设计............................................................................................................................II 1 地图主类 (5)1.1 TMap类 (5)1.1.1 构造函数 (5)1.1.2 配置方法 (5)1.1.3 地图状态方法 (5)1.1.4 修改地图状态方法 (6)1.1.5 坐标变换 (6)1.1.6 覆盖物方法 (7)1.1.7 控件 (7)1.1.8 地图图层方法 (7)1.1.9 事件方法 (8)1.2 TMapOptions类 (8)1.2.1 属性 (9)1.3 TMapTypeOptions类 (9)1.3.1 属性 (9)1.4 TMapType 类 (9)1.4.1 构造函数 (9)1.4.2 方法 (9)1.4.3 常量 (10)1.5 TTileLayer 类 (10)1.5.1 构造函数 (10)1.5.2 方法 (10)1.5.3 事件 (11)1.6 TTileLayerOptions类 (11)1.6.1 属性 (11)2 控件类 (11)2.1 TControl类 (11)2.1.1 方法 (12)2.2 TNavigationControlOptions类 (12)2.2.1 属性 (12)2.3 TNavigationControl类 (13)2.3.1 构造函数 (13)2.4 TOverviewMapControlOptions类 (13)2.4.1 属性 (13)2.5 TOverviewMapControl类 (13)2.5.1 构造函数 (13)2.5.2 方法 (14)2.5.3 事件 (14)2.6 TScaleControl类 (14)2.6.1 构造函数 (14)2.6.2 方法 (14)2.8 TCopyright类 (15)2.8.1 属性 (15)2.9 TMapTypeOptions类 (15)2.9.1 属性 (15)2.10 TMapTypeControl类 (15)2.10.1 构造函数 (15)3 工具类 (16)3.1 TMarkToolOptions类 (16)3.1.1 属性 (16)3.2 TMarkTool类 (16)3.2.1 构造函数 (16)3.2.2 方法 (16)3.2.3 事件 (17)3.3 TPolygonToolOptions类 (17)3.3.1 属性 (17)3.4 TPolygonTool类 (17)3.4.1 构造函数 (17)3.4.2 方法 (17)3.4.3 事件 (18)3.5 TPolylineToolOptions类 (18)3.5.1 属性 (18)3.6 TPolylineTool类 (18)3.6.1 构造函数 (19)3.6.2 方法 (19)3.6.3 事件 (19)3.7 TRectToolOptions类 (19)3.7.1 属性 (19)3.8 TRectTool类 (20)3.8.1 构造函数 (20)3.8.2 方法 (20)3.8.3 事件 (20)4 叠加物 (20)4.1 TOverlay类 (20)4.1.1 属性 (21)4.1.2 方法 (21)4.2 TLabelOptions类 (21)4.2.1 属性 (21)4.3 TLabel类 (22)4.3.1 构造函数 (22)4.3.2 方法 (22)4.3.3 事件 (23)4.4 TMarkerOptions类 (23)4.4.1 属性 (23)4.5 TMarker类 (24)4.6 TIconOptions类 (25)4.6.1 属性 (26)4.7 TIcon类 (26)4.7.1 构造函数 (26)4.7.2 方法 (26)4.8 TPolylineOptions类 (26)4.8.1 属性 (26)4.9 TPolyline类 (27)4.9.1 构造函数 (27)4.9.2 方法 (27)4.9.3 事件 (27)4.10 TPolygonOptions类 (28)4.10.1 属性 (28)4.11 TPolygon类 (28)4.11.1 构造函数 (28)4.11.2 方法 (28)4.11.3 事件 (29)4.12 TInfoWindowOptions类 (29)4.12.1 属性 (29)4.13 TInfoWindow类 (29)4.13.1 构造函数 (29)4.13.2 方法 (30)4.13.3 事件 (30)4.14 TRectOptions类 (31)4.14.1 属性 (31)4.15 TRect类 (31)4.15.1 构造函数 (31)4.15.2 方法 (31)4.15.3 事件 (32)4.16 TCircleOptions类 (32)4.16.1 属性 (32)4.17 TCircle类 (32)4.17.1 构造函数 (32)4.17.2 方法 (33)4.17.3 事件 (33)4.18 TEllipseOptions类 (33)4.18.1 属性 (33)4.19 TEllipse类 (34)4.19.1 构造函数 (34)4.19.2 方法 (34)4.19.3 事件 (35)5 右键菜单类 (35)5.1 TContextMenu类 (35)5.2 TMenuItem类 (35)5.2.1 构造函数 (36)5.2.2 属性 (36)5.3 TContextMenuOptions类 (36)5.3.1 属性 (36)6 实体类 (36)6.1 TLngLat类 (36)6.1.1 构造函数 (36)6.1.2 方法 (36)6.2 TBounds类 (37)6.2.1 构造函数 (37)6.2.2 方法 (37)6.3 TPixel类 (37)6.3.1 属性 (38)6.3.2 构造函数 (38)6.3.3 方法 (38)6.4 TSize类 (38)6.4.1 属性 (38)6.4.2 方法 (38)7 事件类 (38)7.1 TEvent类 (38)7.1.1 静态方法 (39)7.1.2 事件 (39)7.2 TEventListener 类 (39)1地图主类1.1TMap类此类是天地图地图API的基础类,是地图实例化的基础函数。
办公自动化杂志1场景与需求1.1应用场景JSAPI 支付是用户在微信中打开商户的H5页面,或在微信公众号内进入商家公众号,打开某个消费Web 页面,点击相应的商品或服务的时候,商户在H5页面通过调用微信支付提供的JSAPI 接口,调起微信支付模块完成商品或服务的在线支付。
此种支付方式使用方式灵活,快捷,在公众号内应用广泛。
本文以一个特种作业在线考培平台的资源支付为例,阐述JS-API 在线支付设计与实现。
1.2功能需求文中的案例特种作业在线考培平台主要采用三层架构的框架体系,采用C#.net 语言开发,采用SQL server 作为后台数据库,平台具有手机端和PC 端使用界面,其中手机端界面嵌入到企业微信公众号内使用,平台主要提供特种作业人员在线学习、模拟的功能,特种作业主要分为建筑施工特种作业、特种设备作业两大类,其中建筑施工特种作业类每个工种的在线学习资源、特种设备作业类每个工种的在线学习资源的学习价格可以在后台自定义。
2设计与实现2.1数据库设计出于安全及系统交易记录的可追溯性,在数据中创建一个名为ht_orders 的表用于存储线上交易数据,在交易出现问题时,有追溯的依据。
表ht_orders 的数据字典见表1。
表1后台数据库中存储交易记录的表结构2.2支付业务逻辑以在线考培平台建筑施工特种作业的施工升降机操作工为例进行说明,学员关注平台公众号,进入学习注册页面,完善学员的个人信息,个人信息包括学员身份证号码、手机号码,通过DropDownList 下拉列表框选择自己学习的工种(如:建筑施工升降机操作工等),点击注册按钮,学员填写的身份证号、手机号采用正则表达式的方式进行验证,验证通过后,弹出支付界面,学员进行支付,否则,将返回学员信息填写页面。
根据支付结果的返回值进行判断,如果支付成功,将学员的个人信息写入数据库,学员可以用其个人的身份证号码登录进行在线资源的使用,同时将交易记录的相关数据写入表ht_orders 中。
JSAPI ⽤户⼿册本⽂档主要涵盖如何嵌⼊SpiderMonkey javascript 引擎到你⾃⼰的c++程序中。
JavaScript 在浏览器端已经被⼴泛使⽤了。
但是,Mozilla 的javascript 引擎可以被嵌⼊到任何c++程序中,⽽不仅仅是应⽤于浏览器。
许多应⽤程序开发可以通过脚本化的⽅式获益,这些程序可以使⽤SpiderMonkey API 让c++代码⾥⾯跑js 代码。
What SpiderMonkey does?Javascript 引擎编译并执⾏js 脚本。
引擎本⾝负责脚本执⾏时的对象内存分配,垃圾收集等⼯作。
SpiderMonkey ⽀持Javascript 1.0-1.8版本。
Js 1.3以及后来的版本都符合ECMAScript 262-3规范。
后⾯的版本也包含Mozilla 扩展,⽐如数组压缩(array comprehensions )和⽣成器(generators).SpiderMonkey 也⽀持E4X ,但是这个是可选的。
在Javascript 的世界⾥⾯,我们马上就可以想到许多特性,⽐如事件处理(onclick),DOM 对象,window.open 以及XMLHTTPRequest.但是,在Mozilla ⾥⾯所有的特性都是由另外的组件提供,⽽不是SpiderMonkey 引擎本⾝。
SpiderMonkey 引擎本⾝只提供javascript 核⼼数据类型,⽐如number,string,array,object 等。
还有⼀些常⽤的⽅法,⽐如Array.push 。
SpiderMonkey 还可以让其它程序⾮常⽅便地暴露⾃⼰程序中的对象和接⼝给js 代码。
⽐如,浏览器暴露的就是DOM 接⼝。
(cocos2d-x 暴露的是cocos2d-x 的接⼝)。
你⾃⼰的程序也可以根据脚本的需求来设计待暴露接⼝。
具体由程序开发者⾃⼰来决定哪些对象和⽅法要暴露给脚本。
微信⽀付jsapi(公众号⽀付)接⼝调⽤差不多两个⽉前的⼀个项⽬要使⽤微信线下⽀付本⼈并没有接触过这⽅⾯的知识,作为刚出道的⼩⽩,⼀个微信⽀付差点把我折磨的死去活来,查看了许多⽂章才把这个功能实现。
如今跑到成都重新找⼯作,学习的时候也正好写点总结,把⽀付这⼀块的知识整理下。
好了,接下来看微信⽀付jsapi接⼝是怎么调⽤的步骤⼀:获取微信⽀付四⼤参数⾸先要想⽀持微信⽀付,必须拥有两个账号微信公众平台:账户公众APPID,APPSECEPT ,微信商户平台商户ID, API密钥步骤⼆:平台配置1.配置⽀付⽬录:商户平台:配置此⽬录是代码中“微信⽀付”所在页⾯的地址需要ICP备案。
2.配置授权域名:微信公众平台:⽀付过程需要获取⽤户openid,必须经过⽹页授权配置才可以,要不然获取不到openid。
官⽅解释:⽤户在⽹页授权页同意授权给公众号后,微信会将授权数据传给⼀个回调页⾯,回调页⾯需在此域名下,以确保安全可靠。
回调页⾯域名不⽀持IP地址。
第⼀步:⽤户同意授权,获取code参数:appid:公众号的唯⼀标识 redirect_uri:重定向的url,就是授权后要跳转的页⾯ scope:应⽤授权作⽤域 snsapi_base:不弹出授权页⾯,直接跳转,只能获取⽤户openid snsapi_userinfo:弹出授权页⾯,可通过openid拿到昵称、性别、所在地 state:重定向后带的参数 ⽤户同意后会产⽣⼀个code,只有5分钟时间的有效期。
第⼆步:通过code换取⽹页授权access_token(微信⽀付只需要openid,获取到access_token之后只需要⾥⾯openid参数)"expires_in":7200,"refresh_token":"REFRESH_TOKEN","openid":"OPENID",//微信j⽀付jsapi接⼝需要⽤到的参数"scope":"SCOPE" }步骤三调⽤接⼝统⼀下单微信统⼀下单API是微信⽀付的⼀个“统⼀”处理⼊⼝,官⽅给出的地址是https:///pay/unifiedorderhttps:///pay/unifiedorder(备⽤域名)需要的参数(此处使⽤服务商接⼝参数所以会有⼦商户的id 普通商户不需要)按照签名算法计算签名把所有要传递的参数键值对去掉值是空的,剩下的参数名ASCII码从⼩到⼤排序后,使⽤URL键值对格式(key1=value1&key2=value2...)拼接成StringA把StringA后⾯多加⼀组键值&key=商户平台密钥获得StringB把StringB按要求做"MD5"或"HMAC-SHA256"计算,并将结果字符转为⼤写微信甚⾄还提供了⼀个在线校验⼯具帮助开发者检查⽣成的签名是否正确,。
alipayjsapi的用法AlipayJSAPI是一种支付宝钱包内嵌JSAPI,它可以帮助商户将支付宝的支付功能集成到自己的网站或应用中。
这种支付方式可以让用户在不离开商户网站的情况下完成支付,为用户提供了更加便捷的支付体验。
AlipayJSAPI的用法非常简单,只需要按照一定的步骤进行操作即可,下面我将一步一步地详细介绍AlipayJSAPI的用法。
第一步,准备工作:在使用AlipayJSAPI之前,你需要拥有一个支付宝商家账户,然后在支付宝开放平台上创建应用,并获取到应用的AppID和应用私钥。
第二步,引入AlipayJSAPI的SDK:在你的网站或应用中引入AlipayJSAPI的SDK,可以通过CDN引入或下载SDK文件引入到项目中。
第三步,初始化AlipayJSAPI:在页面中使用AppID和应用私钥进行初始化AlipayJSAPI,这一步基本上只需要在页面加载时执行一次即可。
第四步,调用支付接口:当用户需要进行支付时,你可以通过AlipayJSAPI提供的接口发起支付请求,用户会在支付宝钱包内完成支付流程。
第五步,处理支付结果:支付完成后,支付宝会向你的后台服务器发送支付结果通知,你需要在后台对支付结果进行处理,更新订单状态等操作。
以上就是使用AlipayJSAPI的基本步骤,接下来我将详细介绍每一步骤的具体操作方法。
第一步,准备工作在创建支付宝应用之前,你需要拥有一个支付宝商家账户,如果你还没有商家账户,可以前往支付宝官网注册一个。
注册完成后,登录支付宝开放平台,进入开发者中心创建一个应用,获取到AppID和应用私钥。
第二步,引入AlipayJSAPI的SDK你可以通过CDN引入AlipayJSAPI的SDK,也可以在支付宝开放平台上下载SDK文件引入到项目中。
SDK文件中包含了AlipayJSAPI所需的各种方法和配置,你只需要在页面中引入SDK文件即可。
第三步,初始化AlipayJSAPI在页面加载时,你需要使用AppID和应用私钥对AlipayJSAPI进行初始化,这一步主要是为了在后续的支付过程中使用到AppID和应用私钥。
科 技 天 地45INTELLIGENCENewMap Server JSAPI调用“天地图”WMTS 服务方法吉林省基础地理信息中心 董志江 吴运凯 王 闯摘 要:由国家测绘地理信息局组织的“天地图”系统建设正在全国范围内迅速展开。
NewMap Server 以其完善的地图服务发布功能、快捷的系统构建模式,在“天地图”的建设中得到越来越多的应用。
本文介绍了如何利用NewMap Server JSAPI 调用“天地图”WMTS 服务。
关键词: NewMap Server JSAPI; 天地图;WMTS一、引言“天地图”是国家测绘地理信息局建设的地理信息综合服务网站。
它是“数字中国”的重要组成部分。
“天地图”的目的在于促进地理信息资源共享和高效利用,提高测绘地理信息公共服务能力和水平,改进测绘地理信息成果的服务方式,更好地满足国家信息化建设的需要,为社会公众的工作和生活提供方便。
NewMap Server 作为新一代大型地理信息系统软件,已在“天地图”系统建设中被广泛应用。
然而在系统建设过程中发现NewMap Server JSAPI 没有具体的对象来实现调用“天地图”WMTS 服务,那么如何利用NewMap Server JSAPI 调用“天地图”WMTS 服务,成为系统建设中的一个关键问题急需解决。
二、NewMap Server 与NewMap Server JSAPI 是什么NewMap Server 是一款具有完全自主知识产权的国产新一代大型地理信息系统软件。
NewMap Server JSAPI (NewMap Server JavaScript Map API)是NewMap Server 产品的重要组成部分,共包括15大类,97子类、486个二次开发接口函数,借助这些接口函数,可实现空间数据集成、地图数据浏览、空间数据信息查询、空间分析、地图控件集、投影转换 、公交换乘 、最短路径 、地址匹配等。
JS调用API接口实例
在Web开发中,我们经常需要通过调用API接口来获取数据或完成一些操作。
JavaScript作为一种常用的前端开发语言,可以通过AJAX技术来实现与API接口
的交互。
本文将介绍如何使用JavaScript调用API接口,并提供一个实例来演示具体的代
码实现。
一、AJAX简介
AJAX(Asynchronous JavaScript and XML)是一种用于创建快速动态网页的技术。
它通过在后台与服务器进行数据交换,实现局部刷新页面,而不需要重新加载整个页面。
AJAX使用XMLHttpRequest对象来与服务器进行通信,并可以接收来自服务器的数据,然后使用JavaScript来更新页面上的内容。
二、使用JavaScript调用API接口的步骤
要使用JavaScript调用API接口,需要经过以下几个步骤:
1.创建XMLHttpRequest对象:使用new XMLHttpRequest()来创建一个
XMLHttpRequest对象。
2.设置请求参数:通过open()方法设置请求的方法(GET、POST等)、URL和
是否异步。
3.发送请求:通过send()方法发送请求到服务器。
4.监听响应:使用onreadystatechange事件监听请求的状态变化,并在状态为
4(完成)时处理服务器的响应。
5.处理响应数据:在请求完成后,可以通过responseText或responseXML属性
获取服务器返回的数据。
下面是一个示例代码,演示了如何使用JavaScript调用API接口获取数据:
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 设置请求参数
xhr.open('GET', ' true);
// 发送请求
xhr.send();
// 监听响应
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 处理响应数据
var responseData = JSON.parse(xhr.responseText);
console.log(responseData);
}
};
在上面的代码中,我们通过GET方法向``发送了一个异步请求,并在请求完成后打印了服务器返回的数据。
三、API接口的认证和权限控制
在实际应用中,很多API接口都需要进行认证和权限控制,以确保只有授权的用户才能访问和使用接口。
常见的API接口认证方式包括:
•API密钥(API Key):通过在请求中携带一个密钥参数来进行认证。
•用户名和密码:通过在请求头中携带用户名和密码来进行认证。
•OAuth:通过OAuth协议进行认证和授权。
在调用API接口时,需要根据接口提供方的要求进行相应的认证和权限控制。
四、示例:使用JavaScript调用GitHub API获取用户信息
下面我们以调用GitHub API获取用户信息为例,演示如何使用JavaScript调用API接口的完整流程。
1.首先,我们需要在GitHub上创建一个OAuth App,获取到Client ID和
Client Secret。
具体步骤如下:
–登录GitHub账号,进入Settings页面。
–在左侧菜单中选择Developer settings,然后选择OAuth Apps。
–点击New OAuth App按钮,填写相应信息(Application name、Homepage URL、Authorization callback URL),并点击Register
application按钮。
–注册成功后,可以在OAuth Apps页面找到刚创建的App,并获取到Client ID和Client Secret。
2.在HTML文件中添加一个按钮和一个用于显示用户信息的div元素:
<button id="get-user-info">获取用户信息</button>
<div id="user-info"></div>
3.在JavaScript文件中添加以下代码:
// 获取按钮和div元素
var getUserInfoButton = document.getElementById('get-user-info');
var userInfoDiv = document.getElementById('user-info');
// 监听按钮点击事件
getUserInfoButton.addEventListener('click', function() {
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 设置请求参数
xhr.open('GET', ' true);
xhr.setRequestHeader('Authorization', 'token YOUR_ACCESS_TOKEN');
// 发送请求
xhr.send();
// 监听响应
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 处理响应数据
var responseData = JSON.parse(xhr.responseText);
userInfoDiv.innerHTML = '用户名:' + responseData.login + '<br>邮箱:' + responseData.email;
}
};
});
在上面的代码中,我们通过点击按钮来触发获取用户信息的操作。
在发送请求时,需要在请求头中携带一个Authorization字段,值为token YOUR_ACCESS_TOKEN,其
中YOUR_ACCESS_TOKEN需要替换为你自己的GitHub Access Token。
4.运行代码,点击按钮即可获取用户信息并显示在页面上。
五、总结
通过本文的介绍,我们了解了如何使用JavaScript调用API接口。
通过AJAX技术,我们可以在前端页面中与服务器进行数据交互,实现动态更新页面内容的效果。
在实际应用中,我们需要根据接口的要求进行认证和权限控制,以确保数据的安全性和合法性。
希望本文能帮助你更好地理解和应用JavaScript调用API接口的相关知识。
如果有任何问题或建议,欢迎留言讨论。