基于微信小程序的多語(yǔ)種跨文化UGC互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái)的設(shè)計(jì)與開發(fā)

朱帥　朱軼蓉　鄭新超

摘要：在“一帶一路”的合作倡議下，政府層面加強(qiáng)了溝通合作，各同民眾間旅游、教育和文化交流日益深入。在此背景下，基于我們之前對(duì)大學(xué)生進(jìn)行的調(diào)查，該文通過對(duì)微信小程序開發(fā)和Spring Boot框架的分析，提卅了基于微信小程序的多語(yǔ)種跨平臺(tái)文化UGC互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái)

關(guān)鍵詞：微信小程序;互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái);SpringBoot框架

文章編號(hào)：1009-3044（2020）20-0068-02

1引言

在“一帶一路”的大環(huán)境下，政府之間互通有無，各國(guó)民眾間旅游、教育和文化交流日益深入。但是，“一帶一路”國(guó)家多為非英語(yǔ)母語(yǔ)國(guó)家，其語(yǔ)言多為“小語(yǔ)種”，交流不便，且由于沿線國(guó)家較多，使得交流分散，缺少統(tǒng)一的互動(dòng)交流平臺(tái)。基于此，本項(xiàng)目將面向各國(guó)高校學(xué)生及普通民眾，創(chuàng)立多語(yǔ)種跨文化UGC互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái)——一帶一路文化通小程序，依據(jù)語(yǔ)言、國(guó)家、興趣愛好設(shè)定不同內(nèi)容板塊，用戶可以在平臺(tái)上發(fā)布自己的原創(chuàng)內(nèi)容（UGC）和或者轉(zhuǎn)載一些其他內(nèi)容，平臺(tái)通過一定的技術(shù)手段進(jìn)行翻譯后，提交社區(qū)論壇，用戶可根據(jù)翻譯從語(yǔ)言、文化等多層面互動(dòng)交流評(píng)價(jià)，以內(nèi)容作為載體，以興趣為切入點(diǎn)，實(shí)現(xiàn)基于共同興趣的良性深入互動(dòng)。

2微信小程序開發(fā)介紹

2.1小程序開發(fā)

用官方給與小程序的定義來說：“小程序是一種不用像App-樣需要下載安裝就可以使用的應(yīng)用，它依托于微信，仿佛是將你的應(yīng)用安裝在了微信上，隨時(shí)都可以點(diǎn)開使用，用戶大可不必?fù)?dān)心手機(jī)會(huì)安裝太多應(yīng)用占用手機(jī)空間，使用完畢后，就可以退出即走。”[1]微信小程序白上線以來，受到了人們?cè)絹碓蕉嗟年P(guān)注，也受到了開發(fā)者的青睞，微信的官方團(tuán)隊(duì)也在對(duì)小程序開發(fā)的生態(tài)進(jìn)行不斷的完善以及版本更新。因?yàn)槠洳挥冒惭bApp，不會(huì)占用手機(jī)內(nèi)存，使用完即可退出的特性，極大的給與了用戶使用上的舒適感。從開發(fā)者的角度看，開發(fā)和維護(hù)小程序的成本都偏低，并且擁有微信這個(gè)強(qiáng)有力的流量支撐以及相比于App更低的推廣難度。

2.2小程序接入步驟

1）注冊(cè)小程序：登陸微信公眾平臺(tái)官網(wǎng)（mp.weixin.qq.com）按照要求填寫小程序的注冊(cè)信息。

2）填寫小程序信息：在小程序的信息填寫欄目中，填寫小程序的名稱，簡(jiǎn)稱，上傳頭像和描述等信息，填寫完成后，用戶可以獲得一個(gè)APPID，用于綁定開發(fā)者的身份，在開發(fā)者工具中也可以通過APPID進(jìn)行真機(jī)預(yù)覽及真機(jī)測(cè)試。

3）開發(fā)小程序：根據(jù)微信開發(fā)文檔的規(guī)范內(nèi)容，利用微信開發(fā)者工具來開發(fā)和調(diào)試小程序等。

4）代碼提交審核及發(fā)布：小程序的代碼提交可以通過在開發(fā)者工具中點(diǎn)擊上傳代碼，然后登陸微信公眾平臺(tái)，將項(xiàng)目提交審核，審核通過后即可進(jìn)行發(fā)布。

2.3小程序開發(fā)模式

