@acheckin.io/acheckin-sdk 中文文档教程

发布于 4年前 浏览 15 项目主页 更新于 3年前

ACheckin SDK

当前 npm 包版本。

Giới thiệu ACheckin SDK

Mục lục

Yêu cầu

  • Ứng dụng ACheckin: https://acheckin.vn/
  • NodeJS & NPM (khuyên dùng) hoặc
  • dự án Web có thể chạy độc lập không cần cài đặt lên server

Cài đặt

Chúng toi hỗ trợ nhà phát triển có thể tạo mới một ứng dụng chạy trên nền tảng ACheckin với nhiều cách khác nhau。 Hãy lựa chọn một phương án mà bạn yêu thích。

Bắt đầu một dự án mới (khuyên dùng)

Bạn có thể khởi tạo một ứng dụng mới hoàn toàn bằng công cụ ACheckin CLI do chúng toi cung cấp。

Chú ý: ứng dụng được viết trên nền ReactJS。

  1. Cài đặt CLI

    npm install acheckin -global

  2. Tạo dự án mới

    acheckin init MyMiniApp
    acheckin init MyMiniApp --id com.example.miniapp --template ts

    Cú pháp
  • --template [js|ts|html] tạo project theo template javascript react (defaul) | typescript react | html
  • --id [your_bundle_id] cài đặt app ID
  1. #### Chúc mừng, bạn đã khởi tạo thành công! Nhập lệnh cd MyMiniApp && acheckin run và dùng ACheckin trên điện thoại quét mã QR được tạo trên Terminal.

Thêm ACheckin SDK vào dự án NPM / Yarn-supported có sẵn

AChekin SDK 包含在 npm / yarn 中。

Bạn có thể cài đặt bằng cú pháp

  • npm install acheckin-sdk hoặc
  • yarn add acheckin-sdk

Sau đó,tạo 文件 config.json ở thư mục public của dự án mà bạn có thể xem với url http://your-ip-address/ config.json

{
    "app_name": "tên-app-của-bạn",
    "app_id": "acheckin.miniapp.template",
    "app_flashscreen": "acheckin.png",
    "display": "fullscreen",
    "version": "0.0.1",
    "main": "index.html",
    "use_scroll": false,
    "permissions": ["basic_info"]
}

Thêm ACheckin SDK như một thư viện JS

Sẽ cập nhật sớm

Khởi chạy ứng dụng

Đối với ứng dụng tạo bằng ACheckin CLI

Thật đơn giản, hãy chạy cú pháp acheckin run và dùng ACheckin quét mã QR。

Với các ứng dụng khác

  • chạy webserver môi trường dev
  • tạo mã QR code với định dạng acheckin://app_dev?h=[your_ip_address]&p=[port] và quét mã này bằng ACheckin
  • sử dụng ACheckin CLI với cú pháp acheckin qr

⌨️ Phát triển ứng dụng

  • Import ACheckin SDK vào dự án
import { ACheckinSDK } from "acheckin-sdk";
  • Khởi tạo SDK
window.asyncACheckinInit = async () => {
    ACheckinSDK.init();
};
  • Lấy các thông tin người dùng
try {
    // Access token
    const accessToken = await ACheckinSDK.getAccessToken();

    // lấy thông tin người dùng (public)
    const userInfo = await ACheckinSDK.getUserPersonalInfo([
        "id",
        "email",
        "name"
    ]);
    // lấy thông tin người dùng (trong workspace)
    const userInfo = await ACheckinSDK.getUserWorkspaceInfo([
        "id",
        "email",
        "name"
    ]);
} catch (e) {}

Chúc mừng, bạn đã lấy được thông tin cơ bản của người dùng。

Hãy Quét mã QR trên ACheckin nhé!

Chạy ứng dụng trên Chrome

ACheckin hỗ trợ nhà phát triển có thể test ứng dụng trực tiếp trên trình duyệt với Chrome 扩展程序。 Bạn có thể cài đặt bản Beta bằng cách sau

  • Tải ACheckin Mini App Emulator tại đây
  • Giải nén và xem hướng dẫn tại đây
  • Chạy ứng dụng acheckin run và chọn biểu tượng ACheckin trên trình duyệt

Xem ảnh lớn hơn

ACheckin Emulator

Phát hành ứng dụng

Để phát hành ứng dụng trên AChekin, bạn cần đăng kí một tài khoảin tạ ACheckin Connect

Với các ứng dụng dùng ACheckin CLI

  • Đăng nhập với CLI acheckin login

  • Build và gửi bản build acheckin build

Với các ứng dụng NPM / Yarn-supported

  • Build ứng dụng yarn build hoặc npm build
  • Nén folder build và upload file zip lên ACheckin Connect

Với các ứng dụng khác

  • Nén toàn bộ file chạy ứng dụng và upload file zip lên ACheckin Connect

