## 將Mugeda部署在第三方服務器
[想要了解更多Mugeda功能?>>>猛戳我,學習更多教程](Mugeda百科全書——文本教程目錄.md)
* * * * *
Mugeda制作的內容可以很方便的直接發布到Mugeda CDN。參見下圖。發布到Mugeda CDN后,你會得到一個發布地址,該地址可以用來進行分享。Mugeda會自動處理所有必要的操作,例如微信權限認證等。

如果你選擇導出Mugeda內容并自行部署到一個第三方的服務器上,Mugeda提供一套完善的機制來支持這些操作。簡單來說,需要完成如下步驟:
1. 你擁有一個微信公眾號,和一個綁定了微信的域名;
2. 你知道如何獲取有效的微信認證信息;
3. 用微信認證信息對Mugeda內容進行配置;
4. 部署配置后的內容;
下面詳細介紹每一個步驟:
**1. 你擁有一個微信公眾號,和綁定了微信的域名**
任何一個可以在微信中進行分享的域名,都必須通過微信的認證并綁定域名。為了綁定域名,你必須先有一個公眾號。有了公眾號后,登錄微信公眾平臺進入“公眾號設置”的“功能設置”里填寫“JS接口安全域名”。關于如何申請公眾號以及如何進行微信域名綁定,不在本文討論范圍。請咨詢你們的微信管理員或者訪問微信官方文檔。 以下的討論假定你已經擁有一個綁定了微信的域名。
**2.你知道如何獲取有效的微信認證信息**
擁有微信綁定的域名后,你還需要有有效的微信認證信息。典型的微信認證信息包括:
appId: 分配給公眾號的唯一標識
timestamp: 生成簽名的時間戳
nonceStr: 生成簽名時的隨機串
signature: 認證需要的簽名
關于如何獲取或者生成這些參數,請參考微信官方開發文檔。這里不再贅述。需要強調的是,由于微信簽名認證信息有效期為7200秒,即2個小時,因此在第三方部署時需要保證這些信息在必要時需要實時更新,保障總是能夠獲取到最新的認證信息。
以下的討論假定你已經擁有了有效的微信認證信息。
**3.用微信認證信息對Mugeda內容進行配置**
當你準備好了上述數據,我們就可以對Mugeda內容進行配置了。步驟如下:
首先在Mugeda云編輯器中導出想要發布的內容:

導出后會得到一個完整的HTML5內容包。 在內容包中包含有一個index.html文件,這個文件是我們配置的對象。用文本編輯器打開該文件。

在index.html文件中,有一個參數變量叫做_mrmcp,這個變量記錄了Mgueda內容進行播放時的一系列控制參數。我們需要定制的就是在這個參數列表中加入我們需要的信息。

配置信息可以包括微信認證信息,_mrmcp.wechatAuth。所需參數參見上述第2步的描述。配置好后的_mrmcp參數如下圖所示:

