Why does ABT wallet support Webview? How to make DApp smoother in wallet Webview? _ ArcBlock Blog

Why support Webview? In the original ABT wallet[1] product design, for the security of the data in the wallet, we directly cut off the idea of ​​supporting Webview in the wallet, making the wallet just a pure DID management tool. After all, the users of the ABT wallet will be in it. Store digital assets, whether it is a pass or NFT.

After the wallet supports the DID Auth protocol [2], all applications developed based on ArcBlock technology will use BlockchainLink as the entry point to initiate various types of interactions to complete the point-to-point communication between the application and the user, such as requesting the user to provide a profile and requesting the user to sign the transfer transaction. , Signature swap transactions, etc.

With the iteration of the wallet, we have become more and more aware of the security restrictions of the mobile operating system during the development of various small applications: for example, after the ABT wallet is called up from the mobile browser and the authorization operation is completed, it may be called back to another browser ( See here [3] and here [4]), the wallet user experience problems caused by these security restrictions are just as unpleasant.

From a long-term perspective, user experience determines ecological development, and this problem must be resolved. After careful discussion and research, we found that the advantages of supporting WebView in the wallet in the current environment far outweigh the disadvantages:

•Webview is a relatively mature technology. After several security incidents, the mobile operating system has made many improvements. We can stand on the shoulders of giants. •Webview's biggest security risk may be JS injection into native applications The code inside, this is not allowed and not supported in the ABT wallet, for the reason, see the next article • The user-triggered interaction with the native wallet in the Webview (called DID-Auth session) is actually a point-to-point between the application and the wallet Communication, there is asymmetric encryption technology to ensure security, and the result of the session is directly referred to the back end of the application, which also guarantees the security of the application

What changes will Webview bring? What changes have been made since the ABT wallet supports Webview?

•First of all, the scan code function of ABT wallet can directly open the URL. If the URL happens to be a dApp, it will be recorded by the wallet after one interaction. • Secondly, all applications that have been interacted with the ABT wallet will be recorded. Open the wallet's Webview to make the user's search path shorter. Finally, any dApp developed with ArcBlock technology can be opened in the wallet through the Deep Link supported by the wallet to open the application directly in the wallet to provide the smoothest Experience

If you want to experience these scenarios, you can scan the following two BlockchainLinks, and you need to upgrade your ABT wallet to v2.5 before scanning the code (you can swipe the wallet global site [5] or wallet China site [6] if you need to upgrade):

Open the normal URL and open the application directly

Some students may ask: What is special about the Webview of ABT wallet? In fact, in addition to the security restrictions mentioned above, it is a standard Webview embedded with modern browser kernels, and it has very good support for HTML5 and CSS3.

How to make dApp support Webview? If you are not a developer, you can close this article here.

Next, we will introduce what to do to make your app experience better in the wallet Webview.

Using Blocklet is suitable for creating new projects. We have updated all Starter Blocklets. Applications created using these Blocklets have been well adapted to ABT wallets, such as automatic login, basic responsive layout, etc. , And built-in basic session management, user management, payment cases, the steps to use Blocklet are also very simple:

    npm install -g @arcblock/forge-cli forge blocklet:use forge-react-starter If you have not used Forge CLI (the Swiss Army Knife for dApp development created by ArcBlock), please hit here [7].

The front-end of the currently released Javascript Blocklet is written in React.js[8], and the back-end uses Express.js[9]. You can choose the following Blocklets according to your preferences and actual needs:

•Forge-react-starter[10], integrated our Forge SDK into create-react-app[11], which is very suitable for getting started •forge-next-starter[12], integrated our Forge SDK into next. js[13], suitable for students who need server-side rendering•forge-keystone-starter[14], integrated our Forge SDK into next.js[15] and keystone.js[16], suitable for service needs Render and manage the background scene

Integrated responsive layout If you already have a running application that needs to adapt to the Webview of the ABT wallet, the first thing you need to consider is the responsive layout. The responsive layout allows any WebApp to scale freely on different screen sizes. The responsive layout of is encapsulated and can be used as follows: