How can I see localstorage input datas?( in Chrome )

Question

I practice a simple todolist by using localstorage.

As you can see in this screenshot, it works as I intended.

But is there anyway to check those inputs that I typed in?

I checked this link Where the sessionStorage and localStorage stored?

It said in Chrome I should follow this path

%LocalAppData%\Google\Chrome\User Data\Default\Local Storage\

And I followed this path(there is nothing but only leveldb folder in Local Storage folder)

Now I have no idea what represents my inputs.

Also what is that .idb file? Is it some sort of database files? I searched it on Google and it gave very vague answer.

Sorry English is not my main language so my writings would be bad for reading.

Can't you just `var aValue = localStorage.getItem(keyName);`? — Gabriel Donadel Dall'Agnol, Jul 22 '20 at 01:04

mchl18 · Accepted Answer · 2020-07-22T01:17:30.277

1

Seems to be a levelDB file. Related: Local Storage with Chrome 61

However, what Chrome does with these files should not be of your interest. It can change over time.

You should only interface with the Browser API and not care about the files on the disk.

To see what is stored in localStorage for the current domain do this:

console.table(localStorage)

... or as mentioned, use Chrome DevTools => Application => Local Storage

To get or set a value use:

const obj = JSON.parse(localStorage.getItem('foo'))

localStorage.setItem('foo', JSON.stringify({ bar: 'zulu' }))

edited Jul 22 '20 at 01:17

answered Jul 22 '20 at 01:06

mchl18

2,119
12
20

Thank you! Better have to use those or if I really want to get DB based file, I think I should use something else to work with. Thanks for the help. – JohnyBgood Jul 22 '20 at 23:26
Alternatively to localStorage there is also indexedDb – mchl18 Jul 23 '20 at 11:00

Sagar Kumar · Answer 2 · 2020-07-22T01:19:22.570

View Local Storage With Chrome DevTools. Open DevTools using right-click on the browser and inspect element. Then you will see many options like Elements , console, sources, etc.Click on Application after that on the left side menu you will see local storage, Session Storage, and many more options.

Right Click on Browser --> Click on inspect or inspect Element --> Click on Application --> Local Storage(on left side menu)

How can I see localstorage input datas?( in Chrome )

2 Answers2