【 Case Description 】

Recently, after I packaged my WEB H5 application as a quick application, I encountered an error 403 as shown in the picture below when I registered and logged in with a Google account.

【 答 案 】

As you can see from the Error page above, Google gave the reason: Error: disallowed_userAgent. In other words, Google has put a limit on the UA browser that can load H5 apps, and it suggests chrome. Obviously the answer to the question has something to do with UA.

[Solution]

1. Define the variable model, which represents the user’s mobile phone model. Add the variable model into the data object, as shown in the following figure:

2. Assign to model: in the page life cycle onInit() method to get the phone model, the code is as follows:

1

2

3

4

onInit: function () {

const device = require(``"@system.device"``)

const res = device.getInfoSync();

this``.model=res.model;

3. Set the web component property userAgent to Mozilla/5.0 (Linux; Android 9; {{model}}) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.116 Mobile Safari/537.36))

Note: the variable model is used in the value of userAgent. The function of variable Model is to obtain the real phone model, so as to avoid some H5 web pages getting the wrong phone model when verifying userAgent, which may bring users trouble.

4. Set minPlatformVersion in the manifest.json file to 1068.

5. Ensure that the Version of Huawei Express loader is 2.2.0.304 or later. The way to view the loader version is shown in the figure on the right:

Note: 1, 2, 3, 4After the steps are complete, if you still have problems logging in, please log in to the webon

Add the following code:

multiwindow=”true”

  • Packaging H5 applications into quick applications is a very important solution overseas. Google services, such as Google account in this case, can still be used on mobile phones without GMS service.

  • The solution of this case is also applicable to other login problems of H5 quick application.