Page 1 of 1

How to Save and Use Login Credentials on Login Pages

Posted: Thu Aug 26, 2021 9:13 am
by JohnT
Hi All,
I must be not understanding something. If I save credentials in Chrome or FF I navigate to login page of site and all is well Username and Password are filled in automatically.
When I try the same thing using CEF4Delphi TChromium credentials are never saved and I can work out why. Does the credentials automatically populate or do I have to call a method to do that based on the URL loaded. I have tried to find example in Demo projects and searching internet but have not yet found answer.

I have already set the following in DPR file:

Code: Select all

  GlobalCEFApp                        := TCefApplication.Create;
  GlobalCEFApp.RootCache              := 'D:\Documents\DelphiProjects\XXX_CefDownloadURLDemo\cef\rootcache';
  GlobalCEFApp.cache                  := 'D:\Documents\DelphiProjects\XXX_CefDownloadURLDemo\cef\rootcache\cache';
  GlobalCEFApp.UserDataPath           := 'D:\Documents\DelphiProjects\XXX_CefDownloadURLDemo\cef\userdata';
  GlobalCEFApp.PersistUserPreferences :=True;
  GlobalCEFApp.PersistSessionCookies  :=True; 
I can see files being created in these locations but still user data is not populated on login page.
Any help / Advice is most appreciated.

Thanks,
John.
Delphi 10.4.2 on Win10
CEF4Delphi 91.1.22 which includes Chromium 91.0.4472.124.

Re: How to Save and Use Login Credentials on Login Pages

Posted: Thu Aug 26, 2021 9:55 am
by salvadordf
Hi,

Setting a cache directory is usually enough to save the credentials because the session cookies are not deleted.

Run the MiniBrowser demo and navigate to some websites. Close it, then open the Cookies file inside the cache directory with SQLite Expert Personal and you will see all the browser cookies.

However, if you need the "automatic form fill" feature found in Chrome then you have to implement it from scratch because it's not included in CEF.

To implement that feature you would have to use the GlobalCEFApp.OnFocusedNodeChanged event which is executed in the render process to check if the focused element is a username or password field. Then send a message to the main browser process if you need to fill that field with with the user credentials and execute some custom JavaScript code to fill the credentials.

Re: How to Save and Use Login Credentials on Login Pages

Posted: Thu Aug 26, 2021 10:23 am
by JohnT
Thanks Salvador,
Thanks so much for your quick reply. Most Appreciated.
Unfortunately I'm actually not familiar with JS. Is there any example or tutorial showing this technique that you could refer me to?
Thanks,
JT

Re: How to Save and Use Login Credentials on Login Pages

Posted: Thu Aug 26, 2021 11:14 am
by salvadordf
The DOMVisitor demo has most of the code you need.

Run it and right-click on the web page when it finishes loading. Then select the "Set INPUT value using JavaScript" option to set value of the search box to "qwerty".

The basic JS code to change the value of an INPUT element is this :

Code: Select all

document.getElementById("INPUT_NODE_ID").value = "qwerty";
Replace INPUT_NODE_ID with the ID attribute of the INPUT element.

Not all login forms have the same element IDs for the user credentials.

However, if you're not familiar with JavaScript the first thing I would recommend is to read a tutorial about JavaScript and HTML if necessary.

Re: How to Save and Use Login Credentials on Login Pages

Posted: Fri Aug 27, 2021 4:48 am
by JohnT
Hi Salvador,

Many thanks for pointing me in the right direction. Between the reading I have done and the demo code you have referred me to, I'm sure I'll now solve this.

Kind Regards,
John