開發人員創建測試小程序流程

發工具

1. HBuliderX （推薦使用，因為自帶有強大的工具，發布、在線調試等）

下載：https://www.dcloud.io/hbuilderx.html

2. 微信開發者工具

下載：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

注冊小程序

1、注冊方法

在微信公眾平臺官網首頁（mp.weixin.qq.com）點擊右上角的“立即注冊”按鈕。

2、選擇注冊的帳號類型

選擇“小程序”，點擊“查看類型區別”可查看不同類型帳號的區別和優勢。

3、填寫郵箱和密碼

請填寫未注冊過公眾平臺、開放平臺、企業號、未綁定個人號的郵箱。

4、激活郵箱

登錄郵箱，查收激活郵件，點擊激活鏈接。

5、填寫主體信息

點擊激活鏈接后，繼續下一步的注冊流程。請選擇主體類型選擇，完善主體信息和管理員信息。

選擇主體類型：

主體類型有：

個人，企業類型，媒體類型，其他組織和政府單位

作為開發人員我們可以直接選擇個人，就不必考慮企業驗證問題。

如果選擇企業等其他類型，需要驗證。填寫主體信息并選擇驗證方式

企業類型帳號可選擇兩種主體驗證方式。

方式一：支付驗證

需要用公司的對公賬戶向騰訊公司打款來驗證主體身份，打款信息在提交主體信息后可以查看到。

請根據頁面提示，向指定的收款帳號匯入指定金額。

溫馨提示：請在10天內完成匯款，否則將注冊失敗。

方式二：微信認證

通過微信認證驗證主體身份，需支付300元認證費。認證通過前，小程序部分功能暫無法使用。

如需了解主體驗證方式請“點擊這里”

填寫管理員信息

確認主體信息不可變更

開發小程序（使用uni-app）

1. 打開HBuilderX，直接通過文件菜單新建一個uni-app項目，里面有相應的模板可選，這里建議有興趣可以試試。

2. 創建完成后設置微信小程序信息，如下圖，左側為文件結構，可以在manifest.json中設置小程序的AppID，跟申請的小程序關聯

3. 運行小程序調試開發，點擊運行菜單=》運行到小程序模擬器=》微信開發者工具。這樣即可調出微信開發者工具進行調試開發。

4. 接下來就可以正常開發了，開發前需要了解uni-app的知識，這里就不做過多講解

官網：https://uniapp.dcloud.io/

5. 上傳體驗版

言

近年來，隨著創業公司、成長型企業以及獨立開發人員的數量不斷增加，他們對于容易使用且高性能的云端運算基礎建設的需求也日益增長。但受限于這些企業往往缺乏專職的技術和運維人員，或者僅將云服務器作為內部開發環境使用，在電商店鋪管理、企業網站、業務系統上云、部署小程序等場景，需要更低的IT部署與運維復雜度，以及更高的效率與效益。因此，他們亟需一款更加輕量高效、易于部署、價格實惠、使用簡單、管理方便的云服務器。

與此同時，隨著業務的不斷增長，面對私有化服務運維壓力的逐步遞增，越來越多的中小型企業選擇將輕量級OA/ERP系統上云管理，專注于業務數據本身的同時有效解放IT運維勞動力。

無論任何場景訴求，安全可靠始終是企業上云的第一要義。基于華為30多年在ICT領域的技術積累和產品解決方案開放能力，華為云在云服務方面已然遙遙領先，以“穩定、可靠、安全”三大核心性能護航企業上云。華為云擁有超可靠的云計算基礎設施，以T4級別機房、雙AZ高可靠，滿足客戶高安全需求；同時擁有國內最大的SRE團隊之一，超強運維能力確保云服務超高可用性，產品可靠性指標業界領先，中小企業可以完全放心將業務放到云上托管，更專注于應用本身。

此外，華為云還提供了WAF/DDoS等豐富的安全防護產品，匹配不同階段需求的客戶，使得中小型企業在快速發展的過程中可以靈活選用合適的產品，安全穩定放心用，解放IT生產力。

