"Notes" in Hybridapp using Promise Js-bridge

Source: Internet
Author: User

background:
    • Hybridapp, the front end uses Js-bridge method to call native interface, such as acquiring device information, taking pictures, face recognition and so on.
    • The front end encapsulates the call library, and each time the native interface is called, two steps are required (1, mount the native callback function under window, 2, call the Invokenative function, send the request data)
before transformation:

With callbacks, you must define a callback function to mount on Window[funcname] before calling the method in Ygritte. Then call.

Questions:

1, may lead to callback hell: for example, in a scenario, you need to judge the app version, and then call the different native interface, then you need to define callbacks in the callback, resulting in nesting;

2, can not be changed to sync: for example, in the scene, in the home page, in [created] need to determine the app version, if the version is too low, in [mounted] need to prompt. Using callbacks, the callback in [created] has not been executed in theory when mounted is executed.

Retrofit:
    • Using promise to transform calls and callbacks
    • To ensure that the old code is compatible, do not modify the original form of adding an interface in the Ygritte using the prototype
    • The definition of the callback function is encapsulated and executed in the callback resolve

/** *function(linewidth, LineColor, Callbackname  ) {var args = [' knownothing ', ' gethandwritingsignature ', Callbackname | | ", {    linewidth:linewidth,    Linecolor:linecolor  }];  Snow.invokenative (args);};

Do not modify the original function above, add the lower function encapsulation

/** * Check the app return value, avoid multiple callbacks, only perform a resolve problem * promise in the definition of resolve or reject, will not perform the following resolve and Reject * Getphoto: When the image data is successfully obtained, Will callback two times, one parameter is the picture value, one parameter is undefined * * @param {string} method * @param {Object} res * @returns*/functionChecknativereturn (method, res) {if(method = = = ' Getphoto ' && (!res | | ' {} ' = = = Json.stringify (res)))return false; return true;}/** * Promise Method call * Ghost is the white ice Wolf of Jon Snow and looks like a fox. Its hair color is pure white, eye pupil red as blood. * * @param {Object} {method, Key = method, data} * @returns*/functionGhost ({method, key =method, data}) {  return NewPromise (Resolve, reject) = {    if(Ygritte[method] &&typeof(Ygritte[method]) = = = ' function ') {      //Global Mount app callback functionWindow[key] = (res) = = {        if(Checknativereturn (method, res)) {Resolve (res)); Window[key]= () + = {}; } Else{reject (res);      }      }; varargs = [' knownothing ', method, key | | ‘‘, data];    Snow.invokenative (args); } Else{Reject (NewError (' native method not present, please check methods ')); }  });}

after transformation:

1. Use the promise package to avoid the behavior of the global Mount function in the business code

2, can use the async syntax, the Code table meaning clearer

Legacy:

1, the partial native interface calls, will execute two callbacks, originally is in the business code to judge. Promise needs to be flattened with code, because the resolve function in promise only executes once, and there is no guarantee that the first execution is a business-required parameter.

"Notes" in Hybridapp using Promise Js-bridge

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.