以下流程是以rails項目為準

Gem源添加

gem 'wx_pay'
gem 'weixin_authorize'
gem agent_orange

配置文件初始化

wx_pay.rb

$client = WeixinAuthorize::Client.new(WxPay.appid, WxPay.appsecret)
# required
# dunkhome config data
WxPay.appid = '此處配置微信公眾號ID'
WxPay.key = '此處配置微信支付商戶API密鑰' # 微信支付商戶平臺--> API安全--> API密鑰
WxPay.mch_id = '微信支付商戶號'
WxPay.debug_mode = true # default is true

# cert, see https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=4_3
# using PCKS12
#WxPay.set_apiclient_by_pkcs12(File.read(pkcs12_filepath), pass)

# if you want to use "generate_authorize_req" and "authenticate"
WxPay.appsecret = '此處配置微信公眾要密鑰' # 目的：獲取用戶 授權信息

# optional - configurations for RestClient timeout, etc.
WxPay.extra_rest_client_options = {timeout: 2, open_timeout: 3}

Use

Helper Method

 def get_prepay_id(request_ip, open_id)
    wx_params = {  
    :out_trade_no => "test_no_01",
    :body => "test",
    :total_fee => 1, # 需要轉換為分
    :spbill_create_ip => request_ip,
    :notify_url => "http://example.com/notify",
    :trade_type => "JSAPI",
    :nonce_str => "隨機子串",
    :openid => open_id   # 用戶公眾號唯一id
    } 
    res = WxPay::Service.invoke_unifiedorder(wx_params)
    return res.success? ? res["prepay_id"] : nil 
end

Action

      #支付參數
      @wx_pay = {
      :appId => WxPay.appid,
      :timeStamp => Time.now.to_i.to_s,    
      :nonceStr => SecureRandom.hex,
      :package => "prepay_id=#{@order.get_prepay_id(request.ip, open_id)}",
      :signType => "MD5"
      }
      @pay_sign = WxPay::Sign.generate(@wx_pay)    # 簽名生成
      @sign_package = Wechat.client.get_jssign_package(request.url)

View WeixinJS initialize

  wx.config({
  debug: false,
  appId: "<%= @sign_package['appId'] %>",
  timestamp: "<%= @sign_package['timestamp'] %>",
  nonceStr: "<%= @sign_package['nonceStr'] %>",
  signature: "<%= @sign_package['signature'] %>",
  jsApiList: ['chooseWXPay' ]
});
$pay.click(function(){
  wx.chooseWXPay({
    "timestamp": "<%= @wx_pay[:timeStamp] %>",
    "nonceStr": "<%= @wx_pay[:nonceStr] %>",
    "package": "<%= @wx_pay[:package] %>",
    "signType": "<%= @wx_pay[:signType] %>",
    "paySign": "<%= @pay_sign %>", // 支付簽名
    success: function (res) {
      // 支付成功回調;
    }
  });
  return false;
});

流程到這里就ok了，按照開發(fā)者自己的設計加缘，點擊支付時傍睹，就能喚起微信的支付了。
PS：轉載記得注明出處哦纸厉！