Skip to main content
Inspiring
July 22, 2019
Answered

How to use cookies for CEP panel

  • July 22, 2019
  • 4 replies
  • 5545 views

Hi,

Can anyone show a basic example of writing and reading cookies values for the panel?

I want to store the user settings and i could not find any example for it, though I ma still searching.

Thank you,

This topic has been closed for replies.
Correct answer Ten A

Which event is triggered by closing the panel?

I want to run a function which saves the session cookies when the panel is closed.


Check below snippets. It might help your work.

//Set session cookie

document.cookie =  "testCookie="+"testStrings"; //Key and Value

//Set persistent cookie

var dt = new Date();

dt.setTime(dt.getTime() + (30*24*60*60*1000));

var ce = "; expires=" + dt.toGMTString(); //persistent cookie needs expires time

var val = "persistentCookie="+"testStrings";

document.cookie = val + ce;

//Get cookies

alert(document.cookie);

//Set and Get localstorage

localStorage.setItem('storageTestKey', "StringFromLocalStorage");

localStorage.getItem('storageTestKey');

4 replies

schroef
Inspiring
March 26, 2020

Can i ask where this is stored? I get the popup but i don't see cep_cache folder appear. Ive also enabled --persist-session-cookies in the manifest
```

<CEFCommandLine>
<Parameter>--persist-session-cookies</Parameter>
</CEFCommandLine>
````

I get the popup with the date and all, but where is this localStorage actually?
 
Ps the code also had an error it is "gExtensionId" solo nothing needs to go before. 
Ive seen this same code in the oersistance panel test from David Barranca  It only stores as long as photoshop is open. But like always, their documentation about session cookies is vague, at least for me it is. Hardly any info
karpiyonAuthor
Inspiring
July 25, 2019

Thank you,

If that means that it will be saved each time the form changes, as you suggest, then i'll attach the save cookies to my main action button.

Ten A
Community Expert
Community Expert
July 25, 2019

I think localStorage is better to use.

Here is an example:

HTML form

<input type="text" name="txt" value="Hello" onchange="storeLocal(this.value)">

JavaScript/ When Text field changed...

function storeLocal (val) {

  localStorage.setItem('formTxt', val);

  }

Run once, when Extension loaded...n once, when Extension loaded.

function init() {

  document.getElementById("txt").value = localStorage.getItem('formTxt');

  }

schroef
Inspiring
March 26, 2020

Tried this and get this error in return

 

 

Uncaught TypeError: Cannot set property 'value' of null

 


EDIT
Quick Googked helped, the input has no ID so i added an id. Now works indeed. But it only works when that get is on the index page, not when i add it to main.js file which has all the code for the panel. Than i get an error again about value. This is nice.

Still wonder then how that cep_cache works and different this is or what we can do with that. I know regular scripts can write some sort of cache so its read back when dialog windows show. So much to learn.... not so much time


Edit 2

well not sure what happened, but it does work from main.js i guess it i didn't do a refresh. can we also store a son file locally or so. I guess using that for settings is easier.

karpiyonAuthor
Inspiring
July 24, 2019

I am using Photoshop and i want to keep the settings even when Photoshop restarts.

Ten A
Community Expert
Community Expert
July 24, 2019

If you want to keep contents until close Photoshop app, set persistent event when your extension initializes.

var csi = new CSInterface();

var event = new CSEvent("com.adobe.PhotoshopPersistent", "APPLICATION");

event.extensionId = csi.getExtensionID(); //csInterface define outside function(global).

csi.dispatchEvent(event);

Photoshop doesn't support "applicationBeforeQuit" event. Therefore you need to save each time when your form changed.

Thomas_Szabo
Inspiring
July 22, 2019

We're using a jquery extension "jquery cookie". Makes setting a cookie easier.
Set the cookie:
var myVar = "something";
$.cookie("xyz", myVar, { path: '/', expires: 365})

Remove the cookie:
$.cookie("xyz", "",{ path: '/', expires: -1})

Thomas

karpiyonAuthor
Inspiring
July 22, 2019

Thank,

Do i define the path for the cookie?

If yes, is it: "C:\Users\<USERNAME>\AppData\Local\Temp\cep_cache\"?

On this page:

https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_8.x/Documentation/CEP%208.0%20HTML%20Extension%20Cookbook.md

it says, regarding cookie location:

  • CEP 6.x and later releases
    • Windows: C:\Users\<USERNAME>\AppData\Local\Temp\cep_cache\
    • Mac: /Users/<USERNAME>/Library/Caches/CSXS/cep_cache/

Each persistent cookie is a file. File name is HostID_HostVersion_ExtensionName, such as PHXS_15.0.0_com.adobe.extension1.

Thomas_Szabo
Inspiring
July 22, 2019

Yes, this is where the cookie is technically stored but this doesn't matter for the creation of the cookie. CEP takes care of storing it in the right file.

The 'path' attribute signifies the URL or path for which the cookie is valid. The default path attribute is set as '/'. This is not the path where the cookie is physically stored. https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie