如何開發一個搶單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<Document> 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