How to Save and Use Login Credentials on Login Pages

Post Reply
JohnT
Posts: 6
Joined: Tue Aug 17, 2021 5:02 am
Location: Australia

How to Save and Use Login Credentials on Login Pages

Post 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.
User avatar
salvadordf
Posts: 3067
Joined: Thu Feb 02, 2017 12:24 pm
Location: Spain
Contact:

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

Post 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.
JohnT
Posts: 6
Joined: Tue Aug 17, 2021 5:02 am
Location: Australia

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

Post 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
User avatar
salvadordf
Posts: 3067
Joined: Thu Feb 02, 2017 12:24 pm
Location: Spain
Contact:

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

Post 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.
JohnT
Posts: 6
Joined: Tue Aug 17, 2021 5:02 am
Location: Australia

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

Post 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
Post Reply