HelloGitHub 小程序上線了,蛋只有一個搜索功能

  • 2021 年 5 月 13 日
  • 筆記

作者:HelloGitHub-滷蛋

我是🥚🥚…蛋蛋啊,本文是我從零開發「HelloGitHub 小程序」的開發日記,不要把這個系列當作技術文章來讀,你將會收穫更多的樂趣。🙆‍♂️

🥺 我只是個 Python 程序員,不會寫前端(會的那點前端技術停留在 5 年前),就更甭提微信小程序了。選擇開發微信小程序是我認為它:方便、平台大、有搞頭。這是我的第一個小程序,如果你想從本文學到什麼小程序的開發經驗,那將是在浪費時間還不如轉身買個實戰課來的直接。「HelloGitHub 小程序」的開發日記——分享我在開發 HG 小程序過程中的思路、問題和解決問題的方案等,文中不會涉及代碼以輕鬆易懂為主。因為我想讓 HelloGitHub 的讀者都能參與到小程序的建設中,見證它的成長。即使你不懂編程,我也希望能夠通過本文讓你知道我在幹什麼,然後你就可以給 HelloGitHub 小程序提需求,增加你想要的功能。讓我們共建 HelloGitHub 小程序 😘

背景介紹完啦,下面進入正文。

我要寫小程序!

HelloGitHub 微信小程序的原計劃:在 3 月份開發,然後 3 月底先上線一版。之所以稱為「計劃」那是因為它充滿了不確定性。

後來因為 3 月 28 是 HelloGitHub 的五周年,結果臨時決定辦一場直播。我就和團隊的小夥伴一起去弄直播的事情了:學習直播、設計活動、拉贊助、排練、邀請嘉賓。整個 3 月份就搭進去了,三月過完小程序一行代碼還沒有寫。我真的很頭大!我要寫小程序啊!!!💢

(下面這段文字是我 3 月底寫的,結果小程序 5 月初才上線!事實證明我對自己開發效率過於樂觀了。)

現在五周年直播,算是圓滿的結束了。後面的事情我捋了捋,沒有什麼事情能夠阻止我開發 HelloGitHub 小程序啦,那麼我就不客氣了:開工嘍!趕在 5 月前上線!🎉

一、做個啥

我原本計劃把 HelloGitHub 小程序做成一個社區(已畫好原型圖),但這是一個浩大的工程且開發周期太長了,而且閉門造車風險太大。我陷入了深深的沉思😔…

然後我去翻看、調研了其它的小程序,發現小程序大多以工具的形式呈現。所以我打算小步快跑,從單一工具入手。比如:做一個瀏覽月刊的信息流工具或者開源項目信息聚合瀏覽的工具。但當我看到 HelloGitHub 公眾號 的後台,經常有讀者發一些諸如:可視化、爬蟲、AI 變臉的消息給我。這些消息像是搜索項目的關鍵字,他們應該是想要通過關鍵字搜索項目。後台這樣消息太多了,我沒有辦法查找後挨個回復。HelloGitHub 月刊每月 28 號發刊,已經累計推薦了 1641 個項目,如果想手動從中找一個開源項目實在是太難了,所以我要趕緊給 HelloGitHub 的粉絲做一個能夠通過關鍵字搜索往期月刊中的開源項目的工具,趁你們還沒放棄我👋 。

我認為產品就是為了解決某種問題而被創造出來,首先需要先解決用戶的痛點。如果製作的產品能像一個方便、實用的「輪子」,那用戶就能推着它往前走(督促產品迭代)。當然我要和用戶保持「臉貼臉」的距離,及時得到他們的反饋與建議。最後,開發人員應該都喜歡自己開發的程序有人用,那樣才會有維護的動力吧💪!

綜上所述:

  • 我打算做一個:支持關鍵字搜索 HelloGitHub 往期月刊中項目的微信小程序,再加個反饋功能。
  • 開發周期:1 個月

二、設計和開發

需求聽起來很簡單呀:搜索、往期內容,但我沒搞過搜索僅僅簡單地玩過 ES,還是用來做存儲並不是做搜索。

前後端分離先搞起來,搜索服務具體怎麼玩,再邊走邊看。(我現在看這段話,邊走邊看=自己挖坑😖)

2.1 後端

  • 接口:fastapi(Python Web 框架)
  • 數據庫:MySQL
  • 搜索引擎:sonic(Rust 寫的輕量級搜索引擎)

2.1.1 服務

我想用 fastapi 很久了,但工作中一直沒有機會用它寫服務,現在機會終於來了用起來!一個很新、很火、很好用的 Python Web 框架,看名字就知道它是為了快速開發接口而被創造出來(fast api)。

項目地址://github.com/tiangolo/fastapi

雖然要開發的接口很簡單:

  • 搜索並返回結果
  • 接收用戶對搜索結果的反饋(後面採用了小程序提供的功能)

但需要搭項目的架子:目錄結構、日誌、配置等等

2.1.2 數據層

HelloGitHub 目前所有月刊的數據都存在 MySQL,為了方便處理已有的數據為搜索提供數據支持,先要做一個數據層搞定 MySQL 的增刪改查,這樣後面服務、處理數據、分詞、數據導入、同步等操作都能夠得心應手。我最終選用了 SQLAlchemy 這個 Python ORM 庫,去吧 SQLAlchemy!

項目地址://github.com/sqlalchemy/sqlalchemy

2.1.3 搜索

搜索服務選用的是基於 Rust 的輕量級開源搜索引擎 sonic,像用 Redis 一樣用上搜索。

項目地址://github.com/valeriansaliou/sonic

它安裝方便、配置簡單。但第三方的 Python 客戶端庫是真的難用,而且 Bug 賊多。為了趕進度,我僅解決了一些必要的問題從而能夠正常的增刪改查,就先湊合用了。

