首頁>科技>

故事的起源

基於對 AI 的愛好與興趣,我走上了獨自鑽研機器學習的道路。和所有熱愛 AI 的人們一樣,在一段孤獨的摸索旅程中,我勉強完成了幾次深度學習模型的訓練。

其中令我印象較深的成果就是情感分類模型。他能夠根據你的文字生成其背後作者的喜怒哀樂。

深度學習模型展示出來的 "人性化"讓我感到驚喜,於是我開始思考怎麼將它的“人性化”轉化為幫助人們的工具。

在情感模型的基礎上建立一個上層應用,讓它為人類社會中增添不一樣的煙火。

故事拉開序幕

在進行小程式開發之前,我們非常有必要先對小程式做一個充分的了解。

什麼是小程式

簡單來說,比起傳統的 App,微信小程式是一種全新的連線使用者與服務的方式,它具有非常出色的使用體驗,並且它可以在微信內被便捷地獲取與傳播。

小程式發展史

實際上,小程式並非憑空而來的。當微信逐漸流行、變成幾乎人人都離不開的社交工具時,承載微信的 WebView 也逐漸成為了量級最大的移動 Web 入口。每天訪問 WebView 的數量甚至超過了訪問所有瀏覽器的總和。雖然無法通過第三方獲取到微信 WebView 的日活資料,但這個客觀事實間接促進了小程式的誕生。

其實在小程式正式步入人們視線之前,微信早已有了類似的 js 呼叫介面,這裡給大家展示一個呼叫了微信 js-bridge 原生元件去瀏覽圖片的例子:

