无码日韩精品无码国产_一级做a爰片久久毛片潮喷_国产欧美国日产_久久9热re这里只有国产中文精品6_每天将为您更新成人影视在线看免费观看

Menu
小程序資訊
小程序資訊
微信小程序云端解決方案教程四:視頻應用場景
時間:2016-10-15 17:12:00
  • 部署和運行
    • 整體架構(gòu)
    • 1. 準備域名和證書
    • 2. Nginx 和 Node 代碼部署
    • 3. 配置 HTTPS
    • 4. 域名解析
    • 5. 開通 點播服務
    • 6. 準備 云數(shù)據(jù)庫MySQL
    • 7. 啟動新片預告示例 Node 服務
    • 8. 啟動新片預告 Demo
  • 主要功能實現(xiàn)
    • 獲取視頻列表、展示評論、提交評論
    • 播放視頻
Tencent Cloud

新片預告是結(jié)合騰訊云點播 VOD云數(shù)據(jù)庫 MySQL制作的一個微信小程序示例。在代碼結(jié)構(gòu)上包含如下兩部分:

  • app: 新片預告應用包代碼,可直接在微信開發(fā)者工具中作為項目打開
  • server: 搭建的Node服務端代碼,作為服務器和app通信,提供 CGI 接口示例用于拉取云數(shù)據(jù)庫上的視頻列表、評論列表,將評論數(shù)據(jù)提交到云數(shù)據(jù)庫

新片預告主要功能如下:

  • 支持分頁滾動加載視頻列表
  • 點擊海報跳轉(zhuǎn)至詳情頁播放視頻
  • 對視頻進行評論
  • 展示視頻的評論列表

部署和運行

拿到了本小程序源碼的朋友可以嘗試自己運行起來。

整體架構(gòu)

1. 準備域名和證書

在微信小程序中,所有的網(wǎng)路請求受到嚴格限制,不滿足條件的域名和協(xié)議無法請求,具體包括:

  • 只允許和在 MP 中配置好的域名進行通信,如果還沒有域名,需要注冊一個。
  • 網(wǎng)絡請求必須走 HTTPS 協(xié)議,所以你還需要為你的域名申請一個 SSL 證書。

騰訊云提供域名注冊證書申請服務,還沒有域名或者證書的可以去使用

域名注冊好之后,可以登錄微信公眾平臺配置通信域名了。

注意:需要將 www.qcloud.la 設置為上面申請的域名

2. Nginx 和 Node 代碼部署

小程序服務要運行,需要進行以下幾步:

  • 部署 Nginx,Nginx 的安裝和部署請大家自行搜索(注意需要把 SSL 模塊也編譯進去)
  • 配置 Nginx 反向代理到 http://127.0.0.1:9994
  • Node 運行環(huán)境,可以安裝 Node V6.6.0
  • 部署 server 目錄的代碼到服務器上,如 /data/release/qcloud-applet-video
  • 使用 npm install 安裝依賴模塊
  • 使用 npm install pm2 -g 安裝 pm2

上述環(huán)境配置比較麻煩,新片預告的服務器運行代碼和配置已經(jīng)打包成騰訊云 CVM 鏡像,推薦大家直接使用。

  • 鏡像部署完成之后,云主機上就有運行 WebSocket 服務的基本環(huán)境、代碼和配置了。
  • 騰訊云用戶可以免費領取禮包,體驗騰訊云小程序解決方案。
  • 鏡像已包含所有小程序的服務器環(huán)境與代碼,需要體驗小程序的朋友無需重復部署

3. 配置 HTTPS

鏡像中已經(jīng)部署了 nginx,需要在 /etc/nginx/conf.d 下修改配置中的域名、證書、私鑰。

配置完成后,即可啟動 nginx。

nginx

4. 域名解析

我們還需要添加域名記錄解析到我們的云服務器上,這樣才可以使用域名進行 HTTPS 服務。

在騰訊云注冊的域名,可以直接使用云解析控制臺來添加主機記錄,直接選擇上面購買的 CVM。

