h5調用底層接口的一些知識

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

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

h5調用本地攝像頭

     前端時間使用HTML5作了一個WEB端APP，其中用到了H5頁面調用手機攝像頭的功能，當時也是花了很多時間去研究。最終是採用了HTML5plus（HTML5+）的方式完成了該功能，現將具體方法簡單介紹下，並講解下使用的注意事項。放在服務器上而後瀏覽就能夠了，只支持Chrome和Safari核的瀏覽器，QQ瀏覽器，Chrome，Safari瀏覽器均可以。在不一樣的手機和瀏覽器上面展示的方式不同。這是html5官方文檔地址，裏面有關於h5或js調用攝像頭的所有方法http://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手機網站調用微信分享包括 ：獲取網絡類型。調起客戶端的圖片播放組件。調用微信掃描二維碼。判斷是否安裝對應的應用。發送郵件。分享到微信朋友圈。內容不少，我隨意摘取幾個，大家感覺一下：

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

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

文末福利：

福利一：前端，Java，產品經理，微信小程序，Python等10G資源合集大放送：https://www.jianshu.com/p/e8197d4d9880

福利二：微信小程序入門與實戰全套詳細視頻教程。

【領取方法】

關注 【編程微刊】微信公衆號：

回覆【小程序demo】一鍵領取130個微信小程序源碼demo資源。

回覆【領取資源】一鍵領取前端，Java，產品經理，微信小程序，Python等資源合集10G資源大放送。

原文做者：祈澈姑娘
原文連接：https://www.jianshu.com/u/05f416aefbe1
創做不易，轉載請告知

90後前端妹子，愛編程，愛運營，愛折騰。堅持總結工做中遇到的技術問題，堅持記錄工做中所所思所見，歡迎你們一塊兒探討交流。