WeixinJSBridge.invoke('imagePreview', {current: 'http://inews.com',urls: [ // 所有圖片的URL列表,陣列格式    'https://img/1.jpg',    'https://img/2.jpg',    'https://img/3.jpg']}, function(res) {    console.log(res.err_msg)})

此類 js 介面其實最開始是專門給騰訊內部人員去進行呼叫的,但卻意外被許多個人開發者發現很多並進行了使用,這也慢慢成為了微信中網頁的標準。

在 15 年開始的時候,微信官方釋出了一套專門用於進行網頁開發的工具包,名為 js-sdk,在這個工具包內開放了如微信支付、錄音、語音識別、等數十個介面。這給所有的 Web 開發者都打開了一扇從未開啟過的全新的大門,讓所有的開發者都可以自由地使用微信開發的原生能力,這使得他們可以去完成一些之前無法完成或是難以做到的事情。

js-sdk 完美繼承了 WeixinJSBridge 的特性,並且由只對內部開放轉為了對外部開放。並且它通過其暴露的微信呼叫介面使得所有 Web 開發者有了更多操作微信功能的能力。但是,這個模式並沒有很好地解決移動網頁的體驗問題:

使用者訪問頁面時,在頁面顯示前會有一段比較明顯能夠被感知的白屏過程。受限於網速與不同終端的效能,這個問題會越來越明顯。

於是乎,js-sdk 的增強版本就誕生了,其中有一個非常重要的新特性,被稱之為:微信 Web 資源離線儲存。

​以下文字引用自內部的文件(沒有最終對外開放):

通過使用微信離線儲存,Web 開發者可藉助微信提供的資源儲存能力,直接從微信本地載入 Web 資源而不需要再從服務端拉取,從而減少網頁載入時間,為微信使用者提供更優質的網頁瀏覽體驗。每個公眾號下所有 Web App 累計最多可快取 5M 的資源。

相信大家都已經看明白了,這其實就是 HTML5 中 Application Cache 的加強版。

然而,在經過了多次測試後發現,還有問題沒有被完全的解決:

頁面切換較為生硬;點選有明顯延滯的感覺。

最終微信意識到 js-sdk 無法處理這些問題,這需要一個全新的系統去完成,而這個系統必須具備以下幾個能力:

載入速度快原生的體驗易用且安全的微信資料開放兼顧開發效率與開發難度

而這就是小程式的由來。

故事開始了前言

首先請大家見諒,這一篇文章並不會教你如何零基礎開發小程式。如果你是一個軟體開發新手。那麼我建議你先了解一些基礎的 js 語法 以及相應的 前端知識 。

掌握前端基礎後,相信在 小程式前端元件官方文件 的幫助下,任何人都可以快速上手開發小程式。

下面我主要跟大家分享兩個最核心、最省錢 的兩個小程式開發技巧:

搭建小程式雲開發環境;如何使用雲開發呼叫 AI 模型介面。小程式雲開發

在剛開始考慮開發小程式時,和你們一樣,我有著許多的顧慮:

需要購買域名、伺服器嗎?維護成本大嗎?

帶著這些顧慮,我小心翼翼地翻開了 微信官方文件。在大腦經過分散式閱讀過後,我發現了 雲開發 這個關鍵詞。

雲開發為開發者提供完整的原生雲端支援和微信服務支援,弱化後端和運維概念,無需搭建伺服器,使用平臺提供的 API 進行核心業務開發,即可實現快速上線和迭代,同時這一能力,同開發者已經使用的雲服務相互相容,並不互斥。

雲開發提供了幾大基礎能力支援:

能力 作用 說明 雲函式 無需自建伺服器 在雲端執行的程式碼,微信私有協議天然鑑權,開發者只需編寫自身業務邏輯程式碼 資料庫 無需自建資料庫 一個既可在小程式前端操作,也能在雲函式中讀寫的 JSON 資料庫 儲存 無需自建儲存和 CDN 在小程式前端直接上傳/下載雲端檔案,在雲開發控制檯視覺化管理 雲呼叫 原生微信服務整合 基於雲函式免鑑權使用小程式開放介面的能力,包括服務端呼叫、獲取開放資料等能力

簡單來說,有了雲開發, 我不需要購買伺服器就可以開發一款全棧小程式。

嘿嘿,沒錯,這就是我想要的。

如何搭建小程式雲開發環境

那麼如何搭建雲開發環境呢,綜合官方文件,我總結了一套極簡搭建教程,大家可以作為參考。

雲開發環境極簡搭建四部曲:

接著需要下載 小程式開發工具;然後使用管理員 / 開發者賬號登入開發工具並填入小程式的 APPID 以及勾選 雲開發 選項後點擊新建;點選頁面中的雲開發,跟著提示選擇 免費版雲開發配額 。

至此一個雲環境就算是搭建完畢了。

什麼是雲函式?

雲開發環境搭建完畢後,是時候看看什麼是 雲函式 了。

官方的定義如下:

雲函式是一段執行在雲端的程式碼,無需管理伺服器,在開發工具內編寫、一鍵上傳部署即可執行後端程式碼。

簡單來說,雲函式就是執行在雲端的函式。

雲函式有什麼用?

雲函式大有用處。

有了它,就相當於是有了一個 "大後端",所有業務邏輯以及對資料庫的操作我們都可以封裝在雲函式中呼叫,十分方便。

第一個雲函式

說了這麼多大道理,是時候來實戰一下了。

// 雲函式入口檔案const cloud = require('wx-server-sdk')cloud.init()// 雲函式入口函式exports.main = async (event, context) => {    const wxContext = cloud.getWXContext()    return {        event,        openid: wxContext.OPENID,        appid: wxContext.APPID,        unionid: wxContext.UNIONID,    }}

這時候需要開啟命令列並進入到該目錄下執行 npm install 安裝 wx-server-sdk ( 若目錄下沒有 node_modules 則需要先執行 npm init ):

可以看到函式執行成功並拿到了返回值(openid 等資訊……)

至此,恭喜我們快速完成了第一個雲函式。

如何在小程式中快速呼叫 AI 模型來自清晨的靈光一閃

相信大家都非常好奇,我是怎麼做到在雲函式中 "零成本" 呼叫 AI 能力的。

其實我開始也非常苦惱這個問題,即使小程式有云函式的功能,但也沒辦法輕易 "零成本" 呼叫 AI 模型,原因如下:

小程式雲函式目前僅支援 node.js,而我的模型呼叫介面程式碼為 python;不管再怎麼 "雲",想要執行自己的 AI 模型必須得有一臺 16G 記憶體以上的機器(成本巨大);即使有了自己的伺服器也需要域名備案,實在是太麻煩了;

但就在一個明媚的清晨,我翻身起床後突然靈光一閃:

可不可以呼叫騰訊自己的 AI 開放介面間接達到這個目的呢?

想法再多不如動手行動,於是我訪問了 騰訊雲控制檯的自然語言處理模組 。

根據指引進行服務開通後,我進入到 API 金鑰管理 並記錄下了 API 金鑰:

那麼如何在小程式中呼叫它呢?我再一次陷入了深深的沉思……

雲函式呼叫 AI 模型

在經過漫長的探索後我回到了 test 雲函式目錄下的命令列,安裝了騰訊雲服務呼叫包:

然後修改 test 雲函式 (index.js):

// 雲函式入口檔案const cloud = require('wx-server-sdk')const tencentcloud = require("tencentcloud-sdk-nodejs");cloud.init()// 雲函式入口函式exports.main = async (event, context) => {    const  NlpClient = tencentcloud.nlp.v20190408.Client;    const models = tencentcloud.nlp.v20190408.Models;    const  Credential = tencentcloud.common.Credential;    const  ClientProfile = tencentcloud.common.ClientProfile;    const  HttpProfile = tencentcloud.common.HttpProfile;    let cred = new  Credential(event.secretId, event.secretKey);    let httpProfile = new  HttpProfile();    httpProfile.endpoint = "nlp.tencentcloudapi.com";    let clientProfile = new  ClientProfile();    clientProfile.httpProfile = httpProfile;    let client = new  NlpClient(cred, "ap-guangzhou", clientProfile);    let req = new models.SentimentAnalysisRequest();    let text = event.text    let params = '{"Text":\\"' + text + '\\"}'    console.log('待預測字串: ' + text)    req.from_json_string(params);    client.SentimentAnalysis(req, function (errMsg, response) {        if (errMsg) {        console.log(errMsg)        }        console.log('AI 預測情緒正值: ' + response.Positive)        console.log('AI 預測情緒負值: ' + response.Negative)    })}

在這段程式碼中,我通過騰訊雲賬號中的金鑰連通了 AI 情感預測介面,最後將情感預測的結果列印了出來。

接下來我開啟了本地雲函式呼叫視窗並傳入相應引數:

secretId (騰訊雲 API 服務金鑰 Id )secretKey (騰訊雲 API 服務金鑰 Key)text (待預測的字串)

然後點選呼叫後終於看到了 AI 模型的預測結果:

最後我成功地使用雲函式呼叫了免費的 AI 開放介面。

這時我已經熱淚盈眶,除了感動還有一絲小滿意,原來雲開發還能這麼玩。

故事的結尾

文章到這裡,相信最重要的兩個部分大家已經了解並掌握了:

搭建雲開發環境快速呼叫 AI 模型

回頭望去,整個小程式開發過程大概歷經三天兩夜,整段經歷大概與 "程式設計馬拉松" 類似。

程式設計馬拉松,又稱黑客日、黑客節或程式設計節,是一個流傳於黑客當中的新詞彙。程式設計馬拉松是一種活動。

在該活動當中,計算機程式設計師以及其他與軟體發展相關的人員,如圖形設計師、介面設計師與專案經理,相聚在一起,以緊密合作的形式去進行某項軟體專案。

程式設計馬拉松的靈魂是合作地編寫程式和應用。程式設計馬拉松的時長一般在幾天到一週不等 。

--維基百科

於是乎,在經過 "瘋狂" 開發後,一個日記小程式的雛形就誕生了。

雖然說前端頁面並沒有多複雜,但是確實傾注了許多開發心血。

開發完成的那一刻我已經不在乎是否有人真正去使用他。因為我已經從他身上收穫到了全身心投入開發的快樂。

最後預祝所有用心實踐的讀者都能開發出有特色的 AI 小程式~

最新評論
  • 整治雙十一購物亂象,國家再次出手!該跟這些套路說再見了
  • iPhone自帶的8個App,沒想到這麼好用!