wechat_gate

WechatGate

WeChat public platform development library

Supported interfaces:

• access_token (used by backend API)
• Obtaining user authorization information (OAuth2)
• JS-SDK
• Reply message encapsulation
• Menu interface
• Material interface

Features:

• Automatically manage ticket refresh and expiration of access_token and JS-SDK
• Support multiple WeChat public accounts
• Multi-environment support (development, production) to facilitate local testing
• Controller and helper methods (WeChat session management, etc.)
• Simple interface and easy customization

Usage video tutorial: WeChat public account development

Installation

Add this line to your application's Gemfile:

 gem 'wechat-gate'

And then execute:

 $ bundle

Or install it yourself as:

 $ gem install wechat-gate

Official account

Before starting work, you need to make the following configurations on the WeChat public account platform:

1. Open your official account (service account) and activate WeChat authentication (300 yuan authentication service fee)
2. Set the security domain name of your JS interface in the "Official Account Settings" - "Function Settings" in the background of the official account, which is the domain name of the website called by your official account
3. Set your authorization callback page domain name in "Interface Permissions" - "Web Page Authorization to Obtain Basic User Information". This is used for callback domain name authentication of OAuth2.
4. View and configure your AppID and AppSecret in "Basic Configuration"

Configuration

Create the file wechat.yml in the Rails project config directory and configure your official account information.

 # 区分不同的环境
eggman:
  development:
    host: http://wechat-test1.eggman.tv

    wechat_id: xxxxxxxxxx
    app_id: xxxxxxxxxx
    app_secret: xxxxxxxxxx

    oauth2_redirect_uri: "http://wechat-test1.eggman.tv/wechat/users/callback"

    push_url: "http://wechat-test1.eggman.tv/wechat/push"
    push_token: xxxxxxxxxxxxxxxxxxxx
  production:
    host: https://eggman.tv

    wechat_id: xxxxxxxxxx
    app_id: xxxxxxxxxxxxxxxxxxxx
    app_secret: xxxxxxxxxxxxxxxxxxxxxxxxxx

# 如果不需要多环境支持，也可以这样
app_name:
  app_id: <%= ENV['WECHAT_APP_NAME_APP_ID'] %>
  app_secret: <%= ENV['WECHAT_APP_NAME_APP_SECRET'] %>
  oauth2_redirect_uri: <%= ENV['WECHAT_APP_NAME_OAUTH2_REDIRECT_URI'] %>

Then specify the name of the official account to be read in the ApplicationController:

 self.wechat_gate_app_name = 'eggman'

Backend call

Background API operations (such as WeChat user information acquisition, etc.).

By default, the configuration has been initialized in the controller, the method is wechat_gate_config , just use it directly.

 wechat_gate_config . users # 获取用户列表
wechat_gate_config . user ( 'ONE_OPEN_ID' ) # 获取一个用户的详细信息
wechat_gate_config . access_token # 获取当前access_token

# OAuth 2
wechat_gate_config . oauth2_entrance_url ( scope : "snsapi_userinfo" , state : "CURENT_STATE" ) # 获取当前OAuth2授权入口URL
wechat_gate_config . oauth2_access_token ( "TOKEN" ) # 根据OAuth2返回的TOKEN获取access_token
wechat_gate_config . oauth2_user ( "ACCESS_TOKEN" , "ONE_OPEN_ID" ) # 获取一个用户的信息

wechat_gate_config . medias # 获取素材列表, 参数type: image | video | voice | news (图文)

wechat_gate_config . menu_get # 获取菜单
wechat_gate_config . menu_create ( MENU_HASH ) # 创建菜单

wechat_gate_config . generate_js_request_params ( REFERER_URL ) # 返回JS-SDK的验证参数，供前端JS-SDK使用

Of course, you can also initialize the configuration manually, or even specify the path to the configuration file:

 config = WechatGate::Config.new('eggman', '/path/to/what/ever/you/want.yml')

Both access_token and tickets in JS_SDK have expiration time and refresh times limit, which have been considered here. You don’t need to worry about it. If you want to refresh manually, you can do this:

 config.refresh_access_token
config.refresh_jsapi_ticket

Configuration file supports erb

For more interfaces and documentation, please look directly at the source code, which is written in great detail.

JS-SDK

  def ticket
    url = CGI . unescape ( params [ :url ] ) # 微信中用户访问的页面
    @data = wechat_gate_config . generate_js_request_params ( url ) # 生成微信JS-SDK所需的jsapi_ticket，signature等等参数供前段js使用
    render content_type : "application/javascript"
  end

ticket.js.erb:

 var wxServerConfig = <%= @data.to_json.html_safe %>;
<%= params[:callback] %>();

Then introduce the following code on the WeChat page:

 ( function ( ) {
  var ticket = document . createElement ( "script" ) ;
  ticket . src = "http://localhost/api/wechat_ticket/ticket.js?url=" + encodeURIComponent ( window . location . href . split ( '#' ) [ 0 ] ) + "&callback=wxCallback" ;
  var s = document . getElementsByTagName ( "script" ) [ 0 ] ;
  s . parentNode . insertBefore ( ticket , s ) ;
} ) ( ) ; 

Other functions

Custom menu

First set the menu configuration file, config/wechat_menu.yml, which supports erb. For the format, please refer to the WeChat custom menu document:

 button:
  - type: view
    name: 我的2
    url: <%= @config.oauth2_entrance_url(scope: 'snsapi_userinfo', state: 'profile') %>
  - type: view
    name: 课程
    sub_button:
      - type: view
        name: 免费课程
        url:  <%= @config.oauth2_entrance_url(scope: 'snsapi_userinfo', state: 'free') %>
      - type: view
        name: 付费课程
        url:  <%= @config.oauth2_entrance_url(scope: 'snsapi_userinfo', state: 'paid') %>

The **@config** variable is the current WeChat public account instance. Please do not modify it and use it directly.

Then execute the rake task:

 $rails wechat_gate:create_menu APP_NAME=eggman CONFIG=/path/to/wechat.yml MENU=/path/to/wechat_menu.yml

Among them, CONFIG defaults to config/wechat.yml, MENU defaults to config/wechat_menu.yml, and APP_NAME must be specified.

TODO

Add test