小程序-demo:小程序示例

ylbtech-小程序-demo:小程序示例

 

 
 

 

1.返回頂部
0、
一、app.js
const openIdUrl = require('./config').openIdUrl

App({
  onLaunch: function () {
    console.log('App Launch')
  },
  onShow: function () {
    console.log('App Show')
  },
  onHide: function () {
    console.log('App Hide')
  },
  globalData: {
    hasLogin: false,
    openid: null
  },
  // lazy loading openid
  getUserOpenId: function(callback) {
    var self = this

    if (self.globalData.openid) {
      callback(null, self.globalData.openid)
    } else {
      wx.login({
        success: function(data) {
          wx.request({
            url: openIdUrl,
            data: {
              code: data.code
            },
            success: function(res) {
              console.log('拉取openid成功', res)
              self.globalData.openid = res.data.openid
              callback(null, self.globalData.openid)
            },
            fail: function(res) {
              console.log('拉取用戶openid失敗,將沒法正常使用開放接口等服務', res)
              callback(res)
            }
          })
        },
        fail: function(err) {
          console.log('wx.login 接口調用失敗,將沒法正常使用開放接口等服務', err)
          callback(err)
        }
      })
    }
  }
})
二、app.json
{
  "pages": [
    "page/component/index",

    "page/component/pages/view/view",
    "page/component/pages/scroll-view/scroll-view",
    "page/component/pages/swiper/swiper",

    "page/component/pages/text/text",
    "page/component/pages/icon/icon",
    "page/component/pages/progress/progress",

    "page/component/pages/button/button",
    "page/component/pages/checkbox/checkbox",
    "page/component/pages/form/form",
    "page/component/pages/input/input",
    "page/component/pages/label/label",
    "page/component/pages/picker/picker",
    "page/component/pages/radio/radio",
    "page/component/pages/slider/slider",
    "page/component/pages/switch/switch",
    "page/component/pages/textarea/textarea",

    "page/component/pages/navigator/navigator",
    "page/component/pages/navigator/navigate",
    "page/component/pages/navigator/redirect",

    "page/component/pages/image/image",
    "page/component/pages/audio/audio",
    "page/component/pages/video/video",

    "page/component/pages/map/map",

    "page/component/pages/canvas/canvas",



    "page/API/index",

    "page/API/pages/login/login",
    "page/API/pages/get-user-info/get-user-info",
    "page/API/pages/request-payment/request-payment",
    "page/API/pages/share/share",
    "page/API/pages/custom-message/custom-message",
    "page/API/pages/template-message/template-message",

    "page/API/pages/set-navigation-bar-title/set-navigation-bar-title",
    "page/API/pages/navigation-bar-loading/navigation-bar-loading",
    "page/API/pages/navigator/navigator",
    "page/API/pages/pull-down-refresh/pull-down-refresh",
    "page/API/pages/animation/animation",

    "page/API/pages/action-sheet/action-sheet",
    "page/API/pages/modal/modal",
    "page/API/pages/toast/toast",

    "page/API/pages/get-network-type/get-network-type",
    "page/API/pages/get-system-info/get-system-info",
    "page/API/pages/on-compass-change/on-compass-change",
    "page/API/pages/make-phone-call/make-phone-call",
    "page/API/pages/scan-code/scan-code",


    "page/API/pages/request/request",
    "page/API/pages/web-socket/web-socket",
    "page/API/pages/upload-file/upload-file",
    "page/API/pages/download-file/download-file",


    "page/API/pages/image/image",
    "page/API/pages/voice/voice",
    "page/API/pages/file/file",
    "page/API/pages/on-accelerometer-change/on-accelerometer-change",
    "page/API/pages/canvas/canvas",
    "page/API/pages/background-audio/background-audio",
    "page/API/pages/video/video",

    "page/API/pages/get-location/get-location",
    "page/API/pages/open-location/open-location",
    "page/API/pages/choose-location/choose-location",

    "page/API/pages/storage/storage"
  ],
  "window": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "演示",
    "navigationBarBackgroundColor": "#F8F8F8",
    "backgroundColor": "#F8F8F8"
  },
  "tabBar": {
    "color": "#7A7E83",
    "selectedColor": "#3cc51f",
    "borderStyle": "black",
    "backgroundColor": "#ffffff",
    "list": [{
      "pagePath": "page/component/index",
      "iconPath": "image/icon_component.png",
      "selectedIconPath": "image/icon_component_HL.png",
      "text": "組件"
    }, {
      "pagePath": "page/API/index",
      "iconPath": "image/icon_API.png",
      "selectedIconPath": "image/icon_API_HL.png",
      "text": "接口"
    }]
  },
  "networkTimeout": {
    "request": 10000,
    "connectSocket": 10000,
    "uploadFile": 10000,
    "downloadFile": 10000
  },
  "debug": false
}
三、app.wxss
/* reset */
page {
  background-color: #F8F8F8;
  height: 100%;
  font-size: 32rpx;
  line-height: 1.6;
}
checkbox, radio{
  margin-right: 10rpx;
}
button{
  margin-top: 20rpx;
  margin-bottom: 20rpx;
}
form{
  width: 100%;
}

