亚洲精品乱码久久久久蜜桃-97国产精品人妻无码久久久-加勒比中文字幕无码一区-中文字幕乱人伦高清视频-无码va在线观看

         HTML5帶來的豐富互聯網技術讓所有人都享受到了技術發展和體驗進步的樂趣。HTML5自然也是備受期待和矚目，技術人員、設計者、HTML5真的實現了拍照上傳應用么？

 1、  視頻流

        HTML5 The Media Capture API提供了對攝像頭的可編程訪問，用戶可以直接用getUserMedia獲得攝像頭提供的視頻流。我們需要做的是添加一個HTML5的Video標簽，并將從攝像頭獲得視頻作為這個標簽的輸入來源（請注意目前僅Chrome和Opera支持getUserMedia）。

2、  拍照

        拍照功能，我們采用HTML5的Canvas實時捕獲Video標簽的內容，Video元素能作為Canvas圖像的輸入，這一點很棒。主要代碼如下：

3、  圖片獲取

        下面我們要從Canvas獲取圖片數據，其核心思路是用canvas的toDataURL將Canvas的數據轉換為base64位編碼的PNG圖像，類似于

        因為真正圖像數據是base64編碼逗號之后的部分，所以我們實際服務器處理的圖像數據應該是這部分，我們可以用兩種辦法來獲取。

        第一種：是在前端截取22位以后的字符串作為圖像數據，

4、  圖片上傳

        在前端可以使用Ajax將上面獲得的圖片數據上傳到后臺腳本。例如使用jQuery時：

        請注意，以上的解決方案不僅能用于Web App拍照上傳，并且你可以實現把Canvas的輸出轉換為圖片上傳的功能。這樣你可以使用Canvas為用戶提供圖片編輯，例如裁剪、上色、涂鴉的畫板功能，然后把用戶編輯完的圖片保存到服務器上。

        在HTML5的驅動下，Web App與Native App之間是否還有不可逾越的鴻溝？我將會在3月23日百度開發者大會上現場來解答這個問題，敬請期待。

‍

杭州網站建設 更多：‍HTML4與HTML5之間有那些不同點