幻象客 - 博客分类页面

    <博客重构>基于Anyproxy使用"中间人攻击"爬取公众号推送


    in JavaScript , 干货 , 技术原理 , 爬虫 , 程序语言 , 计算机安全 2017-11-12

    感谢:https://zhuanlan.zhihu.com/p/24302048

    以前博客一直使用的是别人制作的框架,typecho、WordPress等都有使用过,但由于是别人的框架,始终不知道其内部运作的原理。这次使用Node.js完全重构了一遍,使得我对整个博客的运作原理清晰了许多,以前看起来很复杂的东西(WordPress 留下的第一印象,虽然WordPress其实不全是用来做博客的),现在看起来竟是这么简单,如果有用框架搭建博客的朋友,建议完全自己做一个试试。当然,这些都不是本次推送的重点,半自动化爬取自己的公众号推送才是重点。

    爬取所需要的环境与工具:

    后端:Node.js + MongoDB

    代理服务器:Anyproxy

    一个安卓模拟器

    服务器环境:

    Node.js + MongoDB

    首先介绍一下Anyproxy, 这是一个基于Node.js的代理服务器,本项目中,Anyproxy的作用如下:若把我们本机当做代理服务器,手机模拟器中的微信当成客户端,那么其运作原理可以如下图所示。手机客户端(Client)发送请求给代理服务器(Server,即本机),本机再将这个请求发送给微信服务器,微信服务器返回信息需要经过本机,再由本机传递给手机客户端。

    anyproxy 中间人攻击 爬取 微信公众号 文章

    在这个过程中,本机承担中间人的作用,而接受到微信返回的信息后,我们可以对那个信息植入脚本,再发送给手机客户端。这就是

    阅读更多...

    网站系统搬家记(利用印象笔记)


    in JavaScript , 闲谈 2017-03-24

    以前记录公众号文章的网站(https://huanxiangke.com/articles )是基于typecho的一个微型博客发布平台。最近发现typecho虽然非常简洁高效,但是满足不了我的一些特殊需求,而且维护起来也比较麻烦。于是将博客搬家到了Wordpress.

    其实后台系统搬家还是挺简单的,最主要是文章的搬家比较困难。由于之前那个博客系统,里面的不少图片都已经挂链了,所以还是决定重新导入文章。但是由于微信公众平台的反外链措施,我无法直接复制粘贴这些文章,而原文章的图片也全都丢失了,所以只能另寻他路。

    一张图一张图地保存太麻烦了,效率非常低下。于是我用到了网页版印象笔记的剪藏功能。只需要下载印象笔记的扩展插件,然后保存网页正文,并且标签设为“posts”即可。如图所示:

    印象笔记 应用

    保存到账号后,我们仅需要在WordPress里下载一个叫"EverNote"的插件即可进行同步,非常实用方便。

    印象笔记 应用

    不过值得注意的是,微信公众平台的图片加载还是实用了一种类似lazyload的方式,你需要拉下去才能把所有图片显示出来。否则你同步过去将是空的图片。

    欢迎关注微信公众号:

    幻象客:https://www.huanxiangke.com

    欢迎进入极致分享:https://alltoshare.com

    幻象客 二维码

    阅读更多...

    <练习>利用微信小程序仿造apple music(2)


    in JavaScript , 干货 , 程序语言 2016-12-27

    今天先讲apple music中的“广播”页面的制作过程,如图:

    小程序 仿照apple music

    当然,我们不可能做地特别像,只能说是类似。先把所需要的图片放入/imgs/broadcast/里。

    首先在pages里面建立一个新文件夹:broadcast,然后在app.json中的"pages":[]方括号内加入代码:"pages/broadcast/broadcast",这一步的操作是为了设置页面路径,设置完后应该会自动在broadcast内生成以broadcast为名的.wxml、wxss、js、json文件。

    然后把app.json里面广播的指向页面指向broadcast即可,如图:这样我们就能随时看到调试画面了。

    小程序 仿照apple music

    接下来我们开始写入内容,首先进入broadcast.wxml先定义主视图窗口,然后再以视图窗口形式置入第一个图片。

    <view class="broadcast">
    
        <view class="slogan-img">
    
            <image src="../imgs/broadcast/slogan.png"></image>
    
        </view>
    
    </view>

    然后空行放入文字:

    <view class="white-space">
    
            <text class="white-space-text">精选电台</text>
    
        </view>

    阅读更多...

    <练习>利用微信小程序仿造apple music(1)


    in JavaScript , 干货 , 程序语言 2016-12-26

    本教程仅供交流和学习。今天先制作apple music下面的这个tabbar吧。

    小程序仿造apple music

    首先打开微信web开发工具,添加项目“训练1”

    小程序仿造apple music 小程序仿造apple music

    先创造一个文件夹imgs,把我们的图标放进来,注意这里每个图标都有两种,一种是没点时候暗色的,一种是点了后变亮的。

    小程序仿造apple music

    进入微信小程序的开发页面我们可以很有趣地发现,其实就和设计网页差不多。文件类型分别有js,json,wxml,wxss。其实wxml就是html,wxss就是css,除了一些特定的语法必须符合微信开发者工具之外,其他的基本上和网站开发类似。

    小程序仿造apple music

    我们今天要做的内容放在app.json里面,属于“配置”方面的内容。官方给定的tabbar的代码如下:

    小程序仿造apple music

    我们看到apple music里面有五个图标,分别是音乐资料库、为你推荐、浏览、广播、搜索。我们在list里面将这五个图标列入。由于我们还没设计这些按钮的转向页面,所以pagePath就暂时全部设置为pages/index/index吧。如下:

    小程序仿造apple music

    然而我们还需要设置iconPath和selectedIconPath。前者是正常状态下的图标,后者是被选中的图标。我们看到pages和app.json实际上是在同一级的,所以我们路径可直接设置为"pages/imgs/....",如图:

    小程序仿造apple music

    这样我们就把tabbar制作完成了。如图:

    小程序仿造apple music

    但是下面这条黑线很丑,我想把它去掉。"borderStyl...

    阅读更多...