Shulou(Shulou.com)06/01 Report--

Today, the editor will share with you how Linux queries the relevant knowledge points of WePY cloud development in Mini Program. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article. Let's take a look at it.

First of all, why did you choose wepy?

At the beginning of the project selection, I can choose the underlying frameworks are wepy, mpvue, taro, minui, these frameworks are well-done engineering frameworks, which can help Mini Program project long-term maintenance. Among them, taro is excluded from the very beginning because it uses react that I am not familiar with. After I have seen mpvue, it is more likely to provide Mini Program conversion tools for web developers than vue-like tools for Mini Program developers, so it has been ruled out by me. Because minui itself only provides the component program and the support of npm and es6/es7, other commands still have to continue to use the function of Mini Program, and do not provide more support, the whole ecology is not yet rich, so it excludes minui.

In the end, I chose wepy. Before I started, I studied wepy to see what advantages there are in wepy. Overall, I think the advantages of wepy are as follows:

1. Provide a component-based solution similar to vue: component-based development can improve the maintainability of the project, as your development cycle becomes longer, component-based will greatly affect your development experience.

two。 Provides support for es6/es7 syntax: javascript's much-maligned callback has been implemented more elegantly in es6 and es7.

3. Provides the ecology of vue: unlike minui's alone, wepy has many vue community ecological products, such as wepy-redux, rxwx and a series of tools that people are used to use under vue, which makes the development process smoother and the development experience more consistent.

4. Optimization of native api: many of the APIs provided by Mini Program are callback mode, but not promise. We often need to repackage it ourselves when using it, which is troublesome. In wepy, wepy officially encapsulates a layer for us, and you can directly use the method encapsulated by wepy to reduce the workload of encapsulation.

5.vue custom data setting: in wepy, you can assign values using this.xxx=xxx syntax, which is more comfortable and maintainable than the native setdata method.

6. Provide a computed method: when developing Mini Program, we inevitably have to format the data, in the traditional Mini Program development, we need to map the data, and then modify it, but after using wepy, we can use the computed calculation property to format and adjust the data, which greatly improves the readability of the code.

These are the advantages of wepy that I value. Next, I'll talk about how to use cloud development in wepy.

Cloud development in wepy

I have written a lot on Mini Program and talked about some Mini Program courses, and people often ask me, can xxx be used in xxx? in this scenario, can cloud development be used in wepy?

The answer is, of course, yes.

Looking at this problem, you should first figure out what cloud development provides.

Cloud development provides data storage, file storage and computing power

It does not conflict with wepy's ability to provide WeChat Mini Programs with component-based development, so wepy and cloud development do not conflict, you can use cloud development in wepy.

Enable cloud development in wepy projects

Since wepy itself does not provide a template for cloud development (although you can now use the wepy init cloudkits/wepy-tcb-demo command to initialize a wepy project that contains cloud development examples), we need to add cloud development to the project ourselves.

Cloud development itself is integrated in wx. In the namespace of the, so you can directly use wx.cloud.xxx to invoke commands for cloud development without configuration. In addition, what is special is that you need to specify the cloud function directory to ensure that the WeChat Mini Programs developer tool can identify the cloud function directory.

It is important to note here that because the cloud development command itself supports promise and callback, you can call it directly using wx.cloud instead of using wepy.cloud. Wepy has not officially encapsulated cloud development again.

You can create a new directory cloudfunctions in the root directory of the Mini Program project, then add a new configuration project cloudfunctionroot to project.config.json and set its value to cloudfunctions. In this way, the WeChat Mini Programs developer tool can identify this directory as the directory of the cloud function and add a special directory name to it.

It should be noted here that SCF should be placed outside the source directory src of Mini Program, otherwise it will cause compilation error. I tried to find the configuration project in wepy.config.js about blocking the compilation check directory, but I couldn't find it, so I directly put this directory in the project root directory, which is at the same level as the src of the cloud function and Mini Program source code.

In this way, you have completed the reference to Mini Program Cloud development in wepy.

A pit that has been stepped on in the process of development.

Data should be set first for this assignment

When developing with wepy, we use this.xxx to modify the value of the data, but when I first started the development, when I encountered the first problem, I couldn't set the value of the data with this.xxx, and I couldn't get the corresponding value in the Mini Program interface.

Later, it turns out that if you want wepy to update and manage the data for you, you need to put the data to be passed to the page in the data object in the page instance, so that wepy will help you update and manage the data. Since this was not indicated in the document, I stepped in the pit.

After the subsequent analysis of wepy, understand this approach, because wepy did not use setdata, but directly called this.xxx to modify, then wepy needs to know which variables should be sent to the page, otherwise, all the data in this will be transmitted to the page, which will lead to transmission time is too long, easy to let Mini Program exit, then, use data to limit the data method can be understood.

How to deal with the management of pure mobile data?

So far, cloud development does not provide a management method other than the official console of WeChat Mini Programs, which makes it difficult for us to build applications.

In order to provide better service, we decided to modify the model of the product. At first we considered the model in which the user submitted the translation and the team reviewed it, but took into account the lack of management and development costs. We decided to adjust the model to community self-purification. We are fully open to editing capabilities, and any user can submit data. At the same time, it is also possible to practice an application that is completely maintained by the community in China.

However, this kind of data that anyone can submit is likely to be used by others, so we have introduced the content security interface provided by WeChat Mini Programs officially for text security inspection, thus, as far as possible to avoid the impact of some illegal content on Mini Program.

If you use this API, you will know that access_token is required when the API is called, and Wechat's access_token acquisition API has both the address limit for initiating calls (which cannot be called in Mini Program) and the frequency of API requests (too fast may cause the token cannot be obtained), so we decided to use cloud function to deal with this part of the function.

We use got as a library in the SCF to request the interface provided by Wechat, obtain access_token, and check content security. And, to make sure that access_token requests don't happen too frequently, we add some code to cache token.

Const result = await cache.get (); / / cache is the reference to the corresponding collection const now = (new date) .valueof (); const nexttime = now + 5400000 Let accesstoken =''if (! result.data.length) {console.log ("enter the first acquisition process") const result = await got (accesstokenurl) accesstoken = json.parse (result.body) .access_token await cache.add ({data: {token: accesstoken Time: nexttime}}) else {if (result.data [0] .time > now) {console.log ("existing token is valid") accesstoken = result.data [0] .token} else {console.log ("existing token is invalid") const tokenresult = await got (accesstokenurl) accesstoken = json.parse (tokenresult.body). Access_token await cache.doc (result.data [0]. _ id). Update ({data: {token: accesstoken) Time: nexttime}})}}

Through the above code, you can store a token in the cloud database and compare its expiration time. If you find that the token is about to expire, update the token to ensure that the request can be made normally.

These are all the contents of this article entitled "how to query WePY Cloud Development in Mini Program by Linux". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.