Between the transition from Android 4.0 to 4.3 (inclusive), there is a known issue where web storage is lost when navigating between web

I'm currently working on an Android project that heavily relies on the WebView to navigate through multiple HTML pages stored on the device. The inputs entered on these pages are then submitted to the WebView for storage in a database when necessary.

Each page is equipped with controls linked via jQuery for navigation between previous and next pages, and contains various types of input fields like checkboxes and textfields.

The final page features a submit button that utilizes JSInterface to save the results in an SQLite DB, while another button on a customized top navigation bar offers the same functionality.

Users have the ability to edit the results by revisiting the first page where all the saved inputs will be automatically filled using a jQuery system.

To provide more context, I am utilizing SDK 19 and compiling against 4.4.2, although I previously worked with SDK 15 and compiled against 4.2.2 without encountering this issue.

If you'd like to see a simplified version of what I've described, feel free to check out this JSBin.


The Challenge at Hand

I have been using SessionStorage to store inputs across pages as opposed to cookies due to reliability issues with the latter when handling numerous key/value pairs exceeding 150.

However, my concern lies with the fact that the SessionStorage seems to vanish between pages on certain devices.


Testing Procedure

1st Scenario - Staying on the First Page Only

If I remain on the initial page, input data is successfully stored and transmitted upon submission without any setbacks. Revisiting the page for modifications reveals all fields pre-populated with saved information.

2nd Scenario - Navigating Across Pages

Upon filling out page 1 and transitioning to page 2 to enter additional inputs, I cross-check whether the data persists on each individual page during navigation. While all inputs appear intact, only those present on the current page are being sent when submitting the results.


Android Version Test Results

  • 3.2 - Functional

  • 4.1.2 - Not Functional

  • 4.2.1 - Not Functional

  • 4.3 - Not Functional

  • 4.4.2 - Functional


Tried Solutions

  • Attempted overriding the shouldOverrideUrlLoading method of WebViewClient by returning False - No Positive Outcome

  • Switching from SessionStorage to LocalStorage yielded no noticeable improvement

Insights Uncovered

Transitioning from sessionStorage to localStorage failed to address the issue effectively.

Valuable insights regarding the WebKit versions employed by Android devices can be found here:

Android 3.2.1 uses an older version (v534.13) yet functions smoothly.

Meanwhile, Android versions ranging from 4.0 to 4.3 share a common WebKit engine version (v534.30).

Android 4.4 deploys a new version (v537.36), explaining its compatibility.

While solutions seem elusive, this insight provides clarity on the problem and affected devices.

Suggested Resolution

Beginning SDK 16, a security setting was introduced to restrict Javascript code from accessing content from diverse origins.

if(Build.VERSION.SDK_INT >= 16) {
    setting.setAllowUniversalAccessFromFileURLs(true);
}

Credit goes to ksasq for discovering this solution!

[EDIT 18/02/2014]

Further testing revealed that the issue is tied to TargetSdkVersion, with no influence from BuildTarget adjustments.

When set at 15, WebStorage functionalities operate as intended.

However, if set at 16 or above, WebStorage performance becomes erratic.

Answer №1

During the transition from ICS (SDK 15) to JellyBean (SDK 16), significant alterations were made to the WebView's security protocol and its handling of javascript from file:// origins. For compatibility, it is recommended to utilize

WebSettings.setAllowUniversalAccessFromFileURLs(true)

This confirms that you are operating with file:// URLs and have faith in the content being presented. It is likely that the upgrade to Chromium WebView in 4.4 resulted in further changes that eliminated the necessity for these settings.

Answer №2

It's unfortunate to learn about the issue with the web storage API on Android, especially since I had plans to utilize it in the coming days.

From your research, it appears that Android 4.4 introduced a new WebView based on ChromeBrowser, which supports various web technologies like WebSocket, but seems to have trouble with the localStorage API for devices running Android 4.0-4.2 (which are also part of my target audience). In light of this information, I am considering using the FileSystem API instead.

http://www.html5rocks.com/en/tutorials/file/filesystem/

However, after searching online, I'm uncertain about the reliability of this alternative and stumbled upon the following resources:

Using local storage on Android webview

https://github.com/didimoo/AndroidLocalStorage

Answer №3

I believe that session storage remains active as long as the window that generated it is still open, whereas local storage persists even when the browser is closed and reopened. It raises the question of whether the browser maintains the window's state when moving between two local files. This concept may vary depending on interpretation. Upon reviewing your code, it appears straightforward to switch from using session storage to local storage. Would you consider this as a viable option?

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Hover over the first element to remove its class and replace it with a different element

I am attempting to develop a function that adds the class = "actived" to the first Element. This class has a CSS style that highlights the element in question. I have a list of 4 lines and I want the first one to automatically receive this class, while t ...

Arrange the elements in the array based on their parent relationships (using topological sort) and their importance within

