h5調用底層介面的一些知識

02-04

本文作者祈澈姑娘，轉載請標記轉載出處，謝謝。

之前接觸過這方面的知識，一直想寫一些關於代碼的文字，但考慮到浪費時間，又不具備大神的實力，也不想去把別人的代碼照搬過來，所以一直都是空白著的，今天敲代碼的時候，有了一個比較好的想法，第一，定位在學習這一塊，去學習一些領域的新知識，並分享自己每天的學習成果，第二，總結工作中遇到的代碼，解決的問題，拿出自己的demo截圖，做出一些文字說明解釋，相信通過這兩個途徑，能夠讓自己取得更大的發展空間。

h5調用本地攝像頭

前端時間使用HTML5做了一個WEB端APP，其中用到了H5頁面調用手機攝像頭的功能，當時也是花了不少時間去研究。最終是採用了HTML5plus（HTML5+）的方式完成了該功能，現將具體方法簡單介紹下，並講解下使用的注意事項。放在伺服器上然後瀏覽就可以了，只支持Chrome和Safari核的瀏覽器，QQ瀏覽器，Chrome，Safari瀏覽器都可以。在不同的手機和瀏覽器上面展現的方式不一樣。這是html5官方文檔地址，裡面有關於h5或js調用攝像頭的全部方法http://www.html5plus.org/doc/zh_cn/camera.htmlhttp://www.html5plus.org/doc/zh_cn/camera.html

本篇文章是個人學習期間整理的文檔，涉及到很多方面的鏈接，在Android開發過程中，有時需要調用手機自身設備的功能，本文側重攝像頭拍照功能的調用。使用許可權：調用手機自身設備功能（攝像頭拍照功能），應該確保已經在AndroidManifest.xml中正確聲明了對攝像頭的使用及其它相關的feature。安卓調用手機拍照功能：http://blog.csdn.net/mahoking/article/details/28225907；對一些class類的介紹是非常詳細的。

h5調用微信支付

用戶通過微信外瀏覽器打開商品頁面,進行微信支付購買商品... 第三方手機瀏覽器H5支付瀏覽器打開的移動網頁的主頁，通常是由後端人員來實現，在混合式開發之中，則是由前端人員來掉開發的介面，移動端手機支付功能體現在前端頁面上逐漸成為一個趨勢，h5微信開發調用支付介面文檔：https://pay.weixin.qq.com/wiki/doc/api/H5.php?chapter=4_2

看到這樣的一個問題：手機系統自帶的瀏覽器，調用微信支付如何實現（非掃碼），翻看了微信支付的api沒發現支持h5調支付介面的情況（微信js除外），然後卻發現美團的支付成功調用了，這是怎麼實現的？H5支付用於非微信瀏覽器，在IOS上仍體驗不佳，具體來講就是無法自動回調。微信瀏覽器內的H5支付指公眾號支付，微信已將此嚴格區分;首先要參見官方文檔：https://pay.weixin.qq.com/wiki/doc/api/wap.php?chapter=15_1

剛開始做的時候，需要配置一些東西，當然這都是一些最基本的東西;需要搭建環境來進行測試看到一篇這樣的文章，博主對此總結了一些實質性的經驗，學習起來事半功倍；微信支付配置信息，JSAPI介面，H5調用微信js介面支付，微信公眾號支付：http://blog.csdn.net/u010248119/article/details/50638529

對於微信支付如何繞過應用簽名這個問題；如果把微信支付的API封裝起來導出JAR包給多個應用使用，怎麼繞過這個應用簽名，如果繞不過，那豈不是每個應用我都要建個APP了嗎？題主提到的需求有兩種方案：https://www.zhihu.com/question/46841202

h5網頁中使用打電話功能

如果需要在移動瀏覽器中實現撥打電話，發送email，調用sns等功能，jquery mobile提供的介面是一個好辦法。

採用url鏈接的方式，實現在safari ios，android 瀏覽器，webos

瀏覽器，塞班瀏覽器，ie，operamini等主流瀏覽器，進行撥打電話功能。在做一個微信的微網站中的一個便民服務電話功能的應用，用到移動web頁面中列出的電話號碼，點擊需要實現調用通訊錄，網頁一鍵撥號的撥打電話功能。微信開發之移動手機WEB頁面(HTML5)Javascript實現一鍵撥號及簡訊發送功能:http://www.cnblogs.com/skylaugh/p/3277899.html ;一句話總結html5中頁面撥打電話的方式.

在開發過程中，我們難免會遇到這種情況：H5跳轉鏈接，撥號怎麼做？在製作H5的過程中，很多時候需要用到事件功能，比如（鏈接跳轉、撥號、翻頁等），這裡為大家介紹H5中常用的事件設置方式。http://blog.sina.com.cn/s/blog_12d5cc7a50102wpzb.html

h5調用掃一掃的功能

使用H5調用手機攝像頭掃描二維碼。可以通過微信介面調用，直接用H5調用沒弄過，很多人說兼容性不好，很多人覺得盡量集成的微信裡面做

，微信本身就提供了掃一掃的js ，直接自己在瀏覽器里h5 做掃一掃是沒必要

的因為沒應用場景，在網上看了一位技術大牛親測有效的案例:web/html5調用攝像頭實現二維碼掃描,需要有後端代碼的支持:http://blog.csdn.net/xuewufeifang/article/details/49756099

這是一片以講解的方式，幫助大家來理解微信官方的文檔，同時給出調用掃一掃的例子。微信調用jssdk在網頁端實現調用掃一掃，java+jsp；http://blog.csdn.net/u011327333/article/details/50439462 ;微信官方技術文檔jssdk：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

HTML5網頁如何調用瀏覽器APP的微信分享功能？

最近有看到新浪的移動端網頁，增加了微信分享功能。在瀏覽器APP（Safari除外）中可以直接調用微信APP，分享至朋友圈或者聊天窗口。並不像很多網站是通過彈出一個圖片提示右上角分享。並不是通過微信介面實現的，而是直接調用了瀏覽器APP自帶的微信分享功能。比如我用安卓手機自帶webkit內核瀏覽器（原生瀏覽器沒有微信分享功能），打開新浪文章頁，就不會出現這個微信分享的功能按鈕。那麼,用HTML5寫的頁面怎麼獲得微信介面，來實現一鍵分享的功能?廢話就不多說了，直接上代碼：HTML5網頁如何調用瀏覽器APP的微信分享功能:http://blog.csdn.net/web_qdkf/article/details/50442938

其實在移動端html5手機網站調用微信分享包括：獲取網路類型。調起客戶端的圖片播放組件。調用微信掃描二維碼。判斷是否安裝對應的應用。發送郵件。分享到微信朋友圈。內容很多，我隨意摘取幾個，你們感受一下：

獲取「分享給朋友」按鈕點擊狀態及自定義分享內容介面。

獲取「分享到騰訊微博」按鈕點擊狀態及自定義分享內容介面。