/* lib */
.strong{
  font-weight: bold;
}
.tc{
  text-align: center;
}

/* page */
.container {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  justify-content: space-between;
  font-size: 32rpx;
  font-family: -apple-system-font,Helvetica Neue,Helvetica,sans-serif;
}
.page-head{
  padding: 60rpx 50rpx 80rpx;
  text-align: center;
}
.page-head-title{
  display: inline-block;
  padding: 0 40rpx 20rpx 40rpx;
  font-size: 32rpx;
  color: #BEBEBE;
}
.page-head-line{
  margin: 0 auto;
  width: 150rpx;
  height: 2rpx;
  background-color: #D8D8D8;
}
.page-head-desc{
  padding-top: 20rpx;
  color: #9B9B9B;
  font-size: 32rpx;
}

.page-body {
  width: 100%;
  flex-grow: 1;
  overflow-x: hidden;
}
.page-body-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.page-body-wording {
  text-align: center;
  padding: 200rpx 100rpx;
}
.page-body-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
  width: 100%;
  padding: 50rpx 0 150rpx 0;
}
.page-body-title {
  margin-bottom: 100rpx;
  font-size: 32rpx;
}
.page-body-text {
  font-size: 30rpx;
  line-height: 26px;
  color: #ccc;
}
.page-body-text-small {
  font-size: 24rpx;
  color: #000;
  margin-bottom: 100rpx;
}

.page-foot{
  margin: 100rpx 0 30rpx 0;
  text-align: center;
  color: #1aad19;
  font-size: 0;
}
.icon-foot{
  width: 152rpx;
  height: 23rpx;
}