API Reference

  • setHeadererTitle(string) -> Promise<any> - đặt title cho header của ứng dụng
  • getAccessToken() -> Promise<string> - lấy accesstoken
  • getUserPersonalInfo(array) -> Promise<UserInfo> - lấy thông tin user public (personal)
interface UserInfo {
    id: string;
    name: string;
    picture: string;
    email: string;
    birthday: string;
    gender: "F" | "M";
}
  • getUserWorkspaceInfo(array) -> Promise<UserWorkspaceInfo> - lấy thông tin user trong workspace
interface UserWorkspaceInfo {
    id: string;
    name: string;
    picture: string;
    email: string;
    birthday: string;
    gender: "F" | "M";
    is_owner: boolean;
    is_leader: boolean;
    current_workspace: string;
}
  • setItem(key: string, value: string) -> 复制代码 Promise - lưu 字符串 vào bộ nhớ theo key

  • getItem(key: string) -> Promise - lấy value theo key

  • getDeviceInfo(Array) -> Promise - thông tin thiết bị

interface DeviceInfo {
    device_id: string;
    device_name: string;
    device_platform: string;
    bundle_id: string;
    device_os_version: string;
    is_tablet: boolean;
    ip_address: string;
    battery_level: number;
    battery_changing: boolean;
    device_mac_address: string;
    device_manufacturer: string;
    device_brand: string;
    wifi_name: string;
    is_wifi: boolean;
    has_network: string;
    is_mobile_data: boolean;
}
  • readBarCode() -> Promise - đọc QR / bar code

  • addShakeEventListener(callback) - xử lý 事件 lắc thiết bị

  • showBottomTabs - hiện thanh công cụ ở dưới màn hình

  • hideBottomTabs - ẩn thanh công cụ ở dưới màn hình

  • isCheckedIn -> Promise - kiểm tra user đã checkin vào workspace haya chưa

  • getCurrentLocation -> Promise - lấy vị trí hiện tại của user

interface Location {
    latitude: number;
    longitude: number;
}
  • shareScreen(string) - chụp màn hình và chia sẻ với 消息 tùy chọn

  • setLocalNotification({title, body , schedule_time: number}) - tạo và lên lịch hiển thị 本地通知

  • vibrate - rung thiết bị

  • getStaffOfLeader({offset, limit}) -> Promise<{total, data: {id, name, picture, email}}> - lấy danh sách nhân viên

ACheckin SDK

Current npm package version.

Giới thiệu ACheckin SDK

Mục lục

???? Yêu cầu

  • Ứng dụng ACheckin: https://acheckin.vn/
  • NodeJS & NPM (khuyên dùng) hoặc
  • dự án Web có thể chạy độc lập không cần cài đặt lên server

???? Cài đặt

Chúng tôi hỗ trợ nhà phát triển có thể tạo mới một ứng dụng chạy trên nền tảng ACheckin với nhiều cách khác nhau. Hãy lựa chọn một phương án mà bạn yêu thích.

???? Bắt đầu một dự án mới (khuyên dùng)

Bạn có thể khởi tạo một ứng dụng mới hoàn toàn bằng công cụ ACheckin CLI do chúng tôi cung cấp.

Chú ý: ứng dụng được viết trên nền ReactJS.

  1. Cài đặt CLI

    npm install acheckin -global

  2. Tạo dự án mới

    acheckin init MyMiniApp
    acheckin init MyMiniApp --id com.example.miniapp --template ts

    Cú pháp
  • --template [js|ts|html] tạo project theo template javascript react (defaul) | typescript react | html
  • --id [your_bundle_id] cài đặt app ID
  1. #### Chúc mừng, bạn đã khởi tạo thành công! Nhập lệnh cd MyMiniApp && acheckin run và dùng ACheckin trên điện thoại quét mã QR được tạo trên Terminal.

???? Thêm ACheckin SDK vào dự án NPM / Yarn-supported có sẵn

ACheckin SDK có thể được cài đặt như một thư viện cho các dự án dùng npm / yarn.

Bạn có thể cài đặt bằng cú pháp

  • npm install acheckin-sdk hoặc
  • yarn add acheckin-sdk

Sau đó, tạo file config.json ở thư mục public của dự án mà bạn có thể xem với url http://your-ip-address/config.json

{
    "app_name": "tên-app-của-bạn",
    "app_id": "acheckin.miniapp.template",
    "app_flashscreen": "acheckin.png",
    "display": "fullscreen",
    "version": "0.0.1",
    "main": "index.html",
    "use_scroll": false,
    "permissions": ["basic_info"]
}

???? Thêm ACheckin SDK như một thư viện JS

Sẽ cập nhật sớm

???? Khởi chạy ứng dụng

Đối với ứng dụng tạo bằng ACheckin CLI

