Utilize Chrome storage instead of localstorage to generate Parse sessions

Question

Utilize Chrome storage instead of localstorage to generate Parse sessions

I'm currently developing a Chrome Extension that relies on Parse User sessions. Because localstorage is limited to specific domains, I am looking to utilize chrome.storage so the data can be accessed across any site.

The existing Parse Javascript SDK uses localstorage for storing user objects and creating sessions. How can I modify this behavior to switch to using chrome.storage instead?

Here is my current approach:

on login
   store session token in chrome.storage

Then, during site visits:

if chrome.storage.sessiontoken
    create Parse session with the stored session token from chrome.storage

I'm trying to find a simpler solution, so if anyone has any suggestions, I'd appreciate it!

I wish I could just do: window.localstorage = chrome.storage

But I suspect that may cause issues. Has anyone found a way around this problem?

javascript google-chrome session parse-platform google-chrome-extension

Answer 1

Answer №1

To effectively store data in a Chrome app using Parse, you'll need to create a custom storage controller utilizing the chrome API. This allows for a more efficient and non-blocking storage solution compared to the default window.localStorage API used by Parse.

Fortunately, Parse SDK is designed to support various types of storage (both synchronous and asynchronous) and enables users to set their own storage controller. Before initializing Parse, make sure to call

Parse.CoreManager.setStorageController(YOUR_STORAGE_CONTROLLER)

.

For example, you can refer to the Parse React Native storage controller on GitHub, which demonstrates an asynchronous storage approach:

A Sync controller object should have its async property set to 0 with functions like getItem, setItem,removeItem, and clear
An Async controller object should have its async property set to 1 with functions like
```
getItemAsync, setItemAsync, removeItemAsync,
```
and clear

Simply follow the example provided by Parse React Native to build your own custom storage controller using the chrome.storage API. This will enable Parse to utilize your controller instead of relying on localStorage.

For the original discussion on Github, visit: https://github.com/ParsePlatform/Parse-SDK-JS/issues/72

Answer 2

To effectively store data in a Chrome app using Parse, you'll need to create a custom storage controller utilizing the chrome API. This allows for a more efficient and non-blocking storage solution compared to the default window.localStorage API used by Parse.

Fortunately, Parse SDK is designed to support various types of storage (both synchronous and asynchronous) and enables users to set their own storage controller. Before initializing Parse, make sure to call

Parse.CoreManager.setStorageController(YOUR_STORAGE_CONTROLLER)

.

For example, you can refer to the Parse React Native storage controller on GitHub, which demonstrates an asynchronous storage approach:

A Sync controller object should have its async property set to 0 with functions like getItem, setItem,removeItem, and clear
An Async controller object should have its async property set to 1 with functions like
```
getItemAsync, setItemAsync, removeItemAsync,
```
and clear

Simply follow the example provided by Parse React Native to build your own custom storage controller using the chrome.storage API. This will enable Parse to utilize your controller instead of relying on localStorage.

For the original discussion on Github, visit: https://github.com/ParsePlatform/Parse-SDK-JS/issues/72

Answer 3

Answer №2

Substituting localstorage with chrome.storage directly is not possible due to their synchronous and asynchronous nature, as well as differences in API methods.

While it's not feasible to make the switch fully synchronous, there are some potential solutions:

Handle storage operations in the background script where the domain for localStorage remains fixed.
Create a local synchronous data copy of the storage like so:
```
var localData = {};
chrome.storage.local.get(null, function(data) {
  localData = data;
  doSomethingElse(); // This part is async
})
```
However, managing updates to this cache will pose challenges as you'll need to intercept writes and synchronize with chrome.storage, which may lead to asynchronous issues.

In essence, if a library utilizes localStorage internally, replacing it effectively without rewriting the library or utilizing the background context may prove difficult.

Answer 4

Substituting localstorage with chrome.storage directly is not possible due to their synchronous and asynchronous nature, as well as differences in API methods.

While it's not feasible to make the switch fully synchronous, there are some potential solutions:

Handle storage operations in the background script where the domain for localStorage remains fixed.
Create a local synchronous data copy of the storage like so:
```
var localData = {};
chrome.storage.local.get(null, function(data) {
  localData = data;
  doSomethingElse(); // This part is async
})
```
However, managing updates to this cache will pose challenges as you'll need to intercept writes and synchronize with chrome.storage, which may lead to asynchronous issues.

In essence, if a library utilizes localStorage internally, replacing it effectively without rewriting the library or utilizing the background context may prove difficult.

Utilize Chrome storage instead of localstorage to generate Parse sessions

Answer №1

Answer №2

Similar questions

When utilizing the get method to invoke a JavaScript function, IE imposes a restriction of 2083 characters

A guide on incorporating the close button into the title bar of a jQuery pop-up window

Verify whether an email is already registered in firestore authentication during the signup process using Angular

The methodology of executing a Javascript function

Extract the HTML table from Gmail and transfer it to Google Sheets with the help of Google Apps Script

Ways to verify the existence of a particular word within a nested array of objects

Performing Jasmine unit testing on a component that relies on data from a service, which itself retrieves data from another service within an Angular 2+ application

Is there a way to transfer my existing Chrome profile to Selenium for testing purposes?

Socket.io continuously refreshing and updating multiple instances

Enhance your Sails.js model by incorporating a custom instance method as a new property

Using Backbone: Leveraging a custom extended model when fetching a collection

Run a PHP function using <button onclick=""> tag

What's the reason for this Ajax request taking such a long time to display on the

When a user clicks on a React listItem, the information for that specific item is displayed using

Angular confirmation page following successful HTTP POST request to Web API

The issue arises when using an Angular directive with an input type set as "number"

Is there a way to display a message in a div container instead of using the alert box when there is a successful ajax response?

I am struggling to display an array of objects retrieved from the server in the UI using AngularJS

Default scrollbars in Chrome are designed to seamlessly blend in

Tips for transforming the input date value from Mui Datepicker