.page-section{
  width: 100%;
  margin-bottom: 60rpx;
}
.page-section_center{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page-section:last-child{
  margin-bottom: 0;
}
.page-section-gap{
  box-sizing: border-box;
  padding: 0 30rpx;
}
.page-section-spacing{
  box-sizing: border-box;
  padding: 0 80rpx;
}
.page-section-title{
  font-size: 28rpx;
  color: #999999;
  margin-bottom: 10rpx;
  padding-left: 30rpx;
  padding-right: 30rpx;
}
.page-section-gap .page-section-title{
  padding-left: 0;
  padding-right: 0;
}
.page-section-ctn{

}

/* widget */
.btn-area{
  margin-top: 60rpx;
  box-sizing: border-box;
  width: 100%;
  padding: 0 30rpx;
}

.image-plus {
  width: 150rpx;
  height: 150rpx;
  border: 2rpx solid #D9D9D9;
  position: relative;
}
.image-plus-nb{
  border: 0;
}
.image-plus-text{
  color: #888888;
  font-size: 28rpx;
}
.image-plus-horizontal {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #d9d9d9;
  width: 4rpx;
  height: 80rpx;
  transform: translate(-50%, -50%);
}
.image-plus-vertical {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #d9d9d9;
  width: 80rpx;
  height: 4rpx;
  transform: translate(-50%, -50%);
}

.demo-text-1{
  position: relative;
  align-items: center;
  justify-content: center;
  background-color: #1AAD19;
  color: #FFFFFF;
  font-size: 36rpx;
}
.demo-text-1:before{
  content: 'A';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.demo-text-2{
  position: relative;
  align-items: center;
  justify-content: center;
  background-color: #2782D7;
  color: #FFFFFF;
  font-size: 36rpx;
}
.demo-text-2:before{
  content: 'B';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.demo-text-3{
  position: relative;
  align-items: center;
  justify-content: center;
  background-color: #F1F1F1;
  color: #353535;
  font-size: 36rpx;
}
.demo-text-3:before{
  content: 'C';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
四、config.js
/**
 * 小程序配置文件
 */

// 此處主機域名是騰訊雲解決方案分配的域名
// 小程序後臺服務解決方案:https://www.qcloud.com/solution/la

var host = "14592619.qcloud.la"

var config = {

    // 下面的地址配合雲端 Server 工做
    host,

    // 登陸地址,用於創建會話
    loginUrl: `https://${host}/login`,

    // 測試的請求地址,用於測試會話
    requestUrl: `https://${host}/testRequest`,

    // 用code換取openId
    openIdUrl: `https://${host}/openid`,

    // 測試的信道服務接口
    tunnelUrl: `https://${host}/tunnel`,

    // 生成支付訂單的接口
    paymentUrl: `https://${host}/payment`,

    // 發送模板消息接口
    templateMessageUrl: `https://${host}/templateMessage`,

    // 上傳文件接口
    uploadFileUrl: `https://${host}/upload`,

    // 下載示例圖片接口
    downloadExampleUrl: `https://${host}/static/weapp.jpg`
};

module.exports = config
四、project.config.json
{
    "description": "項目配置文件。",
    "setting": {
        "urlCheck": true,
        "es6": true,
        "postcss": true,
        "minified": true,
        "newFeature": true
    },
    "compileType": "miniprogram",
    "libVersion": "1.6.4",
    "appid": "wx7d22ab7088f2db6a",
    "projectname": "wechatApp",
    "condition": {
        "search": {
            "current": -1,
            "list": []
        },
        "conversation": {
            "current": -1,
            "list": []
        },
        "miniprogram": {
            "current": -1,
            "list": []
        }
    }
}
五、image
六、page
七、utll
-util.js
function formatTime(time) {
  if (typeof time !== 'number' || time < 0) {
    return time
  }

  var hour = parseInt(time / 3600)
  time = time % 3600
  var minute = parseInt(time / 60)
  time = time % 60
  var second = time

  return ([hour, minute, second]).map(function (n) {
    n = n.toString()
    return n[1] ? n : '0' + n
  }).join(':')
}

function formatLocation(longitude, latitude) {
  if (typeof longitude === 'string' && typeof latitude === 'string') {
    longitude = parseFloat(longitude)
    latitude = parseFloat(latitude)
  }

  longitude = longitude.toFixed(2)
  latitude = latitude.toFixed(2)

  return {
    longitude: longitude.toString().split('.'),
    latitude: latitude.toString().split('.')
  }
}

module.exports = {
  formatTime: formatTime,
  formatLocation: formatLocation
}
八、vendor
九、
2. vendor返回頂部
一、qcloud-weapp-client-sdk
1.一、lib
-constants.js
module.exports = {
    WX_HEADER_CODE: 'X-WX-Code',
    WX_HEADER_ENCRYPTED_DATA: 'X-WX-Encrypted-Data',
    WX_HEADER_IV: 'X-WX-IV',
    WX_HEADER_ID: 'X-WX-Id',
    WX_HEADER_SKEY: 'X-WX-Skey',

    WX_SESSION_MAGIC_ID: 'F2C224D4-2BCE-4C64-AF9F-A6D872000D1A',

    ERR_INVALID_PARAMS: 'ERR_INVALID_PARAMS',

    ERR_WX_LOGIN_FAILED: 'ERR_WX_LOGIN_FAILED',
    ERR_WX_GET_USER_INFO: 'ERR_WX_GET_USER_INFO',
    ERR_LOGIN_TIMEOUT: 'ERR_LOGIN_TIMEOUT',
    ERR_LOGIN_FAILED: 'ERR_LOGIN_FAILED',
    ERR_LOGIN_SESSION_NOT_RECEIVED: 'ERR_LOGIN_MISSING_SESSION',

    ERR_INVALID_SESSION: 'ERR_INVALID_SESSION',
    ERR_CHECK_LOGIN_FAILED: 'ERR_CHECK_LOGIN_FAILED',
};
-login.js
-request.js
var constants = require('./constants');
var utils = require('./utils');
var Session = require('./session');
var loginLib = require('./login');

var noop = function noop() {};

var buildAuthHeader = function buildAuthHeader(session) {
    var header = {};

    if (session && session.id && session.skey) {
        header[constants.WX_HEADER_ID] = session.id;
        header[constants.WX_HEADER_SKEY] = session.skey;
    }

    return header;
};

/***
 * @class
 * 表示請求過程當中發生的異常
 */
var RequestError = (function () {
    function RequestError(type, message) {
        Error.call(this, message);
        this.type = type;
        this.message = message;
    }

    RequestError.prototype = new Error();
    RequestError.prototype.constructor = RequestError;

    return RequestError;
})();

function request(options) {
    if (typeof options !== 'object') {
        var message = '請求傳參應爲 object 類型,但實際傳了 ' + (typeof options) + ' 類型';
        throw new RequestError(constants.ERR_INVALID_PARAMS, message);
    }

    var requireLogin = options.login;
    var success = options.success || noop;
    var fail = options.fail || noop;
    var complete = options.complete || noop;
    var originHeader = options.header || {};

    // 成功回調
    var callSuccess = function () {
        success.apply(null, arguments);
        complete.apply(null, arguments);
    };

    // 失敗回調
    var callFail = function (error) {
        fail.call(null, error);
        complete.call(null, error);
    };

    // 是否已經進行太重試
    var hasRetried = false;

    if (requireLogin) {
        doRequestWithLogin();
    } else {
        doRequest();
    }

    // 登陸後再請求
    function doRequestWithLogin() {
        loginLib.login({ success: doRequest, fail: callFail });
    }

    // 實際進行請求的方法
    function doRequest() {
        var authHeader = buildAuthHeader(Session.get());

        wx.request(utils.extend({}, options, {
            header: utils.extend({}, originHeader, authHeader),

            success: function (response) {
                var data = response.data;

                // 若是響應的數據裏面包含 SDK Magic ID,表示被服務端 SDK 處理過,此時必定包含登陸態失敗的信息
                if (data && data[constants.WX_SESSION_MAGIC_ID]) {
                    // 清除登陸態
                    Session.clear();

                    var error, message;
                    if (data.error === constants.ERR_INVALID_SESSION) {
                        // 若是是登陸態無效,而且還沒重試過,會嘗試登陸後刷新憑據從新請求
                        if (!hasRetried) {
                            hasRetried = true;
                            doRequestWithLogin();
                            return;
                        }

                        message = '登陸態已過時';
                        error = new RequestError(data.error, message);

                    } else {
                        message = '鑑權服務器檢查登陸態發生錯誤(' + (data.error || 'OTHER') + '):' + (data.message || '未知錯誤');
                        error = new RequestError(constants.ERR_CHECK_LOGIN_FAILED, message);
                    }

                    callFail(error);
                    return;
                }

                callSuccess.apply(null, arguments);
            },

            fail: callFail,
            complete: noop,
        }));
    };

};

module.exports = {
    RequestError: RequestError,
    request: request,
};
-session.js
var constants = require('./constants');
var SESSION_KEY = 'weapp_session_' + constants.WX_SESSION_MAGIC_ID;

var Session = {
    get: function () {
        return wx.getStorageSync(SESSION_KEY) || null;
    },

    set: function (session) {
        wx.setStorageSync(SESSION_KEY, session);
    },

    clear: function () {
        wx.removeStorageSync(SESSION_KEY);
    },
};

module.exports = Session;
-utils.js
/**
 * 拓展對象
 */
exports.extend = function extend(target) {
    var sources = Array.prototype.slice.call(arguments, 1);

    for (var i = 0; i < sources.length; i += 1) {
        var source = sources[i];
        for (var key in source) {
            if (source.hasOwnProperty(key)) {
                target[key] = source[key];
            }
        }
    }

    return target;
};
-wxTunnel.js
/* istanbul ignore next */
const noop = () => void(0);

let onOpen, onClose, onMessage, onError;

/* istanbul ignore next */
function listen(listener) {
    if (listener) {
        onOpen = listener.onOpen;
        onClose = listener.onClose;
        onMessage = listener.onMessage;
        onError = listener.onError;
    } else {
        onOpen = noop;
        onClose = noop;
        onMessage = noop;
        onError = noop;
    }
}

/* istanbul ignore next */
function bind() {
    wx.onSocketOpen(result => onOpen(result));
    wx.onSocketClose(result => onClose(result));
    wx.onSocketMessage(result => onMessage(result));
    wx.onSocketError(error => onError(error));
}

listen(null);
bind();

module.exports = { listen };
1.二、.bower.json
{
  "name": "qcloud-weapp-client-sdk",
  "description": "QCloud 微信小程序客戶端 SDK",
  "main": "index.js",
  "authors": [
    "Tencent Cloud"
  ],
  "license": "MIT",
  "keywords": [
    "qcloud",
    "weapp",
    "wechat",
    "sdk",
    "client",
    "auth",
    "websocket"
  ],
  "homepage": "https://github.com/tencentyun/weapp-client-sdk",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests",
    "typings.json",
    "jsconfig.json",
    "package.json",
    ".npmignore",
    ".travis.yml",
    ".gitignore"
  ],
  "version": "0.8.2",
  "_release": "0.8.2",
  "_resolution": {
    "type": "version",
    "tag": "v0.8.2",
    "commit": "0944545afe0b6bc4aec8c39e8437dbe95a07a8d9"
  },
  "_source": "https://github.com/tencentyun/weapp-client-sdk.git",
  "_target": "*",
  "_originalSource": "qcloud-weapp-client-sdk"
}
1.三、LICENSE
1.四、README.md
# 微信小程序客戶端騰訊雲加強 SDK

[![Build Status](https://travis-ci.org/tencentyun/wafer-client-sdk.svg?branch=master)](https://travis-ci.org/tencentyun/wafer-client-sdk)
[![Coverage Status](https://coveralls.io/repos/github/tencentyun/wafer-client-sdk/badge.svg?branch=master)](https://coveralls.io/github/tencentyun/wafer-client-sdk?branch=master)
[![License](https://img.shields.io/github/license/tencentyun/wafer-client-sdk.svg)](LICENSE)

本 項目是 [Wafer](https://github.com/tencentyun/wafer-solution) 的組成部分,爲小程序客戶端開發提供 SDK 支持會話服務和信道服務。

## SDK 獲取與安裝

解決方案[客戶端 Demo](https://github.com/tencentyun/wafer-client-demo) 已經集成並使用最新版的 SDK,須要快速瞭解的能夠從 Demo 開始。

若是須要單獨開始,本 SDK 已經發布爲 bower 模塊,能夠直接安裝到小程序目錄中。

```sh
npm install -g bower
bower install qcloud-weapp-client-sdk
```

安裝以後,就可使用 `require` 引用 SDK 模塊:

```js
var qcloud = require('./bower_components/qcloud-weapp-client-sdk/index.js');
```

## 會話服務

[會話服務](https://github.com/tencentyun/wafer-solution/wiki/%E4%BC%9A%E8%AF%9D%E6%9C%8D%E5%8A%A1)讓小程序擁有會話管理能力。

### 登陸

登陸能夠在小程序和服務器之間創建會話,服務器由此能夠獲取到用戶的標識和信息。

```js
var qcloud = require('./bower_components/qcloud-weapp-client-sdk/index.js');

// 設置登陸地址
qcloud.setLoginUrl('https://199447.qcloud.la/login');
qcloud.login({
    success: function (userInfo) {
        console.log('登陸成功', userInfo);
    },
    fail: function (err) {
        console.log('登陸失敗', err);
    }
});
```
本 SDK 須要配合雲端 SDK 才能提供完整會話服務。經過 [setLoginUrl](#setLoginUrl) 設置登陸地址,雲服務器在該地址上使用雲端 SDK 處理登陸請求。

> `setLoginUrl` 方法設置登陸地址以後會一直有效,所以你能夠在微信小程序啓動時設置。

登陸成功後,能夠獲取到當前微信用戶的基本信息。

### 請求

若是但願小程序的網絡請求包含會話,登陸以後使用 [request](#request) 方法進行網絡請求便可。

```js
qcloud.request({
    url: 'http://199447.qcloud.la/user',
    success: function (response) {
        console.log(response);
    },
    fail: function (err) {
        console.log(err);
    }
});
```

若是調用 `request` 以前尚未登陸,則請求不會帶有會話。`request` 方法也支持 `login` 參數支持在請求以前自動登陸。

```js
// 使用 login 參數以前,須要設置登陸地址
qcloud.setLoginUrl('https://199447.qcloud.la/login');
qcloud.request({
    login: true,
    url: 'http://199447.qcloud.la/user',
    success: function (response) {
        console.log(response);
    },
    fail: function (err) {
        console.log(err);
    }
});
```

關於會話服務詳細技術說明,請參考 [Wiki](https://github.com/tencentyun/wafer-solution/wiki/%E4%BC%9A%E8%AF%9D%E6%9C%8D%E5%8A%A1)。

## 信道服務

[信道服務](https://github.com/tencentyun/wafer-solution/wiki/%E4%BF%A1%E9%81%93%E6%9C%8D%E5%8A%A1)小程序支持利用騰訊雲的信道資源使用 WebSocket 服務。

```js
// 建立信道,須要給定後臺服務地址
var tunnel = this.tunnel = new qcloud.Tunnel('https://199447.qcloud.la/tunnel');

// 監聽信道內置消息,包括 connect/close/reconnecting/reconnect/error
tunnel.on('connect', () => console.log('WebSocket 信道已鏈接'));
tunnel.on('close', () => console.log('WebSocket 信道已斷開'));
tunnel.on('reconnecting', () => console.log('WebSocket 信道正在重連...'));
tunnel.on('reconnect', () => console.log('WebSocket 信道重連成功'));
tunnel.on('error', error => console.error('信道發生錯誤:', error));

// 監聽自定義消息(服務器進行推送)
tunnel.on('speak', speak => console.log('收到 speak 消息:', speak));

// 打開信道
tunnel.open();
// 發送消息
tunnel.emit('speak', { word: "hello", who: { nickName: "techird" }});
// 關閉信道
tunnel.close();
```

信道服務一樣須要業務服務器配合雲端 SDK 支持,構造信道實例的時候須要提供業務服務器提供的信道服務地址。經過監聽信道消息以及自定義消息來經過信道實現業務。

關於信道使用的更完整實例,建議參考客戶端 Demo 中的[三木聊天室應用源碼](https://github.com/tencentyun/wafer-client-demo/blob/master/pages/chat/chat.js)。

關於信道服務詳細技術說明,請參考 [Wiki](https://github.com/tencentyun/wafer-solution/wiki/%E4%BF%A1%E9%81%93%E6%9C%8D%E5%8A%A1)。

## API


### setLoginUrl
設置會話服務登陸地址。

#### 語法
```js
qcloud.setLoginUrl(loginUrl);
```

#### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|loginUrl     |string         |會話服務登陸地址

### login
登陸,創建微信小程序會話。

#### 語法
```js
qcloud.login(options);
```

#### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|options      |PlainObject    |會話服務登陸地址
|options.success | () => void | 登陸成功的回調
|options.error | (error) => void | 登陸失敗的回調


### request
進行帶會話的請求。

#### 語法
```js
qcloud.request(options);
```

#### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|options      |PlainObject    | 會話服務登陸地址
|options.login | bool         | 是否自動登陸以獲取會話,默認爲 false
|options.url   | string       | 必填,要請求的地址
|options.header | PlainObject | 請求頭設置,不容許設置 Referer
|options.method | string      | 請求的方法,默認爲 GET
|options.success | (response) => void | 登陸成功的回調。<ul><li>`response.statusCode`:請求返回的狀態碼</li><li>`response.data`:請求返回的數據</li></ul>
|options.error | (error) => void | 登陸失敗的回調
|options.complete | () => void | 登陸完成後回調,不管成功仍是失敗

### Tunnel

表示一個信道。因爲小程序的限制,同一時間只能有一個打開的信道。

#### constructor

##### 語法
```js
var tunnel = new Tunnel(tunnelUrl);
```

#### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|tunnelUrl    |String         | 會話服務登陸地址


#### on
監聽信道上的事件。信道上事件包括系統事件和服務器推送消息。

##### 語法
```js
tunnel.on(type, listener);
```

##### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|type         |string         | 監聽的事件類型
|listener     |(message?: any) => void | 監聽器,具體類型的事件發生時調用監聽器。若是是消息,則會有消息內容。

##### 事件
|事件         |說明
|-------------|-------------------------------
|connect      |信道鏈接成功後回調
|close        |信道關閉後回調
|reconnecting |信道發生重連時回調
|reconnected  |信道重連成功後回調
|error        |信道發生錯誤後回調
|[message]    |信道服務器推送過來的消息類型,若是消息類型和上面內置的時間類型衝突,須要在監聽的時候在消息類型前加 `@`
|\*           |監聽全部事件和消息,監聽器第一個參數接收到時間或消息類型 

#### open
打開信道,創建鏈接。因爲小程序的限制,同一時間只能有一個打開的信道。

##### 語法
```js
tunnel.open();
```

#### emit
向信道推送消息。

##### 語法
```js
tunnel.emit(type, content);
```

##### 參數
|參數         |類型           |說明
|-------------|---------------|--------------
|type         |string         | 要推送的消息的類型
|content      |any            | 要推送的消息的內容

#### close
關閉信道

##### 語法
```js
tunnel.close();
```

## LICENSE

[MIT](LICENSE)
1.五、bower.json
{
  "name": "qcloud-weapp-client-sdk",
  "description": "QCloud 微信小程序客戶端 SDK",
  "main": "index.js",
  "authors": [
    "Tencent Cloud"
  ],
  "license": "MIT",
  "keywords": [
    "qcloud",
    "weapp",
    "wechat",
    "sdk",
    "client",
    "auth",
    "websocket"
  ],
  "homepage": "",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests",
    "typings.json",
    "jsconfig.json",
    "package.json",
    ".npmignore",
    ".travis.yml",
    ".gitignore"
  ]
}
1.六、index.js
var constants = require('./lib/constants');
var login = require('./lib/login');
var Session = require('./lib/session');
var request = require('./lib/request');
var Tunnel = require('./lib/tunnel');

var exports = module.exports = {
    login: login.login,
    setLoginUrl: login.setLoginUrl,
    LoginError: login.LoginError,

    clearSession: Session.clear,

    request: request.request,
    RequestError: request.RequestError,

    Tunnel: Tunnel,
};

// 導出錯誤類型碼
Object.keys(constants).forEach(function (key) {
    if (key.indexOf('ERR_') === 0) {
        exports[key] = constants[key];
    }
});
二、
3. page返回頂部
 
4.返回頂部
 
5.返回頂部
一、
二、
 
6.返回頂部
 
warn 做者:ylbtech
出處:http://ylbtech.cnblogs.com/
本文版權歸做者和博客園共有,歡迎轉載,但未經做者贊成必須保留此段聲明,且在文章頁面明顯位置給出原文鏈接,不然保留追究法律責任的權利。
相關文章
相關標籤/搜索