H5頁面\PC端實現QQ客服功能

1.背景

很多應用都有在線客服,最簡單是實現就是利用人們常用的QQ

2.實現

步驟一:授權QQ通訊組件(普通QQ都是可以的)

授權鏈接:https://shang.qq.com/v3/widget.html

登錄後,按照頁面引導授權即可,很簡單

只要把圖中的鏈接放入到應用中即可,不過PC端與H5頁面不一樣

具體代碼如下:

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
</head>     

<h2>PC端客服</h2>
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=851298348&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:851298348:41" alt="點擊這裏給我發消息" title="點擊這裏給我發消息"/></a>


<h2>移動端客服</h2>     
<a href="mqqwpa://im/chat?chat_type=wpa&uin=851298348&version=1&src_type=web&web_src=baidu.com"><img border="0" src="http://wpa.qq.com/pa?p=2:851298348:41" alt="點擊這裏給我發消息" title="點擊這裏給我發消息"/></a>
     
</html>

 

3.測試

將頁面在PC瀏覽器中打開如下,點擊即可喚起QQ

 

 注意:如果要測試移動端打開,需要在非微信瀏覽器中打開.

完美!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章