Thật đơn giản, hãy chạy cú pháp acheckin run và dùng ACheckin quét mã QR.

Với các ứng dụng khác

  • chạy webserver môi trường dev
  • tạo mã QR code với định dạng acheckin://app_dev?h=[your_ip_address]&p=[port] và quét mã này bằng ACheckin
  • sử dụng ACheckin CLI với cú pháp acheckin qr

⌨️ Phát triển ứng dụng

  • Import ACheckin SDK vào dự án
import { ACheckinSDK } from "acheckin-sdk";
  • Khởi tạo SDK
window.asyncACheckinInit = async () => {
    ACheckinSDK.init();
};
  • Lấy các thông tin người dùng
try {
    // Access token
    const accessToken = await ACheckinSDK.getAccessToken();

    // lấy thông tin người dùng (public)
    const userInfo = await ACheckinSDK.getUserPersonalInfo([
        "id",
        "email",
        "name"
    ]);
    // lấy thông tin người dùng (trong workspace)
    const userInfo = await ACheckinSDK.getUserWorkspaceInfo([
        "id",
        "email",
        "name"
    ]);
} catch (e) {}

Chúc mừng, bạn đã lấy được thông tin cơ bản của người dùng.

Hãy Quét mã QR trên ACheckin nhé!

Chạy ứng dụng trên Chrome

ACheckin hỗ trợ nhà phát triển có thể test ứng dụng trực tiếp trên trình duyệt với Chrome Extension. Bạn có thể cài đặt bản Beta bằng cách sau

  • Tải ACheckin Mini App Emulator tại đây
  • Giải nén và xem hướng dẫn tại đây
  • Chạy ứng dụng acheckin run và chọn biểu tượng ACheckin trên trình duyệt

Xem ảnh lớn hơn

ACheckin Emulator

???? Phát hành ứng dụng

Để phát hành ứng dụng trên ACheckin, bạn cần đăng kí một tài khoản tại ACheckin Connect.

Với các ứng dụng dùng ACheckin CLI

  • Đăng nhập với CLI acheckin login

  • Build và gửi bản build acheckin build

Với các ứng dụng NPM / Yarn-supported

  • Build ứng dụng yarn build hoặc npm build
  • Nén folder build và upload file zip lên ACheckin Connect

Với các ứng dụng khác

  • Nén toàn bộ file chạy ứng dụng và upload file zip lên ACheckin Connect

???? API Reference

  • setHeadererTitle(string) -> Promise<any> - đặt title cho header của ứng dụng
  • getAccessToken() -> Promise<string> - lấy accesstoken
  • getUserPersonalInfo(array) -> Promise<UserInfo> - lấy thông tin user public (personal)
interface UserInfo {
    id: string;
    name: string;
    picture: string;
    email: string;
    birthday: string;
    gender: "F" | "M";
}
  • getUserWorkspaceInfo(array) -> Promise<UserWorkspaceInfo> - lấy thông tin user trong workspace
interface UserWorkspaceInfo {
    id: string;
    name: string;
    picture: string;
    email: string;
    birthday: string;
    gender: "F" | "M";
    is_owner: boolean;
    is_leader: boolean;
    current_workspace: string;
}
  • setItem(key: string, value: string) -> Promise<boolean> - lưu string vào bộ nhớ theo key

  • getItem(key: string) -> Promise<string> - lấy value theo key

  • getDeviceInfo(Array<keyof DeviceInfo>) -> Promise<DeviceInfo> - thông tin thiết bị

interface DeviceInfo {
    device_id: string;
    device_name: string;
    device_platform: string;
    bundle_id: string;
    device_os_version: string;
    is_tablet: boolean;
    ip_address: string;
    battery_level: number;
    battery_changing: boolean;
    device_mac_address: string;
    device_manufacturer: string;
    device_brand: string;
    wifi_name: string;
    is_wifi: boolean;
    has_network: string;
    is_mobile_data: boolean;
}
  • readBarCode() -> Promise<string> - đọc QR / bar code

  • addShakeEventListener(callback) - xử lý event lắc thiết bị

  • showBottomTabs - hiện thanh công cụ ở dưới màn hình

  • hideBottomTabs - ẩn thanh công cụ ở dưới màn hình

  • isCheckedIn -> Promise<boolean> - kiểm tra user đã checkin vào workspace hay chưa

  • getCurrentLocation -> Promise<Location> - lấy vị trí hiện tại của user

interface Location {
    latitude: number;
    longitude: number;
}
  • shareScreen(string) - chụp màn hình và chia sẻ với message tùy chọn

  • setLocalNotification({title, body, schedule_time: number}) - tạo và lên lịch hiển thị local notification

  • vibrate - rung thiết bị

  • getStaffOfLeader({offset, limit}) -> Promise<{total, data: {id, name, picture, email}}> - lấy danh sách nhân viên

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文