Dynamically updating page if user connects/disconnects from Facebook? - javascript

Is there a way to dynamically update a page when the user connects/disconnects the app from his facebook?
I.e using one of the event subscriber methods that come with the javascript SDK?
I'm trying authResponseChange however my callback function doesn't seem to get called if I delete the app from my facebook account.

Try to also register to the auth.statusChange event, though from my experience neither are really reliable.
You can know on the server side when a user deauthorizes your app, in the app settings > Advanced tab there's the field Deauthorize Callback where you can put a url in your server which will be pinged when a user removes the app.
With that you can then synchronize your client somehow.

You can manually check if a user is logged in, but hasn't authorized your app, using FB.getLoginStatus, passing a callback function in (see here in the Facebook JS SDK docs). Could you use the already existing events, and then perform checks of this kind each time? Maybe subscribe to the auth.authResponseChange and auth.statusChange events, and then call FB.getLoginStatus to see if it's changed.

Related

How to recognize start of authentication flow in new Google Identity Services library?

While migrating to the new Google Identity Services client library, I noticed that there is no way to get notified when the authentication flow actually starts, i.e. when the user has clicked the Sign in with Google button. Such a callback, however, is needed to instruct other (React) components to reset their state, especially when performing multiple login attempts upon failure and mixing this with a password-based sign in or other social providers.
Previously, this was possible by overloading the button's onClick handler. This approach does not work anymore since the button will be injected as an iframe.
How can I now recognize when a user has clicked Sign in with Google?
See JavaScript API reference: https://developers.google.com/identity/gsi/web/reference/js-reference
You can now use the click_listener property to specify a function to be called when the Sign in with Google button is clicked.
The property is also available in the HTML reference documentation

How to send a page_view event from an SPA (single page app) web app using Firebase Analytics?

I have an SPA web app that I've built using React + Firebase.
I am now using Firebase Analytics and I would like to log page_view events for pages that are client-side routes (since I have my app is a Single Page App).
I didn't find anything about Single Page Apps in Firebase Analytics docs.
https://firebase.google.com/docs/analytics/events
But I did find something in the gtag.js docs.
From: https://developers.google.com/analytics/devguides/collection/gtagjs/single-page-applications
From: https://firebase.google.com/docs/analytics/events#log_events_3
You can find implementation details for several events and their parameters in the gtag.js event reference.
And from that event reference, we get that:
From the image above, we can see that the page_view event doesn't seem to have any parameter associated with it.
QUESTION
I can see that Firebase Analytics already sends the first page_view event, after my app is first loaded.
But once my users click on my internal links and change its browser URL (client side routed, no server calls), how can I trigger another page_view event for the new URL that was generated by react-router-dom ?
How can I implement this using Firebase Analytics? Do I need to update the page path before sending the event like it says on the gtag.js documentation? How can I do it?
Since your app is a single-page application, there is only a single page_view event. That is actually the correct behavior, because it means you can use page_view events to track how often the application/page was loaded.
When a specific screen is shown in your application, you'll want to fire a screen_view event. For an example of this, see the AngularFire library's documentation on tracking screen views.

Service workers - simplest implementation

I'd like to implement service workers instant load for my website with the simplest implementation possible.
My idea is this - user opens webpage, gets cached version (app shell) and after the server return original content, it will be rerendered. Is that even possible? I couldn't find any example of that.
When the fetch event is called for the request then respond with the app-shell from the cache. and then wait Untill your server respond with the result then use postMessage to send the data to the browser. In your website's javascript add a message event listener and fills the data you receive, in the app-shell using javascript html. your app-shell must have some empty component that can be filled later.
For code reference refer to this link.
https://serviceworke.rs/strategy-cache-update-and-refresh.html

Server Sent Events with Hybrid Application

I'm working on a hybrid app that is based on Angular 1.5. In part of the app now, the client wants a messaging system for the admin of a group to be able to message the normal worker/user. I want to check and see if this is done, would server sent events be the solution? If so, do I continue to let it run as the user has the app open? How does this affect performance?
I am presuming authentication would need to be performed against users in order to differentiate between admin and worker accounts.
Have Angular send AJAX calls to your server, which will check the users' authentication status before the client-side view is rendered.
You should research the resolve property in Angular in order to implement this type of solution.

Store content offline until connection is established

I am hoping for some help regarding an offline iPad application.
I have a form within the app that the user fills in, this form then links to a PHP script online. Obviously you can't run the script until you are on line. Is there any way at all of clicking the form submit button, if there is a connection it will connect to and run the PHP and if there is no connection it will automatically run the php in the background when a connection becomes available.
I have tried a number of different searches but have still been unsuccessful.
Thank you in advance!
It most likely is possible to solve this problem with JavaScript, but that's not so straightforward. Since you are dealing with an iOS app where it is possible to check network connection status and listen for changes, you probably should create a service that receives the form data within your app. That service should store the data locally, find out when your target server is accessible and send it.
UPDATE:
If you are dealing with a web-app, the way to go for it still to implement a service in JavaScript that uses timed events (i.e. setTimeout() or setInterval()) to check connection status. Upon submitting the form, prevent the default behaviour so the form is not submitted traditionally. Instead, store the data locally in sessionStorage or localStorage and when your service finds the target server available, read the locally stored data and send it via AJAX.

Categories

Resources