針對此類用戶需求，華為云推出了全新的華為云耀云服務器L實例（云耀L實例）。與傳統的云服務器相比，云耀L實例更適合中小企業與開發者用戶，以“簡單上云第一步”為理念，對性能、選購、部署、運維等方面進行優化，并且極具性價比。

一站式服務輕松上云，云耀L實例助力中小型企業快速搭建官網、小程序等輕量業務

網絡的發展不但改變了人們的生活習慣，也給企業的經營模式帶來諸多改變，很多企業選擇通過官網建設和小程序、公眾號營銷等策略塑造企業形象的第一張名片，拓展營銷渠道，提高營銷效率，建立與客戶之間更便捷的溝通。

但同時，很多傳統企業和中小型企業并沒有獨立的研發能力，而外部的開發資源又良莠不齊，這導致企業付出了一定成本建站以后，也沒有長期維護的能力。那么有沒有一種適合中小型企業的產品，可是快速搭建這類輕量級業務呢？本次我們帶來云耀L實例的實戰。

準備工作

官網選擇云耀L實例，應用鏡像選擇Linux可視化寶塔面板。

我們這里選擇2核4G的實例規格，性價比較高，官網的流量包可以選擇基礎1000GB，小程序/公眾號按照實際流量選擇，或者可以選擇4核8G，目前雙11活動期間價格也比較親民，全新4核8G 6M規格僅需498元/年即可入手，實惠更實用。

建議勾選開啟 主機安全 HSS（基礎版），開啟后，將為您的云耀L實例提供：口令檢測、漏洞檢測：賬戶暴力破解、異常登錄等功能。本次我們勾選數據盤、開啟HSS、以及使用云備份存儲。

配置安全組

安全組類似防火墻功能，是一個邏輯上的分組，用于設置網絡訪問控制。用戶可以在安全組中定義各種訪問規則，當彈性云服務器加入該安全組后，即受到這些訪問規則的保護。

我們的官網搭建之前，要配置相關的入方向規則，也就是開放服務的外部訪問端口。

首先，我們在彈性云服務器列表，單擊待變更安全組規則的彈性云服務器名稱。

系統跳轉至該彈性云服務器詳情頁面，選擇“安全組”頁簽，展開安全組，查看安全組規則。

新建一個安全組，我們這里改成云耀L實例官網搭建測試。

配置需要的端口或者IP規則，22端口已經默認開啟了，這里我們配置80、9090、8888、3306（數據庫）端口，用于訪問我們的服務。

配置完的安全組規則如下：最后修改服務器的安全組開放端口限制為官網測試，那么前期準備就完成了。下面是我們搭建官網的策略組清單，可以按順序配置。

點擊圖片可查看完整電子表格

使用Linux寶塔面板快速搭建javaWeb官網

登錄服務器

可以使用CloudShell登錄比較方便。

我們輸入指令

sudo cat /credentials/password.txt

命令行獲取寶塔管理界面用戶名及密碼。可查看到管理員用戶名為administrator。

我們也可以運行以下命令來直接設置密碼，其中，“passwd”為管理員administrator的密碼。

例如cd /www/server/panel && btpython tools.py panel abc123456 administrator，指管理員administrator的密碼為abc123456。

返回之前的頁面，點擊鏡像信息，登錄寶塔面板。

輸入我們剛才獲取的用戶名和密碼，然后直接點擊登錄。

安裝搭建自己的PHP、phpMyAdmin（Web端MySQL管理工具）、Nginx1.22、Mysql以及javaweb管理器

打開java項目管理器-版本管理-安裝tomcat9

回到首頁-點擊文件-進入tomcat9目錄中打開webapps，將里面的所有文件都刪除-然后上傳已打包好的war項目包-tomcat會自己解壓war包。

數據庫配置

點擊數據庫-點擊root密碼進行修改密碼，

如果是簡單應用的話，可以使用寶塔面板新建MySQL數據庫，也可以導入本地數據庫文件。

部署官網web程序

創建站點-回到軟件商店-點擊java項目管理器-項目管理-添加項目

部署完SSL后訪問站點，就可以看到我們剛才部署的網站了

快速搭建企業官網小程序

到這我們前期的準備已經基本完成。

正常的官網小程序，是必須有前端的，如果是靜態展示頁面可以不需要后端。

