Introduction to the

Trello is a team management tool. This paper introduces the use of wechat small program to do a score ranking project, from the wechat small program end to call the Trello interface, get the articles above digging gold, according to the specific rules to score. Some preparatory work needs to be done before the project begins:

1. Register a Trello account –> Register as a developer –> Get a Trello developer’s key –> Generate tokens. Then enter the Trello API documentation to obtain the required interface.
2. Become WeChat small developers, specific steps refer to developers.weixin.qq.com/miniprogram…
3. Get all the articles in GeneTalks_ Big Data.

Configure your right ➤ in wechat developer tools (right corner). Configure your right ➤ in wechat developer tools (right corner). Configure your right ➤ in wechat developer tools (right corner).

The rules of integration are as follows

The exercises are in Trello, get the corresponding board (kanban in Trello), there is a list(task list in board), there is a card (corresponding task, problem). Create list –> card in the corresponding board according to certain conventions, and file only after completing the corresponding tasks, and then get the points that the card archived in the corresponding board should get for the participant in the ranking.

Only blog in nuggets, so you need to get nuggets inside the article, but nuggets platform does not provide API interface, so you have to go to the corresponding HTML page, and then do string interception.

implementation

Because the pages are relatively simple, there are fewer pages. Here’s how Promises handle asynchrony.

Second, the small program side of wechat does not introduce third-party JS scripts to deal with asynchronous problems.

I know how to handle asynchronous JS problems:

1. Use callbacks. Cons: The code logic gets more complex and the callback level gets deeper and deeper depending on how many times you visit the interface.
2. Use async await, but not without importing third-party JS scripts.
3. Promise. We’ll show you how to use Promise, eliminating callbacks and improving code readability.

Wechat applets send requests. Ex. :

Statistical points need to obtain the Trello interface, mining articles, get the data after other operations, use callback

let sort = (a)= > {}; // the sort function does the logical sorting
const get_data = (a)= > {
  const _this = this;
  const get_board = (callback) = > {
    wx.request({
      url: 'https://*****'.success: resp= > {
        / / get the resp
        // Use the callback
        // If you need to pass in the RESP, then do the logic
        // Sort is passed as an argument to the callback, and can be called directly from the callback. Sort is called once if everything returns normally
        resp.data.forEach((item, index) = > {
          callback(item, index === resp.data.length - 1&& sort); }}})); };const get_cards = (data, callback) = > {
    wx.request({
      url: data.url,
      success: (a)= > {
        // Business logic processing
        / /...callback && callback(); }})}const get_blogs = (callback) = > {
    wx.request({
      url: 'https//****'.success: resp= > {
        // same as above...
      }
    })
  }
  get_board(get_cards); // Get cards from board
  get_blogs(get_blog_detail) // Get the content of the blog
  // Then call get_board, get_blogs, which can do the final logical processing, but the sort function is executed twice and is also prone to statistical errors due to data request errors.
};
Copy the code

The use of Promise

Make a change to extract request_fun and pass in the parameter from a single value to obj on demand

// Get the card archived under board
const request_fun = (obj) = > {
  return new Promise(resolve, reject) => {
    wx.request({
      url: obj.url,
      success: (resp) = > resolve(resp),
      fail: (err) = > reject(err)
    }),
  }
}
const get_cards = (obj) = > {
  // Return a Promise with a card interface return value.
  return request_fun(obj);
}
// Get all the boards
const get_board = (a)= > {
  // obj, all parameters to be passed in, key: field name to be passed in
  let obj = {
    // For example, URL,data,success,fail can be passed as arguments
    url: 'https://****'.data: {},}let promise_arr;
  // get_value has the value returned by the board interface
  return request_fun(obj).then(resp= > {
    // Iterate over the board that needs to participate in the integration
    resp.data.forEach(item= > {
      // Store the Promise returned by each card interface into the promise_arr array
      promise_arr.push(get_cards(item));
    })
    // promise. all accepts an array of promises
    // Use promise. all, etc. All interfaces that fetch cards will return an array, and each item of the array will correspond to the return value of card under the board
    return Promise.all(promise_arr)
  })
  // The blog is obtained in the same way as the card above
}
  // Write a promise.all () waiting to get the data of the gold digging blog and the data of the Trello can perform the final data summary and sorting. Call the sor ()
  const get_data = (a)= > {
    return Promise.all([get_board(), get_card()]).then(resp= > return sort(resp));
  }
Copy the code

Wechat mini program online problem

1. Wechat applet can only get HTTPS API
2. When you upload the code and use the experience version, you will find that none of the interfaces can get data. At this time you need to go to wechat small program background management page development –> development Settings –> server domain name:

Oek, that’s all!!

The original link: tech.gtxlab.com/WXTrello.ht…

Author information: Ning Wenfei, Renhe Future Big data front-end engineer