Stories

Detail Return Return

自建網站對接微信公眾號 - Stories Detail


title: 自建網站對接微信公眾號
date: 2018-04-12 15:25
tags:

  • 微信公眾號,
  • PHP
  • codeigniter

categories: 技術

平常我們有些寫各種網站, 個人博客系統, 物流管理系統, 通信錄管理系統, 校園二手網站. 我們都知道, 只需要租用一個服務器, 再配置一個備案好的域名, 就可以在瀏覽器上進行訪問了.
不知大家, 不知大家有沒有想過, 將你搭的網站對接微信公眾號, 利用微信這個大用户軟件, 來為你引流呢?

| 本文環境 | 版本 |
| --- | --- |
| 操作系統 | Ubuntu 16.04.03 |
| 運行方式 | VMware虛擬機 |
| 編程語言 | PHP |
| 項目局域網地址 | http://192.168.253.1/audit |


2018-4-1523606408034.jpg

Q: 你在搞笑嗎? 不是直接在微信裏面打開的嗎?

A: 直接用微信打開是可以, 然後你在微信裏面讓用户再註冊一個賬號? 對於大部分不想麻煩的小夥伴來説, 他們會對此忘而卻步. 其實微信是提供接口, 讓你可以獲取到微信的用户名,和用户頭像的.

一般來説可以通過三種方式

  1. 使用通過的微信開放平台( 注意,不是微信公眾平台)
  2. 使用認證過的訂閲號.
  3. 使用認證過的服務號
以上方式都需要開發者認證或者微信認證

額, 那其實不是沒認證就沒得玩?

好吧, 實際是的確如此, 不過. 如果你真的只是想玩玩. 你可以去這兒. https://mp.weixin.qq.com/debu...

2018-4-1523712185351.jpg

微信測試號

優點

  • 擁有幾乎所有接口,
  • 以及享受局域網IP回調(意思就是説,可以支持局域網, 這是正式微信平台號所不具備的)
  • 發送模板消息, 不用審核.

缺點

  • 只支持最多100個用户
  • 不能設置名稱, 頭像.

對於一些只是想玩玩, 或者小規模用户的是沒有問題的.

跟我一起操作

登錄

掃碼登錄就好了;

微信token

新建php文件(啥語言都可以,自行修改)
public function token()
    {
        $nonce = $_GET['nonce'];
        $token = 'weixin';
        $timestamp = $_GET['timestamp'];
        $echostr = $_GET['echostr'];
        $signature = $_GET['signature'];
        //形成數組,然後按字典序排序
        $array = array();
        $array = array($nonce, $timestamp, $token);
        sort($array);
        //拼接成字符串,sha1加密 ,然後與signature進行校驗
        $str = sha1(implode($array));
        if ($str == $signature && $echostr) {
            //第一次接入weixin api接口的時候
            echo $echostr;
            exit;
        }
    }
然後在測試號裏填寫路徑和token, 認證成功後就可以繼續操作了

2018-4-1523713636476.jpg

TIP: 這個鏈接並不需要一直可訪問,只需要第一次認證通過就OK, 甚至認證過可以直接刪掉.

修改回調域名, 接口> 網頁授權獲取用户基本信息 > 修改

2018-4-1523781481068.jpg

只有測試號支持ip

微信的接口

接口詳情可在https://mp.weixin.qq.com/wiki...裏查看

注意:

  1. 這些接口不是簡單的對接就好了, 每次請求都需要攜帶access_token,
  2. 而獲取access_token, 每天有獲取上限.
  3. access-token具有有效期(7200s) , 過期需要重新獲取.

獲取access_token的方法https://mp.weixin.qq.com/debu...

獲取用户信息, 實現免登錄的效果

2018-4-1523714004736.jpg

在這兒我們需要三個接口

所用接口:

接口一:
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
接口二:
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
接口三:
https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN
接口四: 刷新access_token
https://api.weixin.qq.com/sns/oauth2/refresh_token?appid=APPID&grant_type=refresh_token&refresh_token=REFRESH_TOKEN

接口返回數據, 詳見https://mp.weixin.qq.com/wiki...
第一步:用户同意授權,獲取code
示例:( 注意appid, redirect_url是變量)

$str = 'http://open.weixin.qq.com/connect/oauth2/authorize?appid=wx20874ebf2ea1fc7f&redirect_uri=' . urlencode("http://192.168.253.1/audit/client/") . '&response_type=code&scope=snsapi_base&state=123#wechat_redirect';

2018-4-1523714822433.jpg

第二步:通過code換取網頁授權access_token

示例
$data = json_decode(file_get_contents("https://api.weixin.qq.com/sns/oauth2/access_token?appid=" . $this->appid . "&secret=" . $this->secret . "&code=" . $_GET['code'] . "&grant_type=authorization_code"));
注意: 此處的access_token與上面的access_token不是同一個東西

第三步: 通過access_token換取userinfo

示例
$userInfo = json_decode(file_get_contents("https://api.weixin.qq.com/sns/userinfo?access_token=" . $data->access_token . "&openid=" . $data->openid . "&lang=zh_CN"));

刷新access_token, 如果需要

這是我畫的一個請求過程圖, 可以幫助理解

enter description here

測試演示

1. 將授權url發給手機

非必需, 也可以在電腦上, 也可以寫到公眾號子菜單中點擊進入.

2. 關注測試號

不然會這樣

2018-4-1523781959421.jpg

3. 關注後點擊

2018-4-1523782005232.jpg

2018-4-1523782015976.jpg

測試號訪問成功.

額, 關於後台代碼原理就不講了.
類似於一個從微信服務器發來的表單, 登錄進了系統, 然後再把這些數據存入數據庫就好了.

正式號運行效果

2018-4-1523890856126.jpg

2018-4-1523890881266.jpg

Add a new Comments

Some HTML is okay.