作為教學案例，使用的是開源的追格官網方案。

大家也可以根據自己需要去使用不同的框架語言與開發部署方案。

域名及SSL證書配置

小程序是需要域名的。首先功能性的小程序，后端是需要做開發的，而且微信小程序也明確要求必須是域名而且只接受https請求。那么對于有端口的用戶，也需要做端口映射。

選擇未被注冊的域名進行注冊。這里流程比較簡單。

需要注意的是，域名信息模板填寫后，一般1個工作日可完成審核，有的可能需要3-7個工作日，需要等待信息模板審核通過后才可以使用。

等待域名信息模板審核通過后，點擊申請域名，選擇域名信息模板，然后提交訂單，支付域名價錢即可。

等到SSL證書購買下來后，你可以將SSL證書下載部署到你的網站。

我們使用的是寶塔面板，只需要在網站設置，里面找到“SSL”，選擇“其他證書”，然后將SSL證書的對應內容填進去就可以了。如下圖所示

偽靜態設置

在網站→設置→偽靜態→選擇WordPress后，保存即可！至此寶塔面板配置基本完成。下面我們登錄WordPress

網站固定鏈接設置

WordPress后臺 - 設置 - 網站固定鏈接 - 自定義結構：/%category%/%post_id%.html

WordPress是使用PHP語言開發的博客平臺，用戶可以在支持PHP和MySQL數據庫的服務器上架設屬于自己的網站。除此之外，由于WordPress的易用性，可以集成各種插件，我們可以用來搭建個人博客、企業官網、電商、考試系統等豐富的場景。這里我們使用WordPress搭建一個官網小程序。

Hbuilderx工具安裝

安裝微信等開發者工具后，重點安裝Hbuilderx，后續大部分操作均在Hbuilderx中完成，微信等工具主要是一個發布的作用。

Hbuilderx下載：https://www.dcloud.io/hbuilderx.html

前端（小程序）配置與發布

2.1、Hbuilderx工具→文件→打開項目→client（小程序前端代碼）；

2.2、/utils/config.js 中的域名改為自己網站域名；

溫馨提示：域名和開發者后臺域名必須一致，要么統一帶www，要么統一不帶

2.3、配置域名后→運行到內置瀏覽器即可看到演示；

2.4、發行到小程序模擬器（微信、百度、QQ）查看演示和提交審核；這里我們點擊微信。

后端（插件）下載與配置

這里我們主要是作為示意，使用wordpress插件實現的后端功能，當然也可以使用node、python、java去實部署。但是過程略有不同，大體思路是一致的。

3.1、wordpress后臺→插件→安裝插件→搜索：醬茄（藍色圖標這個）→ 安裝并啟用；

3.2、進入WordPress后臺”醬茄小程序”管理菜單頁面，設置好 APPID 和 APPSECRET，及其他信息；

至此，等待小程序發布后，我們的官網小程序就已經部署完成了。后續可基于開源框架進行二次開發，個性化定制所需內容。

CDN配置

內容分發網絡（Content Delivery Network，CDN）通過將站點內容發布至遍布全球的海量加速節點，使其用戶可就近獲取所需內容。

配置CDN可以避免因網絡擁堵、跨運營商、跨地域、跨境等因素帶來的網絡不穩定、訪問延遲高等問題，有效提升下載速度、降低響應時間，提供流暢的用戶體驗。

我們可以選擇配置CDN對我們的應用進行加速

1、

2、登錄華為云控制臺，在控制臺首頁左上角選擇“服務列表 > CDN與智能邊緣 > 內容分發網絡 CDN”，購買CDN服務。

3、在左側導航欄選擇“域名管理”，進入域名管理頁面。在域名管理界面，單擊“添加域名”，配置域名參數。

輕量業務上云遷移，解放運維壓力

輕量業務上云已經成為了一種趨勢，但是私有化服務上云不是一蹴而就的。將現有系統和數據遷移到云平臺上可能需要耗費時間和精力，才能確保數據的完整性、一致性和安全性的同時控制成本。

成本控制和預算管理，是中小企業IT管理者和決策者決定上云的重要條件。華為云耀云服務器L實例不僅支持官網小程序的搭建，同時對于輕量級業務，如輕量OA/ERP的遷移也十分友好，這里我們以開源OA系統作為案例，實現快速遷移。