因?yàn)樾〕绦蚴且栏接谖⑿牛⒉皇窍褚酝腍TML5在瀏覽器上運(yùn)行的那樣，所以在開發(fā)過程中，Java Script的一些特有的性質(zhì)在小程序的開發(fā)上均是不可以使用的。過去，HTML5的加載過程是需要有一定的用戶等待時(shí)長(zhǎng)的，因?yàn)樗窍冗M(jìn)行HTML、CSS和JS文件的加載，加載完畢之后，才將返回的數(shù)據(jù)渲染到瀏覽器的頁(yè)面上。而小程序則采用了兩種線程并行加載的方式來加載所打開的頁(yè)面，當(dāng)視圖線程加載完之后，Ap-pService線程就會(huì)把已經(jīng)準(zhǔn)備好的數(shù)據(jù)通過JS中的setData方法返回給視圖線程。同時(shí)，微信開發(fā)者工具的開發(fā)模式與傳統(tǒng)的H5開發(fā)模式也是不同的，傳統(tǒng)方式是采用開發(fā)工具+瀏覽器運(yùn)行調(diào)試的模式.而微信小程序則與之不同，它將這種傳統(tǒng)的開發(fā)模式集成在微信開發(fā)者工具這個(gè)軟件上，通過這個(gè)軟件，開發(fā)者可以實(shí)現(xiàn)軟件的開發(fā)調(diào)試、編譯預(yù)覽和代碼上傳等一系列的流程操作，一定程度上使開發(fā)者的開發(fā)工作可以更加便捷。

3小程序的架構(gòu)設(shè)計(jì)

3.1小程序的架構(gòu)設(shè)計(jì)

一帶一路文化通采用現(xiàn)在開發(fā)中常用的MVC架構(gòu)模式，分為視圖層View用于用戶人機(jī)交互，控制層Controller處理請(qǐng)求，Model層用于封裝所用的數(shù)據(jù)。整個(gè)軟件分為了小程序端（面對(duì)用戶）和Vue網(wǎng)頁(yè)端（面向后臺(tái)管理）。小程序端基于微信自己的Wxml、Wxss、JS和Json四個(gè)文件來協(xié)同開發(fā)出所需的頁(yè)面，通過在詩(shī)文件中調(diào)用微信白帶的API：wx.request發(fā)起ajax異步請(qǐng)求，后端基于springMVC（ springboot已簡(jiǎn)化其配置）的controller來對(duì)應(yīng)處理前端的POST、CET、PUT和DELETE請(qǐng)求，controller通過調(diào)用在service中的方法，來對(duì)MySQL數(shù)據(jù)庫(kù)進(jìn)行增刪改等事務(wù)處理。摒棄了傳統(tǒng)JDBC請(qǐng)求數(shù)據(jù)庫(kù)的方式，這里使用了當(dāng)下流行的持久化框架——Mybatis，它也是當(dāng)下流行的持久層框架。

4小程序的開發(fā)方案

4.1小程序開發(fā)方案

基于上述分析，本文擬采用“ElementUI+ Vue-Cli”組合來進(jìn)行前端開發(fā)，采用“Tomcat+N ginx+SpringB㈤t+Mybatis-plus+MySQL”來進(jìn)行后端及數(shù)據(jù)庫(kù)開發(fā)。對(duì)于Java開發(fā)，常用Tom-cat作為項(xiàng)目的Web服務(wù)器，它是一個(gè)免費(fèi)并且開放源代碼的輕量級(jí)web服務(wù)器。

4.2 SpringBoot框架

SpringBoot框架是基于Java語(yǔ)言的一個(gè)開源框架，它具有輕量和高效的特點(diǎn)，它的出現(xiàn)，給搭建和開發(fā)Spring項(xiàng)目的工作帶來了極大的簡(jiǎn)化，是眾多開發(fā)者的一個(gè)福音。同時(shí)，它仍然保留一些Spring中所擁有的一些優(yōu)秀的特性。另外Spring-Boot通過在其內(nèi)部集成眾多的依賴框架用以解決依賴包之間的版本沖突，此舉對(duì)于項(xiàng)目版本的穩(wěn)定性有了極大的提高[3]。

開箱即用和約定優(yōu)于配置策略。開箱即用，是指在項(xiàng)目中，通過對(duì)依賴配置文件添加項(xiàng)目所使用的依賴包項(xiàng)，然后在項(xiàng)目中通過注解實(shí)現(xiàn)管理對(duì)象的生命周期，代替以往用XML文件來配置管理的方式。約定優(yōu)于配置，目的在于減少開發(fā)者進(jìn)行配置決策的數(shù)量，核心在于約定編程，從而減少了開發(fā)者對(duì)配置文件的使用，從而使配置的任務(wù)變得簡(jiǎn)單。

