{"title":"Freetao's Blog","description":"Web开发工程师郭涛的博客，在这里记录成长点滴、生活感悟，分享Web开发技术、开发技巧","language":"zh-Hans","link":"https://blogs.kainy.cn","pubDate":"Tue, 31 Jul 2018 09:55:04 GMT","lastBuildDate":"Sun, 16 Sep 2018 08:40:08 GMT","generator":"hexo-generator-json-feed","webMaster":"Kainy Guo","items":[{"title":"小程序分享网页方案","link":"https://blogs.kainy.cn/2018/07/博客／资讯类网页在小程序中分享的方案/","description":"TL;DR 可以点击这里体验是否你需要的效果后，再回来看内容。小程序卡片分享相比链接分享的优势不言而喻：更大的封面图片意味着可承载更多信息，和更强的视觉表现力；更大\b的面积，也意味着在聊天窗口中更容易被点到（算是额外福利）。但如果单纯为了发挥这一优势专门开发一个资讯小程序，其产出又不足以覆盖投入。并且，为了方便传播和跨平台访问，H5无疑是最合适的内容载体。于是思路转化为：是否可以像iOS、安卓webview一样，打造一个小程序版的内容容器。小程序web-view组件就可以用来实现：微信生态内，优先通过小程序传播h5页面，同时将改造的开发量和影响降到最低这一需求。","pubDate":"Tue, 31 Jul 2018 09:55:04 GMT","guid":"https://blogs.kainy.cn/2018/07/博客／资讯类网页在小程序中分享的方案/","category":"建站❤编程"},{"title":"小程序工程化开发之：重构稿转为wxml","link":"https://blogs.kainy.cn/2018/06/小程序工程化开发之：重构稿转为wxml/","description":"需求背景在开发微海报小程序时，由于团队没有过小程序开发经历。按照常规流程，重构输出的是移动端 HTML 网页，以 rem 为尺寸单位。这与小程序的 wxml 和 rpx 之间有一个转化的过程，如果手工转化，无疑带来巨大的额外工作量，而让重构同学短期内熟练掌握小程序开发工具和一套新的标记语言又不太现实。","pubDate":"Tue, 12 Jun 2018 23:03:13 GMT","guid":"https://blogs.kainy.cn/2018/06/小程序工程化开发之：重构稿转为wxml/","category":"建站❤编程"},{"title":"总在深夜放大招，小程序官方团队真的没有性生活？","link":"https://blogs.kainy.cn/2018/03/180328总在深夜放大招，小程序官方团队真的没有X生活？/","description":"","pubDate":"Wed, 28 Mar 2018 10:50:35 GMT","guid":"https://blogs.kainy.cn/2018/03/180328总在深夜放大招，小程序官方团队真的没有X生活？/","category":"建站❤编程"},{"title":"通过小程序卡片打开APP获取参数的方法","link":"https://blogs.kainy.cn/2018/02/通过小程序卡片打开APP获取参数的方法/","description":"引入最近在\b\b\b研究小程序与 APP 互为补充，在营销业务中适用的场景。其中一个是 APP 中分享小程序卡片给微信好友，好友打开小程序卡片，参与活动后，跳回到 APP 中查看奖励或更多活动。网上参考资料不多，请教了对这块比较了解的相关人士，记录一个。","pubDate":"Fri, 02 Feb 2018 10:50:35 GMT","guid":"https://blogs.kainy.cn/2018/02/通过小程序卡片打开APP获取参数的方法/","category":"建站❤编程"},{"title":"WebApp实现离线化","link":"https://blogs.kainy.cn/2017/12/PWA在专属海报的应用/","description":"引入PWA（渐进式网页应用）对于关注新技术得同学想必已不陌生。14年至今，其应用不如应有的那么广泛，最大的障碍：缺乏iOS支持，最近已被打破 —— Safari技术预览版已经默认开启\b Service Worker；从开发者角度，缺少一个开箱即用的方案，且规范本身在快速发展，则是技术人员选择观望的重要原因。本文将以专属海报为例，介绍通过 workbox工具， 快速为项目启用 PWA 中离线特性的方法，以及技巧总结。","pubDate":"Mon, 25 Dec 2017 10:50:35 GMT","guid":"https://blogs.kainy.cn/2017/12/PWA在专属海报的应用/","category":"建站❤编程"},{"title":"让webapp的UI体验更接近原生的小技巧","link":"https://blogs.kainy.cn/2017/09/让webapp的UI体验更接近原生的小技巧/","description":"下拉刷新（图2）和长按选中（图3）是移动端常用操作，也是区分 APP 原生页面和 H5 页面最直观的方法（图1）之一。图1：被一眼看出的 H5 页面","pubDate":"Fri, 15 Sep 2017 10:50:35 GMT","guid":"https://blogs.kainy.cn/2017/09/让webapp的UI体验更接近原生的小技巧/","category":"建站❤编程"},{"title":"小程序页面“被缓存”问题的解决方法","link":"https://blogs.kainy.cn/2017/09/小程序页面“乱入”问题的解决办法/","description":"看到 caoz 在公众号文章《小程序的红利期》里提到“有时候进入小程序，会乱跳一些非目标页面，比如进入某人的语音红包，结果进入的是另一个人的”这个问题。自己曾今遇到并解决过，可至今仍能在一些颇具影响力的小程序上发现，似乎不少开发者都认定这是小程序的锅了，感觉有必要把这个问题拎出来说说。","pubDate":"Sun, 03 Sep 2017 10:50:35 GMT","guid":"https://blogs.kainy.cn/2017/09/小程序页面“乱入”问题的解决办法/","category":"学习笔记"},{"title":"TFC2017参会速记","link":"https://blogs.kainy.cn/2017/06/TFC2017参会速记/","description":"大会开幕词中 Stone 提到的“技术半衰期”让人印象深刻，确实前端技术日新月异，要保持持续学习的能力和耐力。第一个分享主题 Nicolas 介绍了 TC39 ，ECMAScript 规范产生流程的五个阶段，并介绍了目前处于 stage4 的 Async Functions 、 数组实例等 includes 方法; stage3 的 Async Iteration、Dynamic import（）等； stage2的 类装饰器、 promise 实例的 finally 方法等，让我们看到前端未来的发展方向。","pubDate":"Sat, 24 Jun 2017 09:58:02 GMT","guid":"https://blogs.kainy.cn/2017/06/TFC2017参会速记/","category":"学习笔记"},{"title":"硅谷之行的收获","link":"https://blogs.kainy.cn/2017/03/硅谷之行的收获/","description":"这两天看到同行小伙伴都有所总结，我也匆匆撸了一篇（最后还是没忍住偷了点懒 😜 ，有种回到小学暑假最后几天赶作业的错觉。。此次行程，博览老司机带我们参观了 Google、PayPal 这样的IT巨头，也拜访了 SkyMind 这样的初创企业，在泛伟律所以及孵化器 RocketSpace 听创业故事和法规案例，到斯坦福和旧金山大学感受学府气息，可以说行程囊括了硅谷科技生态中的方方面面。","pubDate":"Sun, 19 Mar 2017 05:22:43 GMT","guid":"https://blogs.kainy.cn/2017/03/硅谷之行的收获/","category":"心路历程"},{"title":"小程序自定义分析功能（上）","link":"https://blogs.kainy.cn/2017/02/小程序数据自定义分析功能/","description":"目前为止，小程序后台的 “数据分析” 模块由 “实时统计” 和” 访问分析” 两部分组成，主要根据页面和时长两个维度来观察小程序受访情况，如详情页访问次数、时长、分享次数等等。但由于用户实际交互的小程序界面，由页面（page）和数据（appData）两部分组合而成，想要完成完整的用户行为分析，如访问者的地域、年龄、性别分布如何？不同用户群感兴趣的内容有何差异？具体到某一篇游记的浏览量如何？从浏览到分享的转化率如何？这些目标通过目前已有的标准统计是无法达到的。而自定义分析的推出恰恰解决了这些痛点。自定义分析功能牛逼之处官方对自定义分析的描述是：“自定义分析支持灵活多维和近实时的用户行为分析，可以通过自定义上报，对用户在小程序内的行为做精细化跟踪，满足页面访问等标准统计以外的个性化分析需求”","pubDate":"Fri, 10 Feb 2017 07:33:16 GMT","guid":"https://blogs.kainy.cn/2017/02/小程序数据自定义分析功能/","category":"建站❤编程"},{"title":"《跨时空》旅行日记小程序","link":"https://blogs.kainy.cn/2017/01/《跨时空》旅行日记小程序/","description":"题外话我喜欢旅行，在正文开始前，先向有共同兴趣的朋友推荐一个自己每次出行前必装的 APP —— 面包旅行。我主要用它来做旅行日志，每天行程结束，我都会将当天拍的照片上传并做简单的文字记录，记录是回顾一天行程的最好方式，也方便日后回忆。由于面包旅行的旅行日记基于旅行爱好者分享（UGC），相对比较纯粹，我平时还会在上面浏览旅记，常常能在不经意间找到打动自己的图片或文字。","pubDate":"Sun, 08 Jan 2017 07:33:16 GMT","guid":"https://blogs.kainy.cn/2017/01/《跨时空》旅行日记小程序/","category":"建站❤编程"},{"title":"Node.js 项目持续集成实践","link":"https://blogs.kainy.cn/2016/12/项目持续集成实践/","description":"前端开发流程（ 语法检查、编译、重载）的自动化我们在工作中已经用得比较溜了，这篇文章主要介绍 Node.js 应用部署到服务端过程（编译、测试）的自动化。这里以开源的 API Mock 系统 AMP 的部署为例（ https://mocks.leanapp.cn ），通过这套系统提供的 mock 服务，前端可以在接口定义完毕后就着手开发，与后端接口开发并行以提升项目整体效率。接口支持 CORS 跨域访问、支持 HTTPS 访问，为前端开发，尤其是移动端开发带来便利。","pubDate":"Thu, 15 Dec 2016 22:15:55 GMT","guid":"https://blogs.kainy.cn/2016/12/项目持续集成实践/","category":"建站❤编程"},{"title":"ATS ( App Transport Security )是什么，以及如何支持 ATS","link":"https://blogs.kainy.cn/2016/12/ATS ( App Transport Security )是什么，以及如何支持 ATS/","description":"今天明秋童鞋在需求文档中看到接入任意门需要满足 ATS 标准，我们就来了解了下什么是 ATS ；该标准对 web 开发的影响，及应对措施。什么是 ATSApp Transport Security，简称 ATS，是苹果为了提高 App 与服务器之间数据安全，而在 iOS 9 当中首次推出的一项安全特性。在苹果全球开发者大会（WWDC）的一场演示中，该公司公布了一个最后期限——2017 年 1 月 1 日——即 App Store 当中的所有应用必须在这个日期之前启用这一重要安全功能。","pubDate":"Mon, 12 Dec 2016 18:21:12 GMT","guid":"https://blogs.kainy.cn/2016/12/ATS ( App Transport Security )是什么，以及如何支持 ATS/","category":"建站❤编程"},{"title":"小程序金融保险行业应用交流","link":"https://blogs.kainy.cn/2016/11/小程序金融保险行业应用交流/","description":"二次渲染，暂不支持暂时用预设的 template 嵌套方案，后面几期做支持crash 监控，版本回滚机制后续支持脚本错误，crash 信息，可能在 appjs 里捕获这些信息；回滚暂时还是需要审核，应用发安卓市场还是 appstore 也都存在这个问题，质量把控，平台做再多的事情可能也不如开发者做得更好一些。","pubDate":"Mon, 28 Nov 2016 12:20:16 GMT","guid":"https://blogs.kainy.cn/2016/11/小程序金融保险行业应用交流/","category":"建站❤编程"},{"title":"全栈工程师培训笔记","link":"https://blogs.kainy.cn/2016/11/全栈工程师培训笔记/","description":"有幸参加阮一峰老师为期两天的《全栈工程师培训》，获益良多，将训练营四讲内容分享如下：纲要第一讲：前端开发的历史和趋势前端开发的历史演变前端 MVC 框架的兴起前后端分离全栈工程师前端开发的未来","pubDate":"Sun, 20 Nov 2016 22:06:46 GMT","guid":"https://blogs.kainy.cn/2016/11/全栈工程师培训笔记/","category":"建站❤编程"},{"title":"Android WebView 前端开发调试","link":"https://blogs.kainy.cn/2016/03/Android_WebView_前端开发调试/","description":"在这次的参数RSA+AES加密需求(160310版本)中，由于涉及的接口众多，测试回归时需要在微信中到相关页面进行验证，工作量巨大，所以需要一个更高效率的移动端调测方式。这篇文章要里介绍了连接和抓包，其中出现远程调试安卓Webview的截图，很多同事尝试时在列表中只能看到chrome中打开的页面，通过 这篇文章可以知道，原因是其他app可能没有开启webContentsDebuggingEnabled，chrome的安全策略限制了这些网址的展示，要突破这一限制，需要用到一款叫Xposed的APP 。Xposed的原理是利用动态劫持，通过替换/system/bin/app_process程序控制zygote进程，使得app_process在启动过程中会加载XposedBridge.jar这个jar包，从而完成对Zygote进程及其创建的Dalvik虚拟机的劫持。","pubDate":"Thu, 24 Mar 2016 09:44:07 GMT","guid":"https://blogs.kainy.cn/2016/03/Android_WebView_前端开发调试/","category":"JavaScript"},{"title":"平安内网标装机远程调试安卓webview的方法","link":"https://blogs.kainy.cn/2016/01/平安内网标装机远程调试安卓webview的方法/","description":"由于安全策略限制，我们的开发机只能连入内网，且需要经过标装。平安内部主要用到两张网，一张是办公开发用的PA_WLAN，另一张是移动设备接入的MA网，开发机与测试机由于不在同一网段，也就只能上演人鬼情未了了（用Mac开发的土豪例外）；另一方面，标装过的机器木有管理员权限，无法通过共享wifi给手机来创建局域网环境，于是另一条路被宣告堵死。以往的方法都不灵，只能另辟蹊径咯~ 最终希望寄托在连通二者的USB线。","pubDate":"Sat, 02 Jan 2016 22:06:46 GMT","guid":"https://blogs.kainy.cn/2016/01/平安内网标装机远程调试安卓webview的方法/","category":"建站❤编程"},{"title":"AC2015随记","link":"https://blogs.kainy.cn/2015/12/AC2015随记/","description":"有幸收到AC2015参会邀请，怀着崇高的敬意和期待，昨天下午来到腾大参加这次活动。AlloyTeam出品过很多有意思的作品，也有许多知名的开源项目，想必作为前端er都会有所耳闻，最初知道这个团队是通过CodeTank ，也为后面“墙来了”H5体感游戏创意与新技术的契合所深深折服。AC2015是合金团队成立以来开办的首届技术大会，往后计划每年一期，会上分享合金团队这一年里产生的作品和技术成果。","pubDate":"Sun, 13 Dec 2015 10:31:57 GMT","guid":"https://blogs.kainy.cn/2015/12/AC2015随记/","category":"互联网络"},{"title":"质疑小米帐号体系安全性的","link":"https://blogs.kainy.cn/2015/10/质疑小米帐号体系安全性的/","description":"前段时间发现自己的小米帐号被盗，因为绑定过手机邮箱，本以为可以很方便地找回；却发现手机也被重新绑定了，邮箱被解绑，很显然是被恶意申诉了。随后提交的两次申诉都被驳回，无奈只好找客服反馈，还特意截了早期密保手机设置成功和异常登录提醒邮件的图。本以为胜券在握，上午接到的电话反馈才大吃一惊。首先客服MM确认了帐号31385972目前的属主不是我的158*＊＊手机；原因是帐号被申诉通过，原有的绑定信息都被解除，而提交的两次申诉失败原因其实是因为客服在核对申诉信息前会联系目前绑定该帐号的手机确认，盗号者自然否认提出申诉了，于是申诉流程终止……","pubDate":"Mon, 05 Oct 2015 07:15:18 GMT","guid":"https://blogs.kainy.cn/2015/10/质疑小米帐号体系安全性的/","category":"互联网络"},{"title":"羊毛党识别","link":"https://blogs.kainy.cn/2015/06/羊毛党识别/","description":"这几天和同事在邮件组里讨论用户识别的方案，把其中碰撞出的火花纪录如下：IP不是一个好办法，单独的canvas也有些问题，我们可以考虑结合，另外，我们再调研一下看有没有更好的方法能解决我们的问题，请大家群策群力。Canvas指纹可以用来验证用户，我看网上有人测试的成功率在90%以上，但是canvas指纹指向的是机器而不是用户本人。所以我认为要想把羊毛党识别出来光靠Canvas指纹是不够的，要想识别用户必须先了解用户。","pubDate":"Sat, 06 Jun 2015 08:26:12 GMT","guid":"https://blogs.kainy.cn/2015/06/羊毛党识别/","category":"建站❤编程"},{"title":"掌握这两招，让你变身K吧人气达人——论KM上的两个CSRF漏洞","link":"https://blogs.kainy.cn/2015/05/掌握这两招，让你变身K吧人气达人——论KM上的两个CSRF漏洞/","description":"从绿盟科技的《2014互联网金融安全报告》中可以看到，XSS和CSRF漏洞依然是影响比较突出的两个安全问题。在这里分享下之前发现的两个内网知识管理系统（KM）的问题，KM系统个人主页的访问记录和关注操作都接受GET请求，只需要构造请求就可以实施一次CSRF攻击。先看看增加关注者的方法。通过网页代码可以看到，在他人的个人主页上点击“添加关注”按钮时调用的是getJSON方法，且未验证请求来源，于是要欺骗系统就变得异常简单，只需要满足两个条件：构造请求到关注接口；cookie中带有用户信息（用户已经登录）。","pubDate":"Sun, 17 May 2015 12:06:03 GMT","guid":"https://blogs.kainy.cn/2015/05/掌握这两招，让你变身K吧人气达人——论KM上的两个CSRF漏洞/","category":"心路历程"},{"title":"茵特拉根温泉一日游","link":"https://blogs.kainy.cn/2015/05/茵特拉根温泉一日游/","description":"跟了个华侨城一日游的团，始发点基本上齐，没有中途上客所以到得比较早，请容许我用一张全景图开场：拿着茶溪谷的门票发现游乐场已是人山人海，游乐项目几乎每个都要排队，那画面太美我不敢拍大家自行脑补。","pubDate":"Sun, 03 May 2015 15:57:17 GMT","guid":"https://blogs.kainy.cn/2015/05/茵特拉根温泉一日游/","category":"生活点滴"},{"title":"微信webview远程调试","link":"https://blogs.kainy.cn/2015/04/微信webview远程调试/","description":"1月10日，微信公众平台对外开放了微信内网页开发工具包(微信JS-SDK)。在广大开发者和微信营销圈内产生了巨大反响。JS-SDK在丰富了HTML5应用能力的同时，也带来了开发复杂度的提升。主要有以下几个方面：微信webview中的缓存、localStorage等特性与原生浏览器的差异盲人摸象隔靴搔痒，无法给臭虫最直接的打击市面上的各种调试工具增加额外的学习成本，不如直接使用已熟手的 开发者工具。在此背景下，开发者们需要一种更加便利的方式来面对挑战，提升效率。","pubDate":"Sat, 04 Apr 2015 21:05:06 GMT","guid":"https://blogs.kainy.cn/2015/04/微信webview远程调试/","category":"建站❤编程"},{"title":"分分钟把你的网站装进微信中","link":"https://blogs.kainy.cn/2014/12/分分钟把你的网站装进微信中/","description":"利用周末两天搭了个服务，通过这个服务能让微信公众号具备检索你网站信息供用户搜索的能力。具体而言，就是订阅者发送任意消息到你的公众号，就可以获得你网站上的相关内容。你要做的仅仅是到公众平台完成简单设置（如果你还没有公众号请到这里注册），而无需对网站做任何改动，这个服务会替你完成网站内容的索引和检索工作（jekyll生成的纯静态网站尤其受用，Github pages用户还不快快搞起～）。设置方法：","pubDate":"Sun, 28 Dec 2014 08:41:01 GMT","guid":"https://blogs.kainy.cn/2014/12/分分钟把你的网站装进微信中/","category":"建站❤编程"},{"title":"全民Git","link":"https://blogs.kainy.cn/2014/11/全民Git/","description":"标题由来是轰动一时的微信游戏“全民打飞机”。对Git的第一印象就是各种命令行（对比 git help -a 和 svn help的命令清单可知），这篇文章的目的就是希望能借助图形化的工具TortoiseGit和Gitlab，不需要太多了解实现的细节和原理就能够完成基本操作，满足日常开发的需要。就像全民飞机大战把游戏引入原先单纯的社交工具微信，为公司探索出新的盈利模式那样。","pubDate":"Sun, 16 Nov 2014 08:27:32 GMT","guid":"https://blogs.kainy.cn/2014/11/全民Git/","category":"系统❤软件"}]}