這里默認我們已經完成上述的主機購買、安全組配置、實例連接等操作，只展示關鍵步驟。

數據備份及導出

mysqldump 是一個 MySQL 自帶的備份工具，可以將 MySQL 數據庫備份成 SQL 格式的文件，該文件包含了完整的數據庫結構和數據。

要將源數據庫遷移到云數據庫RDS，需要先對其進行導出。

登錄源數據庫。
使用mysqldump將表結構導出至SQL文件。

mysqldump--databases<DB_NAME>--single-transaction --order-by-primary --hex-blob --no-data --routines --events --set-gtid-purged=OFF-u <DB_USER>-p -h<DB_ADDRESS>-P <DB_PORT>|sed -e 's/DEFINER[ ]*=[ ]*[^*]*\*/\*/' -e 's/DEFINER[ ]*=.*FUNCTION/FUNCTION/' -e 's/DEFINER[ ]*=.*PROCEDURE/PROCEDURE/' -e 's/DEFINER[ ]*=.*TRIGGER/TRIGGER/' -e 's/DEFINER[ ]*=.*EVENT/EVENT/' ><BACKUP_FILE>

DB_NAME為要遷移的數據庫名稱。
DB_USER為數據庫用戶。
DB_ADDRESS為數據庫地址。
DB_PORT為數據庫端口。
BACKUP_FILE為導出生成的文件名稱。

使用mysqldump將數據導出至SQL文件。

mysqldump --databases<DB_NAME>--single-transaction --hex-blob --set-gtid-purged=OFF --no-create-info --skip-triggers-u<DB_USER>-p-h<DB_ADDRESS>-P<DB_PORT>-r<BACKUP_FILE>

數據庫配置

OA配置文件中修改MySQL配置

配置文件路徑：o2server/config/externalDataSources.json

將其中的url、username、password以及enable信息修改為上述實例MySQL的相關信息，如：

[
 {
 "url":"jdbc:mysql://XXX.0.0.1:3306/X?autoReconnect=true&useSSL=false&useUnicode=true&characterEncoding=UTF-8&useLegacyDatetimeCode=false&serverTimezone=GMT%2B8",
 "username" : "root",
 "password" :"password",
 "includes": [],
 "excludes": [],
 "enable" : true
 }
]

數據遷移

通過彈性云服務器或可訪問云數據庫RDS的設備，用相應客戶端連接云數據庫RDS實例，將導出的SQL文件導入到云數據庫RDS。

登錄已準備的彈性云服務器，或可訪問云數據庫RDS的設備。
客戶端連接云數據庫RDS實例。
導入表結構到云數據庫RDS。

mysql -f -h<RDS_ADDRESS>-P<DB_PORT>-uroot-p < <BACKUP_DIR>/dump-defs.sql

其中：

RDS_ADDRESS為云數據庫RDS實例的IP地址。
DB_PORT為當前數據庫實例的端口。
BACKUP_DIR為“dump-defs.sql”所在目錄。

示例如下：mysql -f -h 172.16.66.198 -P 3306 -u root -p < dump-defs.sql

導入數據到云數據庫RDS。

mysql -f -h<RDS_ADDRESS>-P<DB_PORT>-uroot-p< <BACKUP_DIR>/dump-data.sql

其中

RDS_ADDRESS為云數據庫RDS實例的IP地址。
DB_PORT為當前數據庫實例的端口。
BACKUP_DIR為“dump-data.sql”所在目錄。

示例如下：mysql -f -h 172.16.66.198 -P 3306 -u root -p < dump-data.sql

查看遷移結果，遷移完成

使用mysqldump遷移RDS for MySQL數據后，后續需要以下驗證：

檢查權限完整性。
對索引進行重建。
對比參數配置。

安裝OA系統/部署OA鏡像

到這里，大部分的準備工作都已經完成，剩下的就是具體的OA系統部署，然后鏈接數據庫，就完成了我們的本地OA上云體驗了，篇幅原因我們這里快速安裝OA系統，點擊遠程登錄