解析生效后,我們在瀏覽器使用域名就可以進行 HTTPS 訪問。

5. 開通 點播服務

新片預告示例的播放資源是存儲在 騰訊云點播 上的mp4文件,要使用 點播 服務,需要登錄 點播 管理控制臺,然后在其中完成以下操作:

  • 上傳視頻資源,點播幾乎支持所有主流的視頻格式上傳
  • 轉(zhuǎn)碼成功后獲取mp4或m3u8源地址

目前微信小程序video組件經(jīng)測試支持mp4m3u8格式,其中 m3u8 格式只能在手機上使用,開發(fā)者可以使用騰訊云點播控制臺將視頻源轉(zhuǎn)碼成 mp4 或 m3u8 格式,并且騰訊云點播會對播放的資源進行CDN加速。

6. 準備 云數(shù)據(jù)庫MySQL

示例中拉取的視頻和評論列表都是存儲在 云數(shù)據(jù)庫 上,要使用 云數(shù)據(jù)庫 服務需要完成以下操作

  • 購買,注意購買的云數(shù)據(jù)庫需要與云服務器同在一個地域分區(qū)
  • 初始化流程,本示例選用的是utf8編碼
  • 點擊云數(shù)據(jù)庫 控制臺操作欄的登錄按鈕,登錄到phpMyAdmin創(chuàng)建數(shù)據(jù)庫并在當前數(shù)據(jù)庫中導入本示例中的SQL文件

注意:導入SQL文件中包含了 點播 上傳的視頻列表,開發(fā)者可以基于云數(shù)據(jù)庫自行開發(fā)維護一個視頻發(fā)布管理系統(tǒng),因為此內(nèi)容跟本示例暫不相關,所以不再詳述。

7. 啟動新片預告示例 Node 服務

在鏡像中,新片預告示例的 Node 服務代碼已部署在目錄/data/release/qcloud-applet-video下:

進入該目錄:

cd /data/release/qcloud-applet-video

在該目錄下有個名為config.js的配置文件(如下所示),按注釋修改對應的 MySQL 配置:

module.exports = {
    // Node 監(jiān)聽的端口號
    port: '9994',
    ROUTE_BASE_PATH: '/applet',

    host: '填寫開通 MySQL 時分配的內(nèi)網(wǎng)IP',
    user: '填寫MySQL用戶名',
    password: '填寫MySQL密碼',
    database: '填寫上一步中創(chuàng)建的MySQL數(shù)據(jù)名',
};

示例使用pm2管理 Node 進程,執(zhí)行以下命令啟動 node 服務:

pm2 start process.json

8. 啟動新片預告 Demo

在微信開發(fā)者工具將新片預告應用包源碼添加為項目,并把源文件config.js中的通訊域名修改成上面申請的域名。

然后點擊調(diào)試即可打開新片預告Demo開始體驗。

主要功能實現(xiàn)

獲取視頻列表、展示評論、提交評論

通過node的mysql模塊連接mysql,進行查詢,插入操作
以下是查詢評論列表的示例代碼

const mysql = require('mysql');
const config = require('../../../config');

let vid = this.req.query.vid;
if (!vid) {
    this.res.json({ code: -1, msg: 'failed', data: {} });
    return;
}

//CDB Mysql配置
let connection = mysql.createConnection({
    host: config.host,
    password: config.password,
    user: config.user,
    database: config.database
});

//開啟數(shù)據(jù)庫連接
connection.connect((err) => {
    if (err) {
        this.res.json({ code: -1, msg: 'failed', data: {} });
    }
});

//查詢列表
connection.query('SELECT * from comment where vid = ? order by id desc', [vid], (err, result) => {
    if (err) {
        this.res.json({ code: -1, msg: 'failed', data: {} });
        return;
    }

    this.res.json({
        code: 0,
        msg: 'ok',
        data: result,
    });
});

//查詢完后關閉連接
connection.end();

播放視頻

<video src="{{videoUrl}}" binderror="videoErrorCallback"></video>

屬性名類型說明
src
咨詢
微信掃碼咨詢
電話咨詢
400-888-9358