Location>code7788 >text

Mobile android with ios compatibility issues, anti-human!!!!

Popularity:747 ℃/2024-09-04 16:32:27

I. Query parameter encoding issues

We are in the daily development, sometimes encountered splicing parameters in particular, then it will lead to a particularly long line of code. Then for the sake of aesthetics, some students will be line breaks, the following code:


You can see that where I've boxed in red is where I've manually done a carriage return resulting in a carriage return line break. This seems normal at first glance, right, but it's actually preserved for JavaScript.
We know that when using or other HTTP clients to send a request, the browser or client will encode the query parameters after the URL, that is, those things after the question mark, so we can print out the encoded stuff ourselves to see, as follows:

You can see that we coded a lot more%0A%09thing, and this is actually our carriage return line break, so you can go to theOnline Codec SitesLook at the decoded stuff.

I ran this scenario on the browser side, the Android side, and the ios side as follows:

H5

iPhone

Android

As you can see, even in this case with the carriage return line breaks, the request can be sent normally in H5 as well as Android, while ios is not so lucky. ios is more strict in its handling, and it can be said that it is anti-human, it will not deal with this kind of stuff, and give it to the back-end together, resulting in parameter errors.

So what about the solutions? There are many, for example:

Turn on Hbuilder X's automatic line breaks by setting them so that they don't change the code and don't interfere with code reading;
Alternatively, you can manually splice the individual parameter writings with the '+' sign, which is more cumbersome;
No more than that, you can manually replace line breaks with spaces as well.

On my side, I chose to turn on auto line feed as follows:

The effect when viewed in the editor will then automatically change lines according to the width of your viewport, as follows:

II. Use of dates

In the use of dates, if the incoming string is in a non-standard format (mainly because it has to be split by '-'), iso case an error will occur. The following code:

const date = '2024/8'
let year = new Date(date).getFullYear(),
	month = new Date(date).getMonth() + 1
('Year obtained:', year)
('Months acquired:', month)

Print results:

Android

H5

IOS

You can see that when in the ios case, the year and month obtained are both NaN, then for subsequent use of these two variables will be unexpected results.
So when using the value to ensure that the incoming standard date format, if you can not ensure that the formatting is done, as follows:

const getMonthStr = (date) => {
let year = (); let month = (() + 1).toString().padStart(2, '0'); {
let month = (() + 1).toString().padStart(2, '0');// do a zero fill here to avoid single digit months
return `${year}-${month}`; };; //Here we do the zero complement operation to avoid the single digit month situation.
};