命令行創建 /data目錄，解壓安裝包

[root@ecs-nginx ~]# mkdir /data
[root@ecs-nginx ~]# cd /data
[root@ecs-nginx ~]# unzip o2server-5.1.2-arm.zip

使用默認配置運行OA服務器

[root@ecs-nginx ~]# cd /data/o2server
[root@ecs-nginx ~]# ./start_arm.sh

等待WEB服務器端口啟動完成（默認為80端口），啟動完成后訪問服務器即可：下面是測試版的O2OA上云成功的運行界面。

系統高可用配置優化

這里我們已經完成了OA的遷移，但是為了保證系統的高可用性，我們還要繼續進行操作。

1.設置CBR云備份策略

我們在準備環節中，已經購買了一個可用的云服務器備份存儲庫，并且已經綁定了我們的云耀L實例。

接下來我們將整個存儲庫綁定的資源按照一定的策略要求，對資源的數據進行周期性備份，以便服務器在數據丟失或損壞時快速恢復數據，保證業務正常運行。

為了盡量保證備份數據的完整性，建議選擇凌晨且磁盤沒有寫入數據的時間進行備份。

1、登錄云備份管理控制臺。

登錄管理控制臺。
單擊管理控制臺左上角的圖標并選擇區域和項目。

單擊選擇存儲 > 云備份。選擇對應的備份目錄。

2、在云服務器備份界面，選擇“存儲庫”頁簽，找到云服務器所對應的存儲庫。

3、執行備份，

單擊“操作”列下的“執行備份”。選擇綁定存儲庫上需要備份的服務器，勾選后將在已勾選服務器列表區域展示，如所示。

單擊目標存儲庫名稱，進入存儲庫詳情。在“綁定的服務器”頁簽，找到目標服務器。單擊“操作”列下的“執行備份”，為目標服務器進行備份

然后輸入備份的“名稱”和“描述”，選擇“執行全量備份”。勾選后，系統會為綁定的服務器執行全量備份，備份所占存儲容量也會相應增加。單擊“確定”。系統會自動為服務器創建備份。在“備份副本”頁簽，產生的備份的“備份狀態”為“可用”時，表示備份任務執行成功。

2.HSS配置IT權限隔離

創建用戶并授權使用HSS，或者通過角色設置不同的訪問權限，以達到用戶之間的權限隔離。

購買了專業版或者企業版安全防護以后，我們就可以進行白名單管理，通過HSS配置IT權限隔離。默認情況下，管理員創建的IAM用戶沒有任何權限，您需要將其加入用戶組，并給用戶組授予策略或角色，才能使得用戶組中的用戶獲得對應的權限，這一過程稱為授權。授權后，用戶就可以基于被授予的權限對云服務進行操作。

上面我們已經介紹了一站式搭建官網及小程序、輕量業務上云遷移兩大業務場景，今年雙11期間，華為云也推出了雙11營銷季，攜20+明星產品及解決方案特惠而來，助力企業闊步云上新征程。

截至11月30日，華為云20+產品及解決方案給企業用戶帶來從云服務器、安全防護到技術開發、企業運營的一站式上云支持，全方位推動千行萬業創新發展，切實幫助中小企業數字化轉型“爬坡過坎”。

其中，華為云耀云服務器L實例依托QingTian架構和全球存算網KooVerse，打造智能不卡頓、上手更簡單、管理特省心的上云體驗。雙11期間，2核2G 3M規格只需29元/3月、88元/年起，讓中小企業邁出“簡單上云第一步”。云耀L實例也將在華為云開年采購、618營銷季、828 B2B企業節等活動中帶來諸多超值優惠，助力中小企業韌性成長，不容錯過！

BuilderX 5+app SQLite數據庫操作

使用 HBuilderX 進行手機端 app 開發時，可以使用 SQLite 數據庫進行本地存儲，具體的 api 參考：

https://www.html5plus.org/doc/zh_cn/sqlite.html

包括：

openDatabase: 打開數據庫
isOpenDatabase: 判斷數據庫是否打開
closeDatabase: 關閉數據庫
transaction: 執行事務
executeSql: 執行增刪改等操作的SQL語句
selectSql: 執行查詢的SQL語句

