Cause of Event
Here's the thing: product launches, and suddenly there's a problem. Operation GG came in response, on the spot to the dew demonstration, operating a colleague's cell phone is iphone,bug really exists. The strange thing is that the Dewdrop used other iphones (others, the dewdrop was hanged Andro), but did not find the problem. Asked carefully, colleagues said he recently upgraded the iOS9, so the problem was initially located on the operating system. Next check the code and find that it's working properly, and the logic is right. The problem is stuck here. No way, online problem, fiddler replace local script debugging, first-level alert, from the project file to the underlying library, and finally to the backbone. View backbone source code, found the problem Crux: _updatehash method has changed hash value method, Location.hash and Location.replace two, regardless of the execution of which, the hash value will not change immediately! In other words, early ios9 hash in the address bar change has a delay!
The hash jump mechanism of backbone
First, the code layer: in Backbone (hereinafter referred to as BK), Using the Route.navigate method for routing jumps, the BK framework will manually replace the hash in the address bar based on your incoming hash value, then call the Loadurl method to read the incoming routing configuration in memory and execute the rollback function. The approximate process is similar to the following code:
Route.navigate (call jump Manually)--->_updatehash (update the URL in the address bar)->loadurl (read the registered routed event in memory)->callback (performs the rollback function);
Second, the browser layer: The browser layer is not controlled by the code, but the browser provided to the JS listener URL events, modern browser support Onhashchange event, of course, this you can also be configured in start default with Popstate event monitoring, if it is an old browser, BK is a timer that refreshes the listening mode. Either way, it is to detect that the hash in the address bar is worth changing. Through the browser's fallback and forward function, the hash value will follow the change, and the browser itself will not refresh, so through a variety of changes to the URL of the event monitoring, can be done to respond to custom events. The approximate process is similar to the following code:
Back/forward (browser forward or backward)------>onhashchange (Departure hash value change)----->checkurl (detect URL before executing Loadurl, the method mainly deal with the behavior of the browser, The code layer Returns)---->loadurl (Find the return of the corresponding route by looking for memory)---->callback (execute the custom back function);
Everything is in order until the release of iOS9, and you rich people are eager to upgrade their own fruit machine. As a result, if you need to process the URL in the back-up function, then you get the old URL is not up-to-date.
Remediation and compatibility
In order to find Crux, dew in Baidu without fruit after Google to the same problems encountered in this peer. Unexpectedly in order to this bug, the foreigner exploded on GitHub on the pot, all kinds of spit groove iOS9, whether BK or Anglar all the developers have encountered this hash change delay problem. And then there's the great God who gives the solution (link at the end of the article dew will be emitted). At the same time the brine boiling in order to verify, oneself in iOS9 on the real Machine Debug. The following is the result of the code debugging and output of the Dewdrop, the problem is above the _updatehash method:
In order to solve the delay problem, our plan is of course a delay. By testing, the hash value changes probably in the iOS9 downstream 9~30ms (one time to alert results, not too accurate), so we can put the back function delay >30ms time execution. We delayed the Loadurl. 50ms,50ms is a very short process for the user, so it is acceptable for those systems that are not faulty. So, we changed the source code (1599 or so) into one of the following:
if (Options.trigger) { var self = this;//this is stored in the global variable setTimeout (function () {//delay 50ms Execution return Self.loadurl (fragment); }, 50); }
Through testing, each system was tested. The current is still relatively stable.
Conclusion
Dew adhere to the framework of the principle of source code, not the case of last resort resolutely do not move the framework source. But once there is a similar system bug, in order to repair, modify the source code is also a helpless. A big company like Apple, a small bug that may be affecting thousands of developers around the world. I hope Apple will fix this bug soon. Rather than want us to write compatibility with these developers. It is also hoped that the Dewdrop blog will be of some help to readers gentlemen who are developing BK or other single-page applications.
Reference documents
Https://github.com/driftyco/ionic/commit/e5b85dfc47dee788382c7da8f3a8abed7c2d38ac
https://github.com/angular/angular.js/issues/12241
Finally thanks to Davigo for the dew, and help the dew to find the document.
The bug and solution of hash value in IOS9.0