最近支付宝的领红包可真是刷爆了各个微信群啊，满群都是支付宝口令。可是这样推广可不是办法，又要复制又要打开支付宝又要点领取，太麻烦了。于是乎，提出了一个疑问！是否可以在微信里面点一个链接然后直接打开支付宝并自动领取呢？？？就像下面这样！上图解说：1、点击一个url2、立即跳转到支付宝APP3、并且秒领红包对，没错，上面就是本次案例的demo大家可以扫码体验：实现的原理很简单源码只有一个html文件和js文件html只要是方便加载jsindex.html正</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JavaScript</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/Gtvl6g5x">WebVR开发——Web Audio实现3D音效</a></h4>
<p class="post-item-summary"> 在VR开发中，除了图形视觉渲染，音频处理是重要的一环，好的音频处理可以欺骗用户的听觉，达到身临其境的效果，本文主要介绍WebVR音频是如何开发的。VRAudioVR音频的输出硬件主要是耳机，根据音频源与场景之间的关系，可将VR音频分为两类：静态音频和空间化音频(audiospatialization)。静态音频这类音频作用于整个VR场景，可简单的理解成背景音乐，音频输出是静态的，比如微风雨滴声、闹市声等充斥整个场景的背景音效。对于环境音效的开发，我们可以简单的使用标签进行循环播放。空间化音频音频作用在空间的实体上，具有发声体和听者的位置关系，音频输出会根据发声体与用户的距离、方向动态变化，它模拟了现实中声音的传播方式，具有空间感。实现原理：在虚拟场景中，通过调节音频的振幅来描述发声体与听者之间的距离，再通过调节左右通道(audiochannel)之间的差异，控制左右耳机喇叭输出，来描述发声体相对听者的方位。从发声体与用户两点间的距离来看，如距离越远，音频音量（振幅）应越小；从发声体与用户的方向来看，如发声体位于听者</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JavaScript</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/450x4Gjt">React 性能优化大挑战：一次理解 Immutable data 跟 shouldComponentUpdate</a></h4>
<p class="post-item-summary"> 原文出处：TechBridgeWeekly/huli前陣子正在重構公司的專案，試了一些東西之後發現自己對於React的渲染機制其實不太了解，不太知道render什麼時候會被觸發。而後來我發現不只我這樣，其實還有滿多人對這整個機制不太熟悉，因此決定寫這篇來分享自己的心得。其實不知道怎麼優化倒還好，更慘的事情是你自以為在優化，其實卻在拖慢效能，而根本的原因就是對React的整個機制還不夠熟。被「優化」過的component反而還變慢了！這個就嚴重了。因此，這篇文章會涵蓋到下面幾個主題：Component跟PureComponent的差異shouldComponentUpdate的作用React的渲染機制為什麼要用Immutabledatastructures為了判別你到底對以上這些理解多少，我們馬上進行幾個小測驗！有些有陷阱，請睜大眼睛看清楚啦！React小測驗第一題以下程式碼是個很簡單的網頁，就一個按鈕跟一個叫做Content的元件而已，而按鈕按下去之後會改變App這個component</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JavaScript</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view">
<span>AD</span>
<small>友情赞助</small>
</div>
</div>
<div class="media-body">
<div class="post-item-a-d">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 全站右侧栏 -->
<ins class="adsbygoogle"
style="display: block"
data-ad-client="ca-pub-5890596333400804"
data-ad-slot="4830530524"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/nsFM5Tw4">JavaScript高级程序设计01</a></h4>
<p class="post-item-summary"> functionoutside(x){functioninside(y){returnx+y;}returninside;}fn_inside=outside(3);//Thinkofitlike:givemeafunctionthatadds3towhateveryougiveitresult=fn_inside(5);//returns8result1=outside(3)(5);//returns8这里内部函数inside()，可以访问外部函数outside()里的变量x。而在外部只能调用outside()。第一次调用时，可以理解为outside(3)=3+y。多层嵌套函数functionA(x){functionB(y){functionC(z){console.log(x+y+z);}C(3);}B(2);}A(1);//logs6(1+2+3)这里的作用域链是（C，B，A，全局/windows）B形成了一个包含</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JavaScript</span></i></span>
<span><i class="fa fa-clock-o large"> 1900-01-01 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/LT01k0G2">从零收拾一个hybrid框架（一）-- 从选择JS通信方案开始</a></h4>
<p class="post-item-summary"> 相信很多人都在项目里熟练使用各种Hybrid技术，无论是使用了知名得WebViewJavascriptBridge框架来做自己的HybridWeb容器，又或是自己从头着手写了一个满足自己业务需求的bridge，从而构建起自己的HybridWeb容器，也有的干脆直接使用了cordova这一大型Hybrid容器框架，cordova+ionic来进行Hybrid的开发拆解学习框架源码是一个好事，但是在拆解优秀框架源码的背后，如何将多个优秀源码的精华打碎重塑，结合自己的产品业务需求重新组合成为适合自己的，并且扎实掌握可以灵活修改自如控制的代码，这也算是另一个层面的提升。选择合适的JS通信方案实现基本的JSBridge能力尝试拓展JSBridge的额外能力这一篇先重点聊聊JS与Native通信的通信方案几种JSNative相互通信方式的介绍大家可能看了很多大框架源码，无论是cordova还是WebViewJavascriptBridge他们核心的通信方式就都是假跳转请求拦截但其实JS与Nati</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JavaScript</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/35ujglvP">JSON和JSONP</a></h4>
<p class="post-item-summary"> 前言说到AJAX就会不可避免的面临两个问题，第一个是AJAX以何种格式来交换数据？第二个是跨域的需求如何解决？这两个问题目前都有不同的解决方案，比如数据可以用自定义字符串或者用XML来描述，跨域可以通过服务器端代理来解决。但到目前为止最被推崇或者说首选的方案还是用JSON来传数据，靠JSONP来跨域。而这就是本文将要讲述的内容。JSON和JSONP虽然只有一个字母的差别，但其实他们根本不是一回事儿：JSON是一种数据交换格式，而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。我们拿最近比较火的谍战片来打个比方，JSON是地下党们用来书写和交换情报的“暗号”，而JSONP则是把用暗号书写的情报传递给自己同志时使用的接头方式。看到没？一个是描述信息的格式，一个是信息传递双方约定的方法。既然随便聊聊，那我们就不再采用教条的方式来讲述，而是把关注重心放在帮助开发人员理解是否应当选择使用以及如何使用上。什么是JSONJSON的优点基于纯文本，跨平台传递极其简单；Javascript原生支持，后台语言几乎全部支持；轻量级数据格式</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>JSONP</span></i></span>
<span><i class="fa fa-clock-o large"> 2012-06-01 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览0次">
<span>0</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/2NG6wVr8">如果你想开发一个应用(1-16)</a></h4>
<p class="post-item-summary"> 1.png总体布局经过原型图，我们可以分析出首页的大概结构：头部是一个包含三个item的tab,用于控制内容区域显示不同的组件足部是疑似导航效果的三个按钮，分别对应开启新记录，开启新的图片记录，以及当前月的记录数目。剩下的就是内容主题部分。暂时只考虑日记这个tab节点的内容部分。它是一个月份列表内嵌套了一个本月的日记的列表，所以需要一个月份字段，并且由于日记是分组的，当前显示的组也需要记录，同时，还要知道页面内正在显示的月是哪一个月，也就是，在页面右下角记录条目要知道根据那个月份和组来进行计算。然后看记录的框框内都有什么内容：首先，是记录时间，包括星期，日期，时间，但这些可以用一个date对象代表，然后日记的标题，日记内容，发送日记时候的心情，天气，以及是否打了标记，这些为了前后端方便，均用int型来表示。所以最终经过分析最终的数据模型设计如下：indexTodos:[{month:0,//月份default:1,//正在显示的月份todos:[{createTime:n</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>HTML</span></i></span>
<span><i class="fa fa-clock-o large"> 1900-01-01 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览10次">
<span>10</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/8hKg0xH0">CSS效果篇--纯CSS+HTML实现checkbox的思路与实例</a></h4>
<p class="post-item-summary"> checkbox应该是一个比较常用的html功能了，不过浏览器自带的checkbox往往样式不怎么好看，而且不同浏览器效果也不一样。出于美化和统一视觉效果的需求，checkbox的自定义就被提出来了。这里对实现方法做个总结。实现思路纯css实现的主要手段是利用label标签的模拟功能。label的for属性可以关联一个具体的input元素，即使这个input本身不可被用户可见，有个与它对应的label后，用户可以直接通过和label标签交互来替代原生的input——而这给我们的样式模拟留下了空间。简而言之就是:隐藏原生input，样式定义的过程留给label（那为什么不直接改变checkbox的样式？因为checkbox作为浏览器默认组件，样式更改上并没有label那么方便，很多属性对checkbox都是不起作用的，比如background,而label在样式上基本和div一样'任人宰割')而在选择事件上，由于css的“相邻选择符(E+F)”的存在，让我们</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>CSS</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览13次">
<span>13</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/f3y971k1">重温webpack：骨架搭建</a></h4>
<p class="post-item-summary"> github地址找到skeleton分支什么是骨架：个人觉得：就是可以简单打包css,js,html，这样的使用场景比较多的是应用在于企业官网的开发。目标开发一个官网，你肯定不止一个页面，所以我们需要多个页面入口，多页面出口设置。比如|----build//存放webpack配置类似vue-cli生成的目录//打包结构|----dist|----index.html|----list.html|----css|----index.css|----list.css|----img|----js|----index.js|----list.js//目标结构|----src|----modules//存放公共文件|----css|----js|----pages|----index|----list//html,css,js都放入对应的文件夹Tips我们不会只有一个简简单单的webpack.config.js文件。我们想要高性能开发，就需要分别配置开发环境与生产环境。所以我们最开始的目录就是放</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>CSS</span></i></span>
<span><i class="fa fa-clock-o large"> 1900-01-01 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览8次">
<span>8</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/v76d8Brn">图表库源码剖析 - Chart.js 最流行的 Canvas 图表库</a></h4>
<p class="post-item-summary"> 首发于前端新能源写文章登录图表库源码剖析-Chart.js最流行的Canvas图表库无止休7hoursago引言,为什么想要研究Chartjs继之前我们研究了SVG.js和FrappeCharts后,我们对于svg的图表库已经有了初步的了解,但是对于可视化世界的canvas,我们更应该投入精力去了解学习.在看到chartist.js讲到自己的优势的时候,提到一些图表库使用了错误的技术canvas,那我们就更有兴趣去了解,为什么会有这种说法.首先让我们一起来了解一下Chartjs.Chartjs介绍Chartjs的官方介绍是一个简单灵活的图表库,相对而言Chartjs在图表库中的优势,主要是配置简单,动画比较优雅,而基于canvas的特性,让Chartjs性能会更有优势.Chartjs目前拥有34.4K的star,几乎已经是canvas版本的图表代名词,也是最流行的基于canvas的图表库.在GitHub上搜索chart,可以看到</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>HTML5</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-08 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view" data-toggle="tooltip" data-placement="top" title="文章被浏览12次">
<span>12</span>
<small>浏览</small>
</div>
</div>
<div class="media-body">
<h4><a class="media-heading title" href="/article/details/mx3GVkgP">AutoMapper 使用总结</a></h4>
<p class="post-item-summary"> AutoMapper使用总结初识AutoMapper在开始本篇文章之前，先来思考一个问题：一个项目分多层架构，如显示层、业务逻辑层、服务层、数据访问层。层与层访问需要数据载体，也就是类。如果多层通用一个类，一则会暴露出每层的字段，二者会使类字段很多，而且会出现很多冗余字段，这种方式是不可取的；如果每层都使用不同的类，则层与层调用时，一个字段一个字段的赋值又会很麻烦。针对第二种情况，可以使用AutoMapper来帮助我们实现类字段的赋值及转换。AutoMapper是一个对象映射器，它可以将一个一种类型的对象转换为另一种类型的对象。AutoMapper提供了映射规则及操作方法，使我们不用过多配置就可以映射两个类。安装AutoMapper通过Nuget安装AutoMapper，本次使用版本为6.2.2。AutoMapper配置初始化先创建两个类用于映射：publicclassProductEntity{publicstringName{get;set;}publicdecimalAmount{get;set;</p>
<div class="post-extra-data">
<span><i class="fa fa-file-text"> <span>.Net</span></i></span>
<span><i class="fa fa-clock-o large"> 2018-01-01 发布</i></span>
</div>
</div>
</div>
<div class="media post-item">
<div class="media-left">
<div class="post-left-view">
<span>AD</span>
<small>友情赞助</small>
</div>
</div>
<div class="media-body">
<div class="post-item-a-d">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 单个网页 - 3（移动网站，{SITE.DOMAIN}） -->
<ins class="adsbygoogle"
style="display: block"
data-ad-client="ca-pub-5890596333400804"
data-ad-slot="1023458179"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</div>
</div>
<ul class="pagination"><li><a href="/article/list/1">«</a></li><li><a href="/article/list/52">52</a></li><li><a href="/article/list/53">53</a></li><li><a href="/article/list/54">54</a></li><li><a href="/article/list/55">55</a></li><li class="active"><span>56</span></li><li><a href="/article/list/57">57</a></li><li><a href="/article/list/58">58</a></li><li><a href="/article/list/59">59</a></li><li><a href="/article/list/60">60</a></li><li><a href="/article/list/283">»</a></li></ul>
</div>
</div>
</section>
</div>
</div>
<footer class="ui-footer">
<div class="container">
<p>
<a href="/">码友网</a> 版权所有 © 2014-2025 · <span>Powered by .NET 7.0.0 on Linux</span>
</p>
<p>站点相关： <a href="/sn/latest">最新资讯</a> · <a href="/site/list">开发者必备</a> · <a href="/hot">最多阅读</a> · <a href="/cloudtags">标签云</a> · <a href="/about-us">关于码友网</a> · <a href="/rss/blog.xml">文章RSS</a> · <a href="/rss/sn.xml">资讯RSS</a> · <a href="/rss/question.xml">问答RSS</a> · <a href="/disclaimer">免责声明</a> · <a href="/sitemap.xml">网站地图</a></p>
<p>友情链接： <a href='https://www.donet5.com/' target='_blank'>果糖网</a> · <a href='http://www.webyang.net' target='_blank'>WebYang.NET</a> · <a href='http://shiyousan.com/' target='_blank'>十有三博客</a> · <a href='http://www.fangsi.net/' target='_blank'>放肆雷特</a> · <a href='http://www.itsvse.com/' target='_blank'>架构师</a> · <a href='https://walterlv.com' target='_blank'>walterlv</a> · <a href='https://lindexi.oschina.io/lindexi/' target='_blank'>lindexi</a> · <a href='https://www.51aspx.com' target='_blank'>51ASPX</a></p>
<p>
联系我们：
<span title="码友网官方QQ群"><i class="fa fa-qq" aria-hidden="true"></i>483350228</span>
<span title="电子邮箱" style="margin-left: 10px; display: inline-block;"><i class="fa fa-envelope" aria-hidden="true"></i>master@codedefault.com</span>
</p>
<p>ICP备案：<a href="https://beian.miit.gov.cn/" target="_blank">蜀ICP备14024472号-5</a></p>
</div>
</footer>
<div class="back-to-top">
<a><i class="fa fa-chevron-up" aria-hidden="true"></i></a>
</div>
</div>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-52484435-5"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-52484435-5');
</script>
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?048c0066de9e8716dc92331471a9af18";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
(function () {
var el = document.createElement("script");
el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?25ecbe92f623346ba596cbc40c6f342bdc75c1fe4fb0593e94524ca6e1152b7e30632485602430134f60bc55ca391050b680e2741bf7233a8f1da9902314a3fa";
el.id = "ttzz";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(el, s);
})(window)
</script>
<script src="/dist/js/site.min.js?v=QV5jp1YhO49Q5PmbEErECwhoYKLoPHVvHPTAuOjsydk"></script>
<script type="text/javascript">
window.cd.isLogin = 0;
window.cd.staticsHost = 'https://statics.codedefault.com';
</script>
</body>
</html>