在使用框架編寫項(xiàng)目代碼前，首先要快速搭建SpringBoot項(xiàng)目環(huán)境。進(jìn)入Spring網(wǎng)站（https：//spring.io/），找到quickStart，進(jìn)入創(chuàng)建模板頁(yè)面，依次選擇Gradle ProjeCt、Java，版本2.2.5，然后依次填入項(xiàng)目的信息，最后添加一個(gè)項(xiàng)目依賴包web.jar，完成生成一個(gè)starter模板文件。

4.3 Vue-Cli腳手架

Vue-Cli是基于Vue框架的一個(gè)腳手架，它借助webpaCk可以幫助開發(fā)者很快地搭建一個(gè)Vue項(xiàng)目。開發(fā)者通過它可以快速搭建單頁(yè)面應(yīng)用，并且可以省去手動(dòng)配置webpack內(nèi)容的工作。它擁有自動(dòng)生成vue.is文件和webpack項(xiàng)目模板的功能，一定程度上給與開發(fā)者好的開發(fā)體驗(yàn)。在開發(fā)時(shí)，利用Vue-CLi生成模板文件，頁(yè)面代碼完成后，極短的時(shí)間就可以編譯運(yùn)行并且支持熱重載，在保存代碼的同時(shí)，它還有一個(gè)lint校驗(yàn)功能，開發(fā)者可以設(shè)置自己的校驗(yàn)規(guī)則，從而規(guī)范整潔自己的代碼。

Vue-Cli安裝和使用：安裝：首先要安裝好nodejs，然后通過nodejs提供的包管理器npm安裝腳手架，命令為npm install -g@vue/cli。創(chuàng)建項(xiàng)目：基于命令行的方式創(chuàng)建Vue項(xiàng)目，命令為vueCreate vue-project。配置項(xiàng)目：接著選擇所需的安裝功能、代碼質(zhì)量模式和校驗(yàn)代碼時(shí)間等。質(zhì)量模式一般選擇為標(biāo)準(zhǔn)模式，文件的存放方式推薦使用單獨(dú)存放。

5數(shù)據(jù)庫(kù)的設(shè)計(jì)與實(shí)現(xiàn)

5.1數(shù)據(jù)庫(kù)介紹

數(shù)據(jù)庫(kù)采用目前流行的免費(fèi)的開源關(guān)系型數(shù)據(jù)庫(kù)——MySQL數(shù)據(jù)庫(kù)，它使用結(jié)構(gòu)化查詢語(yǔ)言SOL進(jìn)行數(shù)據(jù)管理，MySQL的處理速度快，安全可靠以及良好的適應(yīng)性受到廣大開發(fā)者的青睞，在不需要事物處理的情況下，MySQL數(shù)據(jù)庫(kù)將會(huì)是開發(fā)者很好的一個(gè)數(shù)據(jù)庫(kù)選擇。

通過數(shù)據(jù)管理軟件——Navicate for MySQL，進(jìn)行MySQL數(shù)據(jù)表的開發(fā)，大大加快了數(shù)據(jù)庫(kù)的開發(fā)進(jìn)度，幫助程序員提高了開發(fā)效率。并且在管理軟件的客戶端進(jìn)行SQL語(yǔ)句的查詢、刪除等測(cè)試，更有利于軟件中出現(xiàn)的問題的查找。

5.2數(shù)據(jù)庫(kù)功能分析