2.2 前端

我沒寫過小程序所以不打算剛上來就用框架寫,否則我連基本寫法都不會,可能看不懂小程序框架的文檔。而且要實現的功能很簡單:

  • 首先,一個輸入框接收輸入內容
  • 然後,調用搜索服務的接口
  • 最後,展示返回的結果
  • 附加:接收用戶的反饋

由於功能簡單我看了看文檔就寫出來了,但樣式太丑了我就在官方文檔中尋找解決方案。找到了小程序的官方樣式庫:

項目地址://github.com/Tencent/weui-wxss

拿來就能用的樣式文件和示例代碼,分分鐘讓小程序煥然一新。

至此,這裡要感謝感謝開源、感謝 GitHub 和微信小程序團隊。技術選型和方向敲定了開發也看似順利,但事情遠沒有想像中的一帆風順👻。

三、困難

真是一步一個「困難」,真「好玩」🤪

3.1 問題

下載項目的 README 文件,豐富搜索的關鍵字的匹配程度。內容需要解析並存儲。問題:

  1. 有的文件的內容很多不易存儲到數據庫,數據庫的字段有大小限制。
  2. 如何保證文件的更新
  3. 下載 README 文件有的時候找不到:項目的默認分支不一樣、文件名不一致等

搜索部分,隨着所有項目的 README 內容寫入搜索引擎,搜索的準確率真的是慘不忍睹。原因:

  1. 分詞時的自動識別語言不準確
  2. 無法即時查看查詢效果
  3. 內容干擾項太多:代碼塊、鏈接等

問題一:因為 push 支持可選 lang(語言)指定內容分詞時的語言,默認是英語。我試了下但是不支持 「zho」(中文)參數,我就很奇怪,因為項目中說了支持中文的丫。我就去看了看源碼,發現 src/lexer/stopwords.rs 分詞需要一個叫做 stopword 的東東,然後我找到 sonic/src/stopwords/ 目錄,發現裏面沒有 zho.rs 所以不支持 lang 指定為中文。所以只能用 lexer 的默認分詞方式。

問題二:沒有命令行客戶端無法即時得到反饋。

問題三:我想讓內容豐富度更高,但隨之而來的是不準確。所以需要整理內容刪除干擾項,比如:超鏈接、代碼塊。

服務部署因為爬蟲的服務器是在 HK,而接口服務需要部署到國內。所以為了接口的響應速度,就把 sonic 部署在國內了。這個比較簡單因為支持 docker 直接起服務,則需要:

  • sonic 的 store 目錄掛載到本地,防止重啟 docker 數據清空
  • HK 服務器可以國內的搜索服務(後面不需要爬蟲動態更新搜索中的內容,這個白乾了)

另外還需要:安裝 Nginx + 新的二級域名 + HTTPS

剛上手小程序和剛上手某一類語言一樣會遇到很多瑣碎的問題:編輯器設置問題(本地代理導致請求接口超時)、語法報錯(獲取不到想要的對象,設置值不生效)、不熟悉內置方法導致「原地轉圈」(小程序提供了反饋功能、分享需要手動開啟等問題)、小程序上線須謹慎因為審核速度完全看臉,當然最大的問題還是編寫樣式的問題。這個後面慢慢慢…來吧!我買了一本巨厚的前端書籍《Web 前端工程師修鍊之道》,容我啃完 CSS 部分再來戰!🤫 (CSS 放學別走,門口等我)

3.2 解決方案

  • README 的內容最終我存儲成了文件,當作靜態文件。(優化後沒用到)
  • 在數據庫中保存文件的 sha 碼,用來檢查文件是否改動從而判斷是否需要重新寫入文件。
  • 我後來發現不指定分支名訪問的文件就是默認分支的文件,搞定!另外文件名的話,目前採用的是枚舉有限文件名比如:README.md、readme.md…但效率低下且效果不好
  • 解決搜索方面的問題:
    • 把搜索引擎存儲的內容降低到月刊的內容,丟棄了 README 的原始內容
    • 編寫清理內容干擾項的算法
    • 基於 python-sonic-client 寫了一個 cli.py 用於命令行初始化數據和查詢
    • 分詞的問題:可以給原項目貢獻 PR,或者就調研其它搜索,最後可以自己寫個搜索引擎(閉嘴!我飄了!)

大致解決了上面的問題,功能就完成能用了。但是搜索準確率是個大問題直接影響用戶體驗,講真的我要不要用 Python 寫一個搜索引擎,最後可能變成瘋狂吐槽自己🤔

四、效果展示

因為微信小程序不可以直接跳轉到外部鏈接,所以只能採用點擊搜索結果中的開源項目自動複製項目地址的這種方式。掃一掃在線體驗:

五、結束

😇 支持關鍵字搜索 HelloGitHub 往期月刊中項目的微信小程序終於…上線了!

它雖然功能單一但應該能夠解決部分用戶的痛點,搜索不準確的問題後面我一定會持續調研優化。如果你有關於搜索的方案歡迎留言討論,也可以和我分享搜索相關的資料與知識;如果使用中遇到問題可以點擊「反饋」告訴我。

💃 覺得好用的話就把它拖到「我的小程序」,然後分享給身邊的小夥伴吧 🕺

最後,你有沒有遇到過:

找到一個 GitHub 上有趣的開源項目,拿到了項目地址但由於網絡問題無論如何就是訪問不了。

此情此景是不是腦袋嗡嗡作響,血壓直線飆升!我將試圖在 6 月中旬發佈的版本中解決這個問題,敬請期待 🕶


關注 HelloGitHub 公眾號 第一時間收到更新。

還有更多開源項目的介紹和寶藏項目等待你的發現。