需要說明的是:
1. 由于微信權限設置有時間限制(7200秒),因此這些權限信息,主要是簽名signature和時間戳timestamp參數,需要及時進行更新。可以參考的辦法,是在服務器端通過動態技術(例如php等)動態生成這些信息,或者在頁面中通過動態技術(例如Ajax請求)獲取這些信息,并配置相應的_mrmcp參數。
2. 如果采用異步Ajax等異步技術加載權限信息時,index.html中名為loader.js的腳本文件,需要在Ajax處理完成后才能加載,否則可能會導致加載或者渲染異常。
3. 對Mugeda內容進行第三方部署時,僅需要按照上述步驟配置_mrmcp.wechatAuth參數即可,不需要再次加載微信的SDK JS文件(本文生成時地址為http://res.wx.qq.com/open/js/jweixin-1.0.0.js ),也不需要再次調用wx.config, wx.ready或者wx.onMenuShareTimeline等函數。這些具體的操作Mugeda內容都會自動完成。否則可能會導致分享和權限異常。
4. 部署配置后的內容:完成上述步驟后,就可以將配置后的內容部署到目標第三方服務器上,并將部署后的地址發布出去就可以了。對上述流程如有疑問,可以加入Mugeda學習群(QQ: 263360290)進行交流。
觀看本節視頻教程:
http://cdn1.mugeda.com/course/3/3.9/3.9.6.mp4
- 閱讀須知
- Mugeda平臺介紹
- 新手必看
- Mugeda是什么?
- 快速入門
- 快速制作炫酷動畫
- 無代碼添加交互
- 學會使用Mugeda模板
- 如何快速修改木疙瘩模板
- 作品創建前必讀
- 手機屏幕適配方法
- 圖片處理
- 聲音及視頻處理
- 屏幕適配設置
- 發布和預覽鏈接的區別
- H5作品相關設置
- 如何發布作品
- 功能詳解
- 界面與舞臺
- 簡介
- 縮放層數據
- 翻頁的相關設置
- 關鍵幀和頁面的命名
- 加載的相關設置
- 物體屬性設置
- 元件界面介紹
- 濾鏡效果
- 屏幕適配范圍與安全框
- 輔助線功能
- 首頁加載的靜態導出
- 素材與媒體
- 圖片上傳/素材庫
- 文本/文本段落
- 網頁
- 幻燈片
- 視頻
- 聲音
- 聲音的控制
- 繪制素材
- 云字體
- 曲線圖表
- 拖動動畫
- 虛擬現實
- 粘貼第三方文字和圖片
- 常用編輯操作
- 鎖定物體
- 節點工具
- 路徑工具
- 排列、對齊、變形、組合、合并功能
- 轉換為元件
- 導入PSD及注意事項
- 聲音和視頻的壓縮
- 聲音和視頻的交互控制
- 動畫
- 時間軸及圖層
- 選擇工具
- 關鍵幀動畫
- 路徑動畫
- 進度動畫
- 曲線變形動畫
- 預置動畫
- 元件動畫
- 分頁/加載頁
- 遮罩動畫
- 動畫運動
- 標尺和輔助線的使用
- 復制幀/圖層
- 如何實現動畫控制
- 文字變形動畫
- 運動曲線編輯
- 行為
- 行為添加以及觸發事件
- 幀的行為
- 頁的行為
- 播放元件片段
- 改變元素屬性
- 改變圖片
- 設置定時器
- 手機功能
- 跳轉鏈接
- 拖動的多種邏輯關系
- 舞臺截圖
- 改變行為屬性增加方框顏色
- 控件
- 陀螺儀
- 定時器
- 隨機數
- 擦玻璃
- 點贊
- 繪畫板
- 投票
- 抽獎
- 連線
- 拖動容器
- 投票、抽獎實時數據管理
- 計數器組件
- 排行榜
- 微信功能
- 微信頭像/微信昵稱
- 定制圖片
- 錄制聲音
- 分享信息
- 表單
- 自定義表單
- 系統默認表單
- 定制文字
- 定制賀卡文字
- 關聯綁定
- 舞臺動畫關聯
- 元件動畫關聯
- 屬性關聯
- 自動關聯
- 公式關聯
- 條件判斷
- 邏輯表達式判斷
- 多種表達式的寫法
- Mugeda API
- MugedaAPI整體結構
- 在動畫中插入腳本
- 使用自定義回調函數
- 通過API定義微信轉發
- 獲取Mugeda后臺數據
- 部署第三方服務器
- 案例講解
- 展示動畫
- 邀請函
- 招聘
- 個人簡歷
- 可定制賀卡
- 手機廣告
- 長按手指控制動畫播放
- 2016網易娛樂圈畫傳
- 一只挖空心思的行禮箱
- 科幻風格H5的制作
- 拖動長圖類H5制作
- 小爺吳亦凡案例
- UI原型
- 小圖標動畫
- 用Mugeda巧做GIF
- 小游戲
- 拍宇航員
- 手術刀
- 測試題
- 拖動選擇
- 概率抽獎
- 聲音測試題
- 真假朋友大質檢
- 圖片合成類H5的制作
- 60秒幫你擺脫朋友圈
- H5錄音機
- 制作接力型H5
- 微信/定制
- 和寶寶聊天
- 和奧運冠軍合影
- 熱門案例(試看)
- 什么才是福
- 教你玩轉密室逃脫類H5制作
- 星巴克咖啡
- 小爺吳亦凡
- 誰是足球明星
- 拷問拍拍618機密
- 用HTML5做交互課件
- CEO邀你群聊
- 里約大冒險
- 天貓宇宙邀請函
- 快閃
- H5換裝小游戲
- 視差類型H5制作
- H5版flappy bird
- 連連看小游戲
- 用遮罩做鏡頭特效
- 網易5筆畫愛
- 剪刀石頭布小游戲
- 交互動畫類H5制作
- 最新功能(1213)
- 如何使用排行榜
- 小功能更新
- 鎖定邊距
- 其他教程
- Mugeda簡約版介紹
- 如何自定義綁定微信公眾號
- 教師版賬號詳情介紹及使用方法