程序员的自我救赎---3.2：SSO及应用案例
《前言》（一）Winner2.0框架基础分析（二）PLSQL报表系统（三）SSO单点登录（四）短信中心与消息中心（五）钱包系统（六）GPU支付中心（七）权限系统（八）监控系统（九）会员中心（十）APP版本控制系统（十一）Winner前端框架与RPC接口规范讲解（十二）上层应用案例（十三）总结《SSO及应用案例》先说说SSO（单点登录）这种产物是怎么来的？场景是这样的假设一个大型应用平台（web）下面有几个模块比如：商城，机票，酒店。我上商城时候我没有登录，则登录一下，而又从商城跳转到酒店，发现酒店没登录则又需要登录一下酒店网站。这里人们就会想有没有，我在我当前域名下一处登录，就可以在当前域名（子域名）随处浏览以及操作，所以这时候就诞生了SSO。SSO不单单解决了我们“一处登录，到处操作”的问题以外，还省去了我们每个项目开发登录模块的时间。SSO的基本原理如下：SSO虽然叫单点登录，但是我们更愿意叫他“统一登录中心”，因为的他的职责就是承担了
javascript打怪升级--把业务逻辑当练习题做
1.前言开发项目和出没社区有一段时间了，会遇上一些比较有印象业务需求。这些业务需求，可能是自己开发项目遇上的，可能是在社区看到的业务需求，或者其他情况接触到的需求，但是这些业务需求的实现逻辑都值得一写。因为这些业务逻辑可以当做练习题一样，可以给大家练手。也希望大家从这些需求实现的逻辑里面可以能到javascript的相关知识，当然如果大家觉得代码需要怎样优化，或者有什么建议，更好的实现方案，觉得我哪里写错了，或者有觉得可以分享的需求，可以在评论提下！2.月份坐标轴这个需求是，看下图就懂了实现方式其实很简单，我在代码打上注释，大家就懂了！var_date=[],dateData=["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"];//准备一个月份反转的数组vardateDataRet=Object.assign([],dateData).reverse();//获取当前年份varyearText=newDate().getFullYear()
全局一次性引用写好的组件
全局一次性引用写好的组件我们写好了组件，接下去肯定还要引入和使用。但是你写的组件一旦多起来，在每一个个地方都需要去引用是一件很麻烦的事情，所以我们将一次性全局引入:新建components.js文件，引入所有组件importantcomponentAfrom'./componentAimportantcomponentBfrom'./componentBimportantVuefrom'vueconstcomponents=[componentA,componentB]constinstall=function(value,opts={}){components.map(component=>{Vue.component(component.name,component)})}exportdefau;tinstall在main.js进行导入importcomponentsfrom'./components.js'Vue
js正则学习笔记
工作中不可避免的会用到正则表达式，现就正则做以下总结。正则简介正则表达式是一种表达文本模式（即字符串结构）的方法，常常用作按照“给定模式”匹配文本的工具。有两种创建方式，一种是使用字面量，以斜杠表示开始和结束。另一种是使用RegExp构造函数。正则匹配规则字面量字符字符只表示字面的含义，无其他特殊含义。例如/abc/就匹配字符串abc。元字符字符有特殊含义，不代表字面的意思。主要有以下几种：^表示字符串的开始位置。$表示字符串的结束位置。|表示或关系。.表示除回车、换行、行分隔符和段分隔符以外的所有字符。除此之外，还有\，*，+，?，()，[]，{}等。此类字符如果要匹配它们本身，就需要在它们前面要加上反斜杠。字符类字符类表示有一系列字符可供选择，只要匹配其中一个就可以了。所有可供选择的字符都放在方括号内。如果方括号内的第一个字符是^，则表示除了字符类之中的字符，其他字符都可以匹配。对于连续序列的字符，连字符-用来提供简写形式，表示字符的连续范围。注意，字符类的连字符必须在头尾两个字符中间，才有特殊含义，否则就是字面含义。例
移动端 Modal 组件开发杂谈
Vant是有赞开发的一套基于Vue2.0的Mobile组件库，在开发的过程中也踩了很多坑，今天我们就来聊一聊开发一个移动端Modal组件（在有赞该组件被称为Popup）需要注意的一些坑。在任何一个合格的UI组件库中，Modal组件应该是必备的组件之一。它一般用于用户处理事物，但又不希望跳转页面时，可以使用Modal在当前页面中打开一个浮层，承载对应的操作。相比PC端，移动端的Modal组件坑会更多，比如滚动穿透问题就不像PC端在body上添加overflow:hidden那么简单。目录一、API定义二、水平垂直居中的方案三、可恶的滚动穿透四、position:fixed失效一、API定义任何一个组件开始编码前都需要首先将API先定义好，才好根据API来提供对应的功能。Modal组件提供了以下API：更具体的Api介绍可以访问该链接查看：Popup二、水平垂直居中方案垂直居中的方案网上谷歌一下就能找到很多种，主流的方案有：absolute(fixed)+负边距absolu
vue 过渡 动画
触发条件条件渲染(使用v-if)条件展示(使用v-show)动态组件组件根节点leave1.v-leave当前元素准备从显示转变成隐藏，在动画开始前添加到元素上，动画一旦开始会立即删除2.v-leave-active在动画过渡过程中，元素一直拥有该样式，直到动画结束则自动删除，用于设置过渡的效果3.v-leave-to在动画过渡过程中，元素一直拥有该样式，直到动画结束则自动删除，用于设置动画最终的效果enter1.v-enter当前元素准备从隐藏转变成显示，在动画开始前添加到元素上，动画一旦开始会立即删除2.v-enter-active在动画过渡过程中，元素一直拥有该样式，直到动画结束则自动删除，用于设置过渡的效果3.v-enter-to在动画过渡过程中，元素一直拥有该样式，直到动画结束则自动删除，用于设置动画最终的效果
RN Webview与Web的通信与调试
原文链接：https://mrzhang123.github.io/...ReactNativeVersion:0.51RN在0.37版本中加入了WebView功能，所以想要在使用WebView,版本必须>=0.37，发送的message只能是字符串，所以需要将其他格式的数据转换成字符串，在接收到后再转换回去，其实直接用JSON.stringify和JSON.parse就可以加载htmlsource属性用于指定加载的html，可以加载在线的页面，也可以加载本地的页面，代码如下：//加载线上页面
vue+element的表格分页和前端搜索
1.前端后台管理会存在很多表格,表格数据过多就需要分页;2.前端交互每次搜索如果都请求服务器会加大服务器的压力,所以在数据量不是很大的情况下可以一次性将数据返回,前端做检索3.下面贴上一个demo<template><div><el-inputv-model="tableDataName"placeholder="请输入姓名"style="width:240px"></el-input><el-buttontype="primary"@click="doFilter">搜索</el-button><el-buttontype="primary"@click="openData">展示数据</el-button><el-table:data="tableDataEnd"borderstyle="width:100%"><el-table-column
类似表格的删除与添加
这是吐槽，可以跳过的，刚学习vue的时候用的第一个框架是elementUI，真的是爱不释手，公司的业务要求也没那么多，基本都能满足，现在不一样了，啥都得自己写了。怎么说呢，幸与不幸，幸运的是能够自己多动手动脑了，不幸的是貌似脑子不够用的。。。。这个类表格，为什么要类表格呢？他虽然可以做成table,但因为很多人感觉table太low，所以大家都不怎么用，领导也不让用，于是我就用了这个类表格的称呼。在一些业务场景中我们得让用户能对类表格能增加删除，假如我们用的是jQuery，这就是简单的字符串拼接和事件绑定，中间会有点小波折，比如事件委托（刚开始是真的头疼）。但是我们现在用的vue，我们不应该再去拼接一坨字符串，我们只要操作数据就行了，我的思路如下：<!--more-->创建一个数组对象items:[{name:'',我adds:'',在tel:'',这}],里v-for进行循环，这一步对我来说比较难得就是v
架构师之路
Vue折腾记-(10)给axios做个挺靠谱的封装(报错,鉴权,跳转,拦截,提示)稍微改改都能直接拿来用~~~哟吼吼,哟吼吼.....如何无痛降低ifelse面条代码复杂度相信不少同学在维护老项目时，都遇到过在深深的ifelse之间纠缠的业务逻辑。面对这样的一团乱麻，简单粗暴地继续增量修改常常只会让复杂度越来越高，可读性越来越差，有没有固定的套路来梳理它呢？这里分享三种简单通用的重构方式。所谓的【面条代码】，常见于对复杂业务流程的处理中。…flex.css快速入门，极速布局什么是flex.css?css3flex布局相信很多人已经听说过甚至已经在开发中使用过它，但是我想我们都会有一个共同的经历，面对它的各种版本，各种坑，傻傻的分不清楚，flex.css就是对flex布局的一种封装，通过简洁的属性设置就能使得它完美的运行在移动端的各种浏览器，…this、apply、call、bind这又是一个面试经典问题~/(ㄒoㄒ)/~~也是ES5中众多坑中的一个，在ES6中可能会极大避免this产生的错误，但
好玩的CSS抖动样式 – CSS Shake ,支持 react
CSSShake是一个使用CSS3实现的动画样式，使用SASS编写，利用它我们可以实现多种不同样式的抖动效果（如下面的GIF图像）。这是一个很微小的动画，但使用得当也是挺不错的，比如用在广告、图像、按钮上，这样可以用来吸引用户眼球从而促使去点击它。这个Csshake有9个抖动样式，三个状态，如鼠标经过拉动、无限抖动、鼠标悬停拉动，一起来看一下吧。
基于Vue, Vuex 和 ElementUI 构建轻量单页Hexo主题Lite
HexoThemeLiteKeepCalm,LiteandWriting.lightsinglepageblogapplicationtheme,usingVue,Vuex,ElementUIandsoon.一款轻量单页博客主题，基于Vue,Vuex和ElementUI构建,工具语言TypescriptLiveDemoDemo|在线演示Github项目地址PreviewDev全程typescript+vuecomponent整体代码思路非常的清晰。Features支持自定义头像、背景自定义高斯模糊，效果如下：评论系统谷歌分析
(win10 64位系统中)Visual Studio 2015+OpenCV 3.3.0环境搭建，100%成功
(win1064位系统中)VisualStudio2015+OpenCV3.3.0环境搭建，100%成功(win1064位系统中)VisualStudio2015+OpenCV3.3.0环境搭建，100%成功VisualStudio2015下载地址：https://msdn.itellyou.cn/VisualStudioEnterprise2015简体中文版（企业版）KEY：HM6NR-QXX7C-DFW2Y-8B82K-WTYJV1.下载opencv官网http://opencv.org/下载windows版OpenCV,下载后解压,我的路径为D:\ProgramFiles\soft\opencv\OpenCV-PC-sdk,解压完成后,会在该路径下生成一个名为opencv的文件夹,它包含两个子文件夹,分别为build(支持opencv使用的相关文件目录)和sources(opencv源码目录)2.配置环境变量【计算机】->【（右键）属性】->【高级系统设置】->【环境变量】->（双击
是的，软件工程师也能玩转异构计算
智东西（公众号：zhidxcom）文|英特尔中国研究院HERO是一套性能强大、配置灵活、接口丰富的异构[…]智东西（公众号：zhidxcom）文|英特尔中国研究院HERO是一套性能强大、配置灵活、接口丰富的异构计算平台，适合作为服务机器人和小型无人车等智能自主系统的运算核心。集成的英特尔®酷睿™i5/i7CPU和,英特尔®Arria10FPGA芯片，能够实时处理大量数据并运行多种智能算法。对于算法研究者和软件工程师，如何才能充分发挥FPGA的性能，让自己的算法在HERO平台上快到飞起？本文将告诉你答案。一、为什么要异构计算完成不同的任务需要采用不同的芯片架构。对于要求高并行、低时延的计算和控制任务，如视觉处理、自主定位、运动规划和控制等，FPGA可以凭借强大的并行计算能力轻松应对。而CPU作为高速的串行处理器，从大吞吐量的例行性计算中解放出来，可专注于高层次的任务规划、决策和人机交互等。二者相辅相成，组成机器人的最强大脑。事实上，人脑也是类似的工作机制。心理学家认为人脑中有两套系统，一套是完全自
为PowerApps和Flow，Power BI开发自定义连接器
作者：陈希章发表于2017年12月20日前言我在之前用了几篇文章来介绍新一代微软商业应用平台三剑客（PowerApps，MicrosoftFlow，PowerBI），相信对于大家会有一种跃跃欲试的冲动，他们看起来真的不难，因为他们的定位是要给业务部门的用户直接使用的。那么现在问题就来了他们为什么能这么灵活和强大？如果这些活儿都是业务部门用户自己去做了，那么IT部门人员，开发人员该干嘛呢？好问题啊！但是这两个问题其实是相关的，而且第二个问题的答案就是第一个问题所描述的结果。因为可以将IT专业人员（ITPro）和开发人员（Developer）从日常的轻量级业务应用的工作中解放出来，所以，他们可以去做一些更加擅长的技术、通用性的业务支撑组件的开发。我们再来看一张已经多次展示过的图片在应用的基础架构这部分，CommonDataService我此前已经介绍过了，Gateways也已经在PowerApps进阶篇中讲解过。Prodevextensibility在目前这个系列中我不准备展开。那么就余下了Connectors（连接器了）
springfox & swagger-ui 和 springmvc的整合(以及展示路径修改)
最近的一个新项目，在定义后端接口的时候，发现有些字段和接口名需要频繁的更改。以前的实现方式是定义一个wiki，通过wiki来描述接口，但是随着时间的流逝已经各种小的变更，wiki和实际的接口实现差别越来越大。基本到了一种不可维护的状态。前一段时间在翻github的时候，正好看到swagger项目。搜索了一下，发现确实很不错，能很好的描述接口，遂决定在新项目中使用一下。注:本文是基于springboot配置实现，但在实际中使用springmvc和本文的配置基本一致，不影响使用。下面是第一种配置方式。尽量精简的配置。一1在pom文件中引入依赖
北京云栖大会 Tech Insight 金融级分布式架构分享一览
金融机构进行业务突破和创新的关键是什么？大家可能各有看法，蚂蚁金服给出的答案是：行业IT架构从传统的集中式架构向分布式架构转型如何实现集中式架构向分布式架构转型呢？——“蚂蚁金融云”“蚂蚁金融云”为金融机构了完整的分布式解决方案，“蚂蚁金融云”的核心系统安全可靠，并能涵盖高并发、海量数据处理、快速容灾恢复、无线伸缩能力、多地多活等场景，能够按需供给精细化资源调度。这套解决方案，汇聚了历经十多年磨砺的核心金融技术、业务服务能力，现在通过公有云服务的方式全面开放，希望能帮助行业客户和生态伙伴进行积极转型、促进业务突破。我们有信心能帮助金融机构解决传统集中式架构转型的困难，从而降低实施风险，减少试错的成本，达到打造大规模高可用的分布式系统架构的目的，在金融级的一致性要求和海量并发能力上达到很好的平衡。本次云栖大会TechInsight让你了解SOFA本次云栖大会“蚂蚁金融云”发布了SOFA（ScalableOpenFinancialArchitecture）平台，即面向金融级的开放可扩展分布式云平台，涵盖了
专访Gabe Monroy：云原生架构师需要做什么
近一年多来，云原生以及Kubernetes越来越受到社区和业界重视，Kubernetes更是成为了容器编排的事实标准，基于Kubernetes的云原生架构也被越来越多的人谈及，云原生到底是什么，需要做哪些事情？带着这些问题，InfoQ记者采访了微软云原生方面的专家GabeMonroy。受访嘉宾介绍：GabeMonroy是微信Azure云容器技术的首席项目经理，其代表微软参加开源组织云原生计算基金会CNCF。Gabe曾是Deis公司的创始人与CTO，Deis公司于2017年被微软收购。作为Docker和Kubernetes的早期贡献者，Gabe在容器技术方面有着丰富的经验，并经常在PaaS、分布式系统和云原生架构方面提供建议。InfoQ：请介绍一下CNCF，您在里面负责什么工作？Gabe：CNCF的存在是为了推广专门为分布式系统而创建的计算范式而建立的组织，这种分布式系统拥有可伸缩的数以千计的自愈型节点。通过推广开源项目，帮助壮大云原生生态体系，我们希望让云原生技术能更加普及。赋予用户更多能力一直是微软的核心任务，在这样
闲话权限系统的设计
一、权限的本质权限管理，首先要理清权限的本质：权限就是对受保护资源的有限许可访问。理解了权限的本质，就好谈权限的管理了。权限就是对受保护资源的有限许可访问--这句话包含两层含义：1，受保护的资源2，有限的许可访问但，本质上谈的都是对资源的访问，所以探讨权限问题，首先要定义资源。二、资源的概念资源是一个抽象的概念，按照百科的词条解释，“资源”是指一国或一定地区内拥有的物力、财力、人力等各种物质要素的总称。分为自然资源和社会资源两大类。前者如阳光、空气、水、土地、森林、草原、动物、矿藏等；后者包括人力资源、信息资源以及经过劳动创造的各种物质财富等。在计算机软件中，资源指的是软件使用过程中使用的各种对象，功能，文件，网络等各种要素的总称。比如一个按钮所操作功能也算是一种资源；这样，菜单，按钮，页面等等，都可以算是资源。甚至，数据库的某个字段，也是资源。如果按照RESTFullAPI的思路去理解资源可能更好理解。2.1资源的识别资源多了，管理起来也有点麻烦，比如一个软件有很多按钮，要搞清楚这些按
微服务学习（3）-基于Dubbo+Zookeeper+Spring的系统搭建
一、注册中心Zookeeper的安装正如上一章节（微服务学习（2）-微服务框架实现-Dubbo简介）中介绍的服务的消费者和提供者都需要在注册中心注册。所以，本节选择Zookeeper入手介绍注册中心的安装部署。ZooKeeper是一个分布式的，开放源码的分布式应用程序协调服务，是Google的Chubby一个开源的实现，是Hadoop和Hbase的重要组件。它是一个为分布式应用提供一致性服务的软件，提供的功能包括：配置维护、域名服务、分布式同步、组服务等。1)Zookeeper下载可以到官网http://zookeeper.apache.org/下载。2）下载解压到指定目录下D:\soft\zookeeper-3.4.8修改zoo_sample.cfg文件名(D:\soft\zookeeper-3.4.8\conf)为zoo.cfg主要修改一下日志位置，具体配置文件如下：[html]viewplaincopy#ThenumberofmillisecondsofeachticktickTime=