Jump to content
COMFIED

Facebook or Google OAuth

Recommended Posts

I was looking for that too, but seems nobody did it yet (I hope I'm wrong).

Right now I'm playing with SMS IDE learning how it works (You know, one month to decide if buy a license or use free compiler instead).  If no body else does it in the while, then I'll do it because I need it in our next project.

Share this post


Link to post
Share on other sites

I just committed the TypeScript header translation for the FaceBook SDK. Maybe that helps.

 

You can find it at:

 

https://github.com/SmartMobileStudio/APIs/tree/master/Facebook

 

And the example about how to use it can be found here:

 

https://github.com/SmartMobileStudio/Examples/tree/master/Facebook%20SDK

 

Note: In order to test the login example make sure you have registered an app ID at Facebook. This ID must be supplied to the example and the code must be uploaded to the website URL specified. This makes testing not straight forward, but it's at least secure.

Share this post


Link to post
Share on other sites

I thought I'd test this. When I try to compile, I get an error in FaceBook.SDK.pas:

Syntax Error: Class "JFBUIParams" isn't defined completely [line: 15, column: 35, file: FaceBook.SDK]

Edit: Got the SDK to compile by changing into this:

  JFBUIParams = class external
  end;

 

Share this post


Link to post
Share on other sites

Does anyone have a working example of how to use Google's Sign-In api via their platform.js? I can find documentation and js code:

https://developers.google.com/identity/sign-in/web/sign-in

https://www.intricatecloud.io/2019/07/adding-google-sign-in-to-your-webapp-using-the-js-library/

...but as I'm not at all used to using promises, I feel there's quite a learning curve here for me. With a working example I could turn it into an easy-to-use component in no time.

Share this post


Link to post
Share on other sites

Works from server only, the one specified in the credentials page

var document external 'document': variant;
var console  external 'console':  variant;
var gapi     external 'gapi':     variant;

implementation

{ TForm1 }


procedure TForm1.InitializeForm;
begin
  inherited;
  // this is a good place to initialize components

  var Script := document.createElement('script');
  Script.src := 'https://apis.google.com/js/api.js';
  Script.setAttribute('async','');
  Script.setAttribute('defer','');
  document.head.appendChild(Script);
  Script.onload := procedure
  begin
    writeln('loaded');
    //
    // Load the API client and auth2 library
    gapi.load('auth2', procedure
    begin
      var mypromise : variant;
      mypromise := gapi.auth2.init(class
        clientId = '..........s0m9qrp8u2m6dcivi8p09tu5se.apps.googleusercontent.com';
      end);
      mypromise.then(procedure begin console.log(mypromise.isSignedIn.get()); end,
                     procedure begin console.log('error'); end);
    end);
  end;
end;

logs 'loaded' and 'true'

your other link does specify useful functions which can be added to the above

 

 

Share this post


Link to post
Share on other sites

@lynkfs Oh, that helped so much! I've struggled at the concept of calling these external js apis when class references don't exists and also had no experience with using promises. But you helped me get going and now I'm making very good progress 🙂

Now I have TW3FacebookLogin- and TW3GoogleLogin-classes that both work. I'll have to read up a bit to add the necessary parameters (besides ClientId of the app), but I should be able to get them into alpha and component palette next week.

Share this post


Link to post
Share on other sites

@jarto unearthed an interesting problem to do with promises

Basically the <promise>.then function has as parameters 2 call back functions. 
The first one will be executed on success, the second if there is an error.

mypromise.then(procedure begin ...success... end, procedure begin ...error... end)

This works fine. 

However defining these callbacks as regular external procedures and substituting these in the promise function call goes awfully wrong :

  procedure SuccessProc;
  begin
    writeln('success');
  end;

  mypromise.then(SuccessProc, ErrorProc);

This construct triggers BOTH of the async callbacks

Obviously not good.
This is either a subtle compiler problem or an elusive scope issue


A middle ground approach though works again as expected :

      SuccessProc :=  function(value:variant) : variant begin writeln('success'); end;
      ErrorProc   :=  function(value:variant) : variant begin writeln('error'); end;

      mypromise.then(procedure(Value: Variant) begin SuccessProc(Value) end, procedure(err: Variant) begin ErrorProc(err) end);

(here using the rtl-api-ecma-Ecma.promise unit) 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...