My array contains objects with elements that are dependent on each other. To properly store this data in a database, I need to order the array by importance (based on parent dependency) and update all children's parent property with the corresponding ...

Unable to add MySQL results to the array

This is the code I am working on: var nbu = req.body.nbu; var inv=[]; db.query( "SELECT * FROM `invoice_ska` WHERE nm_client =?", nbu, (err, results) => { if (err) throw err; inv.push(results); } ); console.log(inv);//this just [] }); I ...

Switch from Index.html to Index.html#section1

Currently, I am working on a website and sending someone a draft for review. However, the Home screen is designed as a 'a href' link with "#home". The issue arises when the website opens from my computer; it goes to ...../Index.html instead of .. ...

Using JS/jQuery to modify linear-gradient

I'm currently working on a project that involves using input type color. My goal is to create a gradient using these colors. Any suggestions on how I can achieve this? Here are the color tags: <div id="part1" align=center> <input type="colo ...

Error: The function setApiKey() must be executed prior to initialize()! - Transitioning from SDK version 33 to SDK 34 for Yandex MapKit

After updating the target SDK from version 33 to 34, the application started crashing when trying to open the activity with the map. Upon investigation, it was discovered that the MapKit library needed an update to version 3.5. After updating the library, ...

When my View is deployed, the relative URL path breaks

As I work on my ASP MVC app, I encountered an issue with the path to a Partial View when using Javascript. The path needed to be hardcoded and differs between Development and Production environments. Specifically, in Dev there is no App specification, whe ...

Unable to retrieve a public image from Google Cloud Storage using Fresco

I'm currently facing an issue where I am attempting to load an ImageView with an image that has public permissions. Strangely, the image loads perfectly fine in the browser, but within my app it's not displaying: Uri uri=Uri.parse("https://stora ...

What could be causing the unusual output when my function converts a string to a double?

I encountered a strange issue while working with my function and suspect there might be an error related to rounding and double values in Java. For instance, when I input the value 00159.300 for number and 100 for conversion, I get 15930.000000000002 as t ...

`If an App is Killed, Intent Extras Are Not Retained Within PendingIntent`

We encountered an issue where the extras Bundle from a PendingIntent's Intent are not retained if the app is terminated due to low memory. When creating a notification: // ... final Intent intent = new Intent(this, ControllerActivity.class); intent. ...

The UI Bootstrap date picker is malfunctioning on a custom page within ng-admin

I'm a beginner in angularjs and ng-admin. Currently, I am working on a project where I need to integrate a custom UI bootstrap date picker but I am facing an issue with the popup not appearing. Below is the code for my custom page: Here is my custom ...

Performing a test on API GET Request with Playwright

I've been attempting to verify the GET status using this particular piece of code. Regrettably, I keep encountering an error message stating "apiRequestContext.get: connect ECONNREFUSED ::1:8080". If anyone has any insights or suggestions on how to re ...

Saving a FileObject from SFTP to a local file: A step-by-step guide

I am in the process of creating a Java program to test an interface that uses XML files to communicate over SFTP. The concept behind this interface is that one side uploads an XML file, which is then processed by the other side. Once processed, the file is ...

Transferring data between two distinct programs linked to a single router without internet connection using JavaScript and Electron

I am currently working on implementing a feature called 'add monitors' into my program. This feature would allow users to display data on another computer (a sub-program) within the same building, without the need for internet connectivity. The t ...

What is the best way to add child elements to existing elements?

When it comes to creating elements with jQuery, most of us are familiar with the standard method: jQuery('<div/>', { id: 'foo', href: 'http://google.com', }).appendTo('#mySelector'); However, there ar ...

In the world of Java, where are the instance variables and instance methods typically stored?

Can you explain what happens in the following program? Are 3 instances of variables and methods created with memory allocated to them? class Foo{ String name = ""; public void greet(String name){ this.name = name; } } class Greeti ...

I am having trouble with selecting an element from a JavaScript webpage using Python's scrapy and Selenium

I am in the process of developing an application to collect data. My tools of choice are Python 2.7 with Scrapy and Selenium on Windows 10. I have successfully implemented this on a few web pages before, however, I am facing an issue with selecting or clic ...

Unable to write to file due to permission restrictions from EPERM. Will delete existing file and create a new one. This action

I am encountering an issue with my file system function that involves deleting a file and creating a new one with updated data. The error occurs randomly, not consistently, happening approximately every other time the code runs. Below is my current impleme ...

Setting a default value for Autocomplete in MaterialUI and React.js

Is there a way to set a default value for an Autocomplete TextField component from Material UI in React.js? I want to load a pre-populated value from the user's profile that can then be changed by selecting another option from a list. Check out my co ...

Automatically update div content using jQuery including an AJAX request for loading

I have successfully implemented a method for loading output from now_playing.php (shoutcast now playing content) using a jQuery include ajax call, as recommended in this answer on Stack Overflow. Here is my code: <script> $(function(){ $("#now_ ...