數(shù)據(jù)庫(kù)的設(shè)計(jì)對(duì)于軟件的開發(fā)與設(shè)計(jì)是極為重要的，好的數(shù)據(jù)庫(kù)沒計(jì)不僅可以節(jié)省一定的存儲(chǔ)數(shù)據(jù)空間，而且可以更加方便開發(fā)者對(duì)數(shù)據(jù)庫(kù)應(yīng)用系統(tǒng)的維護(hù)與開發(fā)。根據(jù)我們前期的調(diào)查問卷可知，軟件的使用主體主要是普通用戶和管理者。普通用戶作為軟件的主體之一，擁有瀏覽社區(qū)資訊、社區(qū)發(fā)帖回復(fù)、好友即時(shí)通訊和閱覽書籍資源的權(quán)限。用戶還可以在平臺(tái)上關(guān)注不同國(guó)家、地區(qū)等板塊內(nèi)容。用戶發(fā)帖時(shí)，帖子的內(nèi)容可以包含文字、圖片和表情等，用戶還可以對(duì)發(fā)帖內(nèi)容進(jìn)行點(diǎn)贊，并且對(duì)發(fā)布的帖子進(jìn)行評(píng)論。用戶在搜索模塊中，可以查詢不同國(guó)家的書籍資源，通過充值V幣，用戶可以獲取一些付費(fèi)資源的使用以及閱讀上的特殊功能。在群組功能模塊中，用戶可以在這里管理自己的好友列表，通過對(duì)不同語(yǔ)言翻譯進(jìn)行即時(shí)通訊。資訊模塊中，用戶可以瀏覽一帶一路沿線國(guó)家的新聞熱點(diǎn)、社區(qū)動(dòng)態(tài)、生活短視頻等資訊。系統(tǒng)中的管理員主要負(fù)責(zé)用戶資格和平臺(tái)上資源的審核工作以及及時(shí)發(fā)布系統(tǒng)信息。

5.3數(shù)據(jù)庫(kù)的設(shè)計(jì)與實(shí)現(xiàn)

在進(jìn)行數(shù)據(jù)庫(kù)的設(shè)計(jì)之前，首先要選擇適合我們的數(shù)據(jù)庫(kù)設(shè)計(jì)工具，本項(xiàng)目采用的是MySQL數(shù)據(jù)庫(kù)，它是免費(fèi)并且開放源代碼的，是目前主流數(shù)據(jù)庫(kù)之一。然后需要制定數(shù)據(jù)庫(kù)的對(duì)象命名規(guī)范，在進(jìn)行具體實(shí)踐之前還需要進(jìn)行一定的邏輯沒計(jì)等工作。數(shù)據(jù)庫(kù)主要包括用戶信息表、地區(qū)表、書架表、主帖表、回復(fù)表、資訊表、關(guān)注內(nèi)容表這幾個(gè)主要數(shù)據(jù)表，數(shù)據(jù)庫(kù)的沒計(jì)也都遵循設(shè)計(jì)范式的要求。

6結(jié)束語(yǔ)

“一帶一路”國(guó)家多為非英語(yǔ)母語(yǔ)國(guó)家，缺少統(tǒng)一的互動(dòng)交流平臺(tái)。開發(fā)一款基于微信小程序的多語(yǔ)種跨文化UGC互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái)具有一定的理論指導(dǎo)和實(shí)踐意義。由于本項(xiàng)目在人力、財(cái)力和時(shí)間上面的一些局限性，本小程序系統(tǒng)后期的維護(hù)和系統(tǒng)功能的完善是我們后面需要努力的方向。

參考文獻(xiàn)：

[1]劉紅衛(wèi).微信小程序應(yīng)用探析[J].無線互聯(lián)科技，2016（23）：11-12，40.

[2]陳琦.基于Wehpy+Apache HrrTP Server的微信小程序架構(gòu)搭建研究[J].無線互聯(lián)科技，2017（18）：50-51.

[3]陳濤，葉榮華.基于Spring Boot和MongoDB的數(shù)據(jù)持久化框架研究[J].電腦與電信，2016（1）：71-74.

【通聯(lián)編輯：朱寶貴】

收稿日期：2020-03-25

基金項(xiàng)目：本文系江蘇省大學(xué)生創(chuàng)新訓(xùn)練計(jì)劃重點(diǎn)項(xiàng)目（國(guó)家級(jí)）一多語(yǔ)種跨文化UGC互動(dòng)網(wǎng)絡(luò)社區(qū)平臺(tái)開發(fā)與應(yīng)用研究，項(xiàng)目編號(hào)：201910304016Z

作者簡(jiǎn)介：朱帥（1998-），男，江蘇宿遷人，南通大學(xué)信息科學(xué)技術(shù)學(xué)院2017級(jí)在讀，研究方向計(jì)算機(jī)軟件開發(fā);朱軼蓉（1998-），女，江蘇淮安人，南通大學(xué)外國(guó)語(yǔ)學(xué)院2017級(jí)在讀，研究方向日語(yǔ);鄭新超（1982-），女，山東德州人，南通大學(xué)外國(guó)語(yǔ)學(xué)院講師，北京外國(guó)語(yǔ)大學(xué)碩士，研究方向微課教學(xué)。