用互联网的力量改善人们的生活
去年在公司做个一场简单的网银培训,包括网银常规组成部分,还有网银中常见的安全机制。
把PPT做成图片放上来,以备后续自己复习。感兴趣的童鞋也可以看看,有什么疑问也可以咨询我,尽力解答。
虚拟柜台,可以将网银理解为一个特殊的柜面。同时也在具体交易中。网银也有虚拟柜员、虚拟网点概念
部分柜面交易前推
3A银行(Anytime、Anywhere、Anyway)
渠道系统
密码控件应该包含防钩子,保证密码无明文。不管是在内存中还是哪里。
Ukey
跨域 ,判断referer里的地址是否和当前的地址一致
Referer,银联在线支付等交易。在应用中配置固定Referer地址。
sessionID修改,网银登陆成功后应用修改当前浏览器的sessionID。
Cookie,会话Cookie中存有sessionID 。添加httponly后js无法获取和解析cookie。
XSS\Iframe\sql注入、脚本注入。。。
近半年来工作主要是做支付平台,近期参与了部分微信公众号开发的工作。
由于做的是贷款类项目,原来接入的主动还款方式为代扣,目前线上已经遇到了一些问题,需要拓展支付渠道用户客户还款。所以预研了一下微信支付,用于客户主动还款。
由于只做了预研,后端并未做设计,只是完成了掉起微信支付界面,并成功付款。具体设计详细步骤如果接入了微信支付再来补充。
同时吐槽一句,微信支付的文档真的不咋地!!!(据说部分内容是产品经理写的→_→)
调起微信支付主要包括三个步骤
开发前需要搭建好微信支付开发环境.
相信需要接入微信支付,微信公众平台的开发环境已经准备好。
微信开发需要在商户中按照https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3进行配置
同时自己需有商户信息
商户号:
秘钥:**
微信公众号信息
AppID(应用ID):**** AppSecret(应用密钥):******
下载微信提供的java 版本DEMO
java版本demo内容还是比较齐全,基本整合入工程就可以使用。如果项目中使用spring的话,需稍作加工
详细介绍下这三个步骤,及注意事项
|
|
项目中使用了使用了spring,所以方法需要在spring中进行注册
WeChatPayService 如下
基本也是从Demo中拷贝出来,然后加入自己的参数
|
|
|
|
|
|
进入页面成功唤起微信支付框,支付成功后将执行回调方法中的alert,至此微信支付成功。
同时,这次只是前台成功唤起了支付的界面,微信支付接入最主要的还是后端支付平台的设计。主要有以下几个点需要注意
主要学习 @阮一峰 的ES6电子书,梳理今后工作中可能用到的一些功能和细节
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set 本身是一个构造函数,用来生成 Set 数据结构。
|
|
Set 函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。
|
|
去除数组重复成员的方法
|
|
向Set加入值的时候,不会发生类型转换,所以5和”5”是两个不同的值。Set内部判断两个值是否不同,使用的算法叫做“Same-value equality”,它类似于精确相等运算符(===),主要的区别是NaN等于自身,而精确相等运算符认为NaN不等于自身。
|
|
上面代码向 Set 实例添加了两个NaN,但是只能加入一个。这表明,在 Set 内部,两个NaN是相等。
另外,两个对象总是不相等的。
|
|
上面代码表示,由于两个空对象不相等,所以它们被视为两个值。
Set 结构的实例有以下属性。
==Set.prototype.constructor==:构造函数,默认就是Set函数。
==Set.prototype.size==:返回Set实例的成员总数。
Set 实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。下面先介绍四个操作方法。
==add(value)==:添加某个值,返回Set结构本身。
==delete(value)==:删除某个值,返回一个布尔值,表示删除是否成功。
==has(value)==:返回一个布尔值,表示该值是否为Set的成员。
==clear()==:清除所有成员,没有返回值。
上面这些属性和方法的实例如下。
|
|
数组重复成员的另一种方法。
|
|
Set 结构的实例有四个遍历方法,可以用于遍历成员。
keys():返回键名的遍历器
values():返回键值的遍历器
entries():返回键值对的遍历器
forEach():使用回调函数遍历每个成员
set=>array
|
|
array 去重操作
|
|
数组的map和filter方法也可以用于 Set(由于set是不存在重复元素,如果反过来处理就要考虑数组的元素可重复性)
|
|
使用 Set 可以很容易地实现并集(Union)、交集(Intersect)和差集(Difference)
|
|
如果想在遍历操作中,同步改变原来的 Set 结构,目前没有直接的方法,但有两种变通方法。一种是利用原 Set 结构映射出一个新的结构,然后赋值给原来的 Set 结构;另一种是利用Array.from方法。
|
|
日常使用情况不多,先记录理论,后续如果有场景再来进行补充
WeakSet 结构与 Set 类似,也是不重复的值的集合。但是,它与 Set 有两个区别
这是因为垃圾回收机制依赖引用计数,如果一个值的引用次数不为0,垃圾回收机制就不会释放这块内存。结束使用该值之后,有时会忘记取消引用,导致内存无法释放,进而可能会引发内存泄漏。WeakSet 里面的引用,都不计入垃圾回收机制,所以就不存在这个问题。因此,WeakSet 适合临时存放一组对象,以及存放跟对象绑定的信息。只要这些对象在外部消失,它在 WeakSet 里面的引用就会自动消失。
WeakSet 的成员是不适合引用的,因为它会随时消失。另外,由于 WeakSet 内部有多少个成员,取决于垃圾回收机制有没有运行,运行前后很可能成员个数是不一样的,而垃圾回收机制何时运行是不可预测的,因此 ES6 规定 WeakSet 不可遍历
JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。
为了解决这个问题,ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。
|
|
作为构造函数,Map 也可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。
|
|
Map连续赋值
如果读取一个未知的键,则返回undefined
如果 Map 的键是一个简单类型的值(数字、字符串、布尔值),则只要两个值严格相等,Map 将其视为一个键,比如0和-0就是一个键,布尔值true和字符串true则是两个不同的键。另外,undefined和null也是两个不同的键。虽然NaN不严格相等于自身,但 Map 将其视为同一个键。
|
|
(1)size属性
(2)set(key, value)
(3)get(key)
(4)has(key)
(5)delete(key)
(6)clear()
|
|
Map 结构转为数组结构,比较快速的方法是使用扩展运算符(…)
|
|
结合数组的map方法、filter方法,可以实现 Map 的遍历和过滤(Map 本身没有map和filter方法)。
|
|
Map 还有一个forEach方法,与数组的forEach方法类似,也可以实现遍历
|
|
forEach方法还可以接受第二个参数,用来绑定this。
上面代码中,forEach方法的回调函数的this,就指向reporter
|
|
|
|
|
|
对象转为 Map
|
|
Map 转为 JSON
Map 转为 JSON 要区分两种情况。一种情况是,Map 的键名都是字符串,这时可以选择转为对象 JSON。
|
|
另一种情况是,Map 的键名有非字符串,这时可以选择转为数组 JSON。
|
|
|
|
整个 JSON 就是一个数组,且每个数组成员本身,又是一个有两个成员的数组。这时,它可以一一对应地转为Map。这往往是数组转为 JSON 的逆操作。
|
|
主要学习 @阮一峰 的ES6电子书,梳理今后工作中可能用到的一些功能和细节
ES6 允许直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。
|
|
除了属性简写,方法也可以简写。
|
|
具体事例
属性的赋值器(setter)和取值器(getter),事实上也是采用这种写法。
|
|
ES6 允许字面量定义对象时,表达式作为对象的属性名,即把表达式放在方括号内。
|
|
表达式还可以用于定义方法名。
|
|
|
|
ES5 比较两个值是否相等,只有两个运算符:相等运算符(\==)和严格相等运算符(=\==)。它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0。JavaScript 缺乏一种运算,在所有环境中,只要两个值是一样的,它们就应该相等。
Object.is 用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致。
不同之处只有两个:一是+0不等于-0,二是NaN等于自身。
|
|
Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。
Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。
如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。
|
|
如果只有一个参数,Object.assign会直接返回该参数。
如果该参数不是对象,则会先转成对象,然后返回。
由于undefined和null无法转成对象,所以如果它们作为参数,就会报错。
Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。
|
|
对于这种嵌套的对象,一旦遇到同名属性,Object.assign的处理方法是替换,而不是添加。
Object.assign可以用来处理数组,但是会把数组视为对象。
|
|
Object.assign方法有很多用处。
(1)为对象添加属性
|
|
上面方法通过Object.assign方法,将x属性和y属性添加到Point类的对象实例。
(2)为对象添加方法
|
|
上面代码使用了对象属性的简洁表示法,直接将两个函数放在大括号中,再使用assign方法添加到SomeClass.prototype之中。
(3)克隆对象
|
|
上面代码将原始对象拷贝到一个空对象,就得到了原始对象的克隆。
不过,采用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值。如果想要保持继承链,可以采用下面的代码。
|
|
(4)合并多个对象
将多个对象合并到某个对象。
|
|
如果希望合并后返回一个新对象,可以改写上面函数,对一个空对象合并。
|
|
(5)为属性指定默认值
|
|
上面代码中,DEFAULTS对象是默认值,options对象是用户提供的参数。Object.assign方法将DEFAULTS和options合并成一个新对象,如果两者有同名属性,则option的属性值会覆盖DEFAULTS的属性值。
注意,由于存在浅拷贝的问题,DEFAULTS对象和options对象的所有属性的值,最好都是简单类型,不要指向另一个对象。否则,DEFAULTS对象的该属性很可能不起作用。
|
|
上面代码的原意是将url.port改成8000,url.host不变。实际结果却是options.url覆盖掉DEFAULTS.url,所以url.host就不存在了。
ES6 一共有5种方法可以遍历对象的属性。
for…in循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性)。
Object.keys返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含 Symbol 属性)。
Object.getOwnPropertyNames返回一个数组,包含对象自身的所有属性(不含 Symbol 属性,但是包括不可枚举属性)。
Object.getOwnPropertySymbols返回一个数组,包含对象自身的所有 Symbol 属性。
Reflect.ownKeys返回一个数组,包含对象自身的所有属性,不管属性名是 Symbol 或字符串,也不管是否可枚举。
以上的5种方法遍历对象的属性,都遵守同样的属性遍历的次序规则。
首先遍历所有属性名为数值的属性,按照数字排序。
其次遍历所有属性名为字符串的属性,按照生成时间排序。
最后遍历所有属性名为 Symbol 值的属性,按照生成时间排序。
Object.keys()
ES5 引入了Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名。
|
|
Object.keys配套的Object.values和Object.entries,作为遍历一个对象的补充手段,供for…of循环使用。
Object.entries的基本用途是遍历对象的属性。
|
|
Object.entries方法的另一个用处是,将对象转为真正的Map结构。
|
|
|
|
主要学习 @阮一峰 的ES6电子书,梳理今后工作中可能用到的一些功能和细节
Number.isFinite()对于非数值一律返回false
Number.isNaN()只有对于NaN才返回true,非NaN一律返回false
Number.parseInt(), Number.parseFloat()
ES6 将全局方法parseInt()和parseFloat(),移植到Number对象上面,行为完全保持不变
Number.isInteger()用来判断一个值是否为整数。需要注意的是,在 JavaScript 内部,整数和浮点数是同样的储存方法,所以3和3.0被视为同一个值
Number.isSafeInteger()则是用来判断一个整数是否落在这个范围之内
Math增加方法
Math.trunc方法用于去除一个数的小数部分,返回整数部分
对于非数值,Math.trunc内部使用Number方法将其先转为数值
对于空值和无法截取整数的值,返回NaN
Math.sign方法用来判断一个数到底是正数、负数、还是零。对于非数值,会先将其转换为数值
参数为正数,返回+1
参数为负数,返回-1
参数为0,返回0
参数为-0,返回-0
其他值,返回NaN
函数参数的默认值
|
|
另外一种写法
函数的 length 属性
指定了默认值以后,函数的length属性,将返回没有指定默认值的参数个数。也就是说,指定了默认值后,length属性将失真
作用域
一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context)。等到初始化结束,这个作用域就会消失
|
|
rest
rest 参数(形式为…变量名),用于获取函数的多余参数(类似java可变参数)
|
|
name 属性
函数的name属性,返回该函数的函数名。
|
|
箭头函数
基本用法
|
|
等价于
|
|
|
|
箭头符内如果有多行,必须用{}包裹,同时将结果return
如果箭头函数只有一行语句,且不需要返回值,可以采用下面的写法,就不用写大括号了。
|
|
使用注意点
箭头函数有几个使用注意点。
(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
(2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
(3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
(4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。
上面四点中,第一点尤其值得注意。this对象的指向是可变的,但是在箭头函数中,它是固定的。
|
|
下面是一个部署管道机制(pipeline)的例子,即前一个函数的输出是后一个函数的输入。
|
|
如果觉得上面的写法可读性比较差,也可以采用下面的写法。
|
|
函数参数的尾逗号
|
|
扩展运算符
扩展运算符(spread)是三个点(…)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。
|
|
如果扩展运算符后面是一个空数组,则不产生任何效果。
替代数组的 apply 方法
|
|
扩展运算符的应用
(1)合并数组
|
|
(2)与解构赋值结合(如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。)
|
|
(3)函数的返回值
JavaScript 的函数只能返回一个值,如果需要返回多个值,只能返回数组或对象。扩展运算符提供了解决这个问题的一种变通方法。
(4)字符串
|
|
(5)实现了 Iterator 接口的对象
任何 Iterator 接口的对象,都可以用扩展运算符转为真正的数组。
|
|
(6)Map 和 Set 结构
扩展运算符内部调用的是数据结构的 Iterator 接口,因此只要具有 Iterator 接口的对象,都可以使用扩展运算符,比如 Map 结构。
|
|
如果对没有 Iterator 接口的对象,使用扩展运算符,将会报错。
|
|
Array.from()
Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。
|
|
Array.of()
Array.of方法将一组值,转换为数组。
|
|
Array.of总是返回参数值组成的数组。如果没有参数,就返回一个空数组。
数组实例的 find() 和 findIndex()
数组实例的find方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
|
|
数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。
|
|
数组实例的fill()
fill方法使用给定值,填充一个数组。
fill方法还可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置。
|
|
数组实例的 entries(),keys() 和 values()
可以用for…of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。
|
|
如果不使用for…of循环,可以手动调用遍历器对象的next方法,进行遍历。
|
|
数组实例的 includes()
Array.prototype.includes方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes方法类似。
|
|
该方法的第二个参数表示搜索的起始位置,默认为0。如果第二个参数为负数,则表示倒数的位置,如果这时它大于数组长度(比如第二个参数为-4,但数组长度为3),则会重置为从0开始。
|
|
没有该方法之前,我们通常使用数组的indexOf方法,检查是否包含某个值
indexOf方法有两个缺点,一是不够语义化,它的含义是找到参数值的第一个出现位置,所以要去比较是否不等于-1,表达起来不够直观。二是,它内部使用严格相等运算符(===)进行判断,这会导致对NaN的误判。
|
|
includes使用的是不一样的判断算法,就没有这个问题。
数组的空位
ES5 对空位的处理,已经很不一致了,大多数情况下会忽略空位。
|
|
ES6 则是明确将空位转为undefined。
Array.from方法会将数组的空位,转为undefined,也就是说,这个方法不会忽略空位。
|
|
扩展运算符(…)也会将空位转为undefined。
|
|
copyWithin()会连空位一起拷贝。
|
|
fill()会将空位视为正常的数组位置。
for…of循环也会遍历空位。
上面代码中,数组arr有两个空位,for…of并没有忽略它们。如果改成map方法遍历,空位是会跳过的。
entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。
|
|
由于空位的处理规则非常不统一,所以建议避免出现空位。
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
|
|
More info: Writing
|
|
More info: Server
|
|
More info: Generating
|
|
More info: Deployment
好久没写blog了,2017年开始准备记录生活和工作中的点滴吧,从今天开始写今年的第一篇blog,主要是列举今年上半年的计划。
VueJs自己编写一个小DEMO,开发一个完整的仿饿了么前端DEMO,并且放入crodova中,用真机模拟调试。
熟悉小程序DEMO,并使用豆瓣API开发出一个仿豆瓣的应用,后期可考虑实现一个稍微复杂应用
考虑在新接手的移动项目中使用流式布局进行适配
学会简单的书写常用ES6语法
6.提高英语技能,达到能看懂简单文档水平,逐步达到看英文文档的标(暂时不做如此高要求,年度任务之一)
7.提高自己的java后台开发能力,主要着力学习spring全家桶
spring core 、spring boot、spring Batch 、spring security
8.着力搭建自己前后台分离框架,前台使用Vue,后台使用spring+mybatis
缺失模块。
1、请确保node版本大于6.2
2、在博客根目录(注意不是yilia根目录)执行以下命令:
npm i hexo-generator-json-content --save
3、在根目录_config.yml里添加配置:
jsonContent: meta: false pages: false posts: title: true date: true path: true text: false raw: false content: false slug: false updated: false comments: false link: false permalink: false excerpt: false categories: false tags: true