如何开发一个抢单chrome插件

出于学写chrome插件&满足买买买心态的目的,试了下从零开始写一个chrome抢单插件。实验的网站是nike和adidas的美国官网。

大致历程

  1. 买本chrome插件教程通读一下。 在阳台上晒晒太阳喝着下午茶,看起来还巨简单,很开心的2小时。
  2. 跟着教程学写最简单的chrome插件。so easy,一晚上很愉快的度过,一点点成就感。
  3. 了解nike和adidas网站购买下单流程,分析用户需求&网络请求。需要点耐心,国内网站会更快一点。
  4. 设计插件功能和样式。画画页面设计图(就是几个表单),流程图(状态指来指去,一种天下我有的爽感)。
  5. 写插件。一言难尽吧~~~

插件设计

需求

  • 用户生成待抢订单,填写商品url、规格、数量、地址、支付信息等。
  • 自动刷商品、下单。(可同时刷多单,查看订单列表、状态、详情)

功能概述

  • 根据用户给的网站账号自动登录。
  • 根据商品链接抓取商品信息、规格等。
  • 生成待抢订单。
  • 自动刷商品页,加购物车。
  • 自动填写地址、支付信息,下单。

页面设计

  • 配置页(nike和adidas用户账户、address、payment信息,其他可配置项)
  • 商品详情页
  • 订单详情页
  • 订单列表页

订单状态图

自己在稿纸上画了一个图,大致包括prepare、start、cart、ordering、succ、fail等几个状态。
  • adidas为例,实际状态比预想的多,用一个Pipeline控制流程:
    private static final int CODE_FAIL = 0;
    private static final int CODE_PREPARE_ORDER = 1;
    private static final int CODE_ADD_TO_CART = 2;
    private static final int CODE_CHECKOUT = 3;
    private static final int CODE_ADD_ADDRESS = 4;
    private static final int CODE_CHOOSE_SHIPPING = 5;
    private static final int CODE_ADD_PAYMENT = 6;
    private static final int CODE_ADD_PAYMENT_1 = 12;
    private static final int CODE_REVIEW_ORDER_1 = 11;
    private static final int CODE_REVIEW_ORDER = 7;
    private static final int CODE_THANK_YOU_PAGE = 8;
    private static final int CODE_SIGN_IN = 9;
    private static final int CODE_UNKNOWN = 10;

数据表设计

  • 订单表 Order
    • OrderStatus(enum 订单状态)
  • 商品表 Goods
  • 用户信息表
    • User, 插件用户
    • Account, 购物网站账户
    • Address,购物网站收货地址
  • 购物网站表 Site

插件开发

包括2部分,摘取一些代码片段以供参考。

  • 插件本身: 页面、数据表
  • 模拟下单:登录、规格库存获取、加购物车、下单,模拟用户手动下单时发送的网络请求

抓取商品页 (以Adidas为例)

private ExecResult getOneSkuInfoPage(String url) {
        try {
            doc = AdidasUtils.getHttpGetResponseWithDocument(url, "", httpsClient);
            return createResult(true, doc, null);
        } catch (IOException e) {
            LogUtils.info(AdidasConstants.ERROR_PREFIX + e.toString());
        }
        return createResult(false, doc, "Get goods page fail.");
    }

public static Document getHttpGetResponseWithDocument(String url, String referrer,
                                                          DecompressingHttpClient httpClient) throws IOException {
        AdidasUtils.printHtmlUrl(url);
        response = getHttpGetResponse(url, referrer, httpClient);
        Document doc = Jsoup.parse(EntityUtils.toString(response.getEntity(), "UTF-8"));
        EntityUtils.consume(response.getEntity());
        AdidasUtils.printHtmlTitle(doc);
        return doc;
    }

在商品详情页抓取商品信息

  • 标题、描述(这些内容不会变,很好抓,只要取到响应的DOM节点就好)
  • sku属性:颜色、尺码、价格、库存(和每个型号的skuId对应,加购物车时用skuId)
  • 见 http://blog.csdn.net/maowenbei/article/details/72809019

登录

模拟登录的过程有点难,会遇到各种问题,比如token之类的。见 http://blog.csdn.net/maowenbei/article/details/72809063

你可能感兴趣的:(浏览器前端)