由于這些 api 方法都是異步調用，所以與我們通常的數據庫開發有一些差別。為此，我們可以對數據庫操作進行封裝，方便在開發中進行調用，封裝如下：

const dbname='數據庫名稱';
const dbfilename='_doc/' + '數據庫名稱.db'; // 數據庫文件

// 打開數據庫
/*
* successCallback - 數據庫操作成功的回調函數
* failCallback - 數據庫操作失敗的回調函數
*/
function open_db (successCallback, failCallback) {
    if (!plus.sqlite.isOpenDatabase({name: dbname, path: dbfilename})) {
        plus.sqlite.openDatabase({
            name: dbname,
            path: dbfilename,
            success: function(e){
                console.log('openDatabase success!');
                successCallback();
            },
            fail: function(e){
                console.log('openDatabase failed: '+JSON.stringify(e));
                failCallback(e);
            }
        });
    } else {
        successCallback();
    }
}

// 關閉數據庫
function close_db (successCallback, failCallback) {
    if (plus.sqlite.isOpenDatabase({name: dbname, path: dbfilename})) {
        plus.sqlite.closeDatabase({
            name: dbname,
            success: function(e){
                console.log('closeDatabase success!');
                successCallback();
            },
            fail: function(e){
                console.log('closeDatabase failed: '+JSON.stringify(e));
                failCallback(e);
            }
        });
    } else {
        successCallback();
    }
}

// 執行普通 SQL 語句，包括 insert update delete 等
function run_common_sql (sSql, successCallback, failCallback) {
    plus.sqlite.executeSql({
        name: dbname,
        sql: sSql,
        success: function(e){
            console.log('SQL: ' + sSql);
            console.log('executeSql success!');     
            successCallback();
        },
        fail: function(e){
            console.log('executeSql failed: '+JSON.stringify(e));
            failCallback(JSON.stringify(e));
        }
    });
}

// 執行 select SQL 語句
/*
* 成功回調函數 successCallback 的參數為 data, 對象數組，是 select 語句返回的結果
*/
function run_select_sql(sSql, successCallback, failCallback) {
    plus.sqlite.selectSql({
        name: dbname,
        sql: sSql,
        success: function(data){
            console.log('SQL: ' + sSql);
            console.log('selectSql success! ');
            console.log(JSON.stringify(data));
            successCallback(data);
        },
        fail: function(e){
            console.log('selectSql failed: '+JSON.stringify(e));
            failCallback(JSON.stringify(e));
        }
    });
}

在 js 中，調用方法舉例如下：

（本文以 vue 為例說明）

        mounted () {
            let _this=this;
            document.addEventListener('plusready', function(){
                console.log("所有plus api都應該在此事件發生后調用，否則會出現plus is undefined。");
                _this.init_db_1();
            });
        },
        methods: {
            db_fail (ex) {
                vant.showDialog({ message: ex });
            },
            init_db_1 () {
                open_db(this.init_db_2, this.db_fail);
            },
            init_db_2 () {
                run_common_sql('create table if not exists server(host text, port int)', this.init_db_3, this.db_fail);
            },
            init_db_3 () {
                run_common_sql('create table if not exists storehouse(org_id varchar(64), org_name text, store_house_id varchar(64), store_house_name text)', this.visit_db_1, this.db_fail);
            },
            visit_db_1 () {
                run_select_sql('select host, port from server', this.visit_db_1_success, this.db_fail);
            },
            visit_db_1_success (data) {
                if (data.length <=0) {
                    document.location.href='setupsys.html';
                } else {
                    this.host=data[0].host;
                    this.port=data[0].port;
                    run_select_sql('select org_id, org_name, store_house_id, store_house_name from storehouse', this.visit_db_2_success, this.db_fail);
                }
            },
            visit_db_2_success(data) {
            
            }
        }
    });

也就是說，調用方法是先調用 open_db，在 open_db 函數中指定回調函數，然后調用執行 sql 語句的函數，每次調用都需要指定下一個成功回調函數，在成功回調函數中繼續調用數據庫操作。

在線咨詢

上一篇：細說html的meta
下一篇：小白總結：前端HTML基礎知識點（1）-元素總結

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商