How can i push notification on my web app - javascript

I wanted to add a push notification system on my web app.
Example:
one user is clicking on the button of one website. a second user is
notified about the click like a push notification
I tried a lot of things: Notification push with services workers but I am stuck when it is necessary to use his own server because there is only me who can be notified with my Key.
Please help!

One way I would recommend is to use OneSignal.
It has APIs and well written document. It is easy to get it to work too.

Related

Web Push Same Subscriber Different Endpoint Issue

I am trying to implement the web-push service in one of my projects. So, I actually need to know the actual subscriber numbers in my app. So what problem I am facing is, the service worker generates new endpoints for the same user and I didn't find any unique thing by which I can figure out if the subscriber exists or not.
All my users are also guest users so I don't have any unique thing. There is also an event called onPushSubscriptionChange which doesn't also work in other browsers except for Mozilla.
So is there any way to uniquely identify a user? Like if multiple endpoints are created for the same user then I want to replace the old endpoint with the new one in my database. I am not willing to use cookies also.
Another thing is does firebase cloud messaging solves this issue?
Thank you

Building a javascript web analytics tool from scratch

I am fairly new to javascript, I do know basics. I am looking to build my own (from scratch) java script library just like google analytics.js that will track user behavior on websites. Basically I'm looking to collect data like
Click through data
Dwell time
Page hits etc..
I spent lot of time trying to find website/tutorials to get me started on this but I keep ending up on google analytics.js or some private tools.
What I am looking for :
Is there any good starting point/resource/website which can help me build this js library
Are there reference for archetecture of end to end system including back-end?
Any open-source library that I can directly use?
Some things I already looked into
Chaoming build your own analytics tool
Splunk BYO analytics
At it's most basic, the architecture of such an application would only require a client, server, and database.
You can use basic javascript functions to record specific user actions on the frontend and then push them to your server. To identify your users you can set a cookie with a unique id. Then, everytime you send data to your server, you will get the specific user request as well so you can keep track of their actions. (Be careful of privacy laws first though).
For page hits, simply send a response to the server everytime someone opens your site - so call this function as soon as your Javascript loads. On the server, send a request to increment the appropriate value in your database.
For user dwell time, write a function that records the date when the user first hits your site and then count how long they stay there. Push your data to the server every so often and save updates to the user record by adding the new time spent to the current time spent. You could also watch for when a user is about to exit out of the site and then send the data all at once that way - although this method is more fragile.
For clicks and hovers, set up onclick and mouseover event handlers on your links or whatever elements you want to track. Then push the url of the link they clicked or whatever data you want - like "Clicked navbar after 200 seconds on site and after hovering over logo`.
If you want suggestions on specific technologies, then I suggest Node.js for your server side code and MongoDB for your database. There are many tutorials out there on how to use these technologies together. Look up javascript events for a list of the different things you can watch for on the frontend.
These are the building blocks you need. Now you just have to work on defining the data you want and using these technologies to get it.

How do I detect which push notification device a user currently using?

I would like to show a list of devices that a user has enabled push notifications for in their dashboard. In this list I would like to highlight the current device they are using if it's in the list or show a "Add this device" button if it's not in the list. So let's say the user has enabled push notifications on their phone and on their desktop. They log into the dashboard on their phone. Is there a way for me to tell that it's their phone? Also, what if they decide to block notifications in their browser or do a factory reset (my database won't sync obviously)? So what would be a good way to purge that old device from the list?
I'm doing this because I want a good user experience and I want to give users the option to toggle push notifications on/off per device through the dashboard without making them do it through the browser which could end up in them never re-enabling them again.
I was thinking maybe passing a hardcoded (but generated) id variable into the service worker?
let deviceId = 0;
But this seems really clunky. Is there a better way?
PS. My backend is PHP and MYSQL. Don't think it matters, but any answers with server-side code I'd prefer with those. I think this is all client-side though.
If the user resets the browser (device), you will only discover it by trying to send something and getting a 404. So it's not possible to always be able to show a list of devices with 100 % correct info if you're not spamming the user all the time. You could probably show something like the last time a push was delivered to a certain device, maybe that would be good UX-wise.
To detect which of the devices is the current one looking at the list, simply use some sort of an id that is saved in the db when the push subscription is created. Then hold on to that id in the device (browser) and based on that, make one of the items on the list pop up.

Custom web page and javascript routine running in the background

The Dynamics documentation is just awful and I couldn't find an answer to this simple question:
In the web version of the CRM, is it possible to register a web page that can be toggled by the user and that itself has an internal state (updated regularly by an interval set with setInterval) that will persist even if the users closes the page (not the entire CRM, just the sub-page)?
We need the user to provide some information for a CTI integration, and this background process to keep alive the CTI session by polling an API while the user session is active. In addition, we need to reuse the component where the user provides the CTI information to be notified if the session fails and restore it or close it if necessary. The real purpose for this is to make a screen pop (push content information about the incoming call to the agent) which I know can be done using Xrm.Utility, although doing it with a REST API method would be much better, RouteTo Aciton looks like the best method to do this, but I'm not sure it will proactively show the item in the user's browser.
I'm not sure this question is as simple as you suggest, it seems relatively complicated, and involves an integration. I'm not suprised the Dynamics documentation doesn't provide an answer for this specific and unique scenario.
I don't believe there is any single feature within Dynamics that will meet this requirement.
You could use a HTML web resource or a web page from a seperate web site iframed into CRM. I think the possible use of these depends on your expected user experience; I believe the user would need to have the page loaded at all times showing these controls (e.g. user is looking at a dashboard) - I don't see how the controls could interact with the user client side otherwise. You could show the controls in multiple places however.
Xrm.Utility is one way to open a record, but it can also be done by Open forms, views, dialogs, and reports with a URL.
RouteToAction looks like it just adds a record into the user queue, the user would need to refresh the queues to see the changes. I don't believe there is any way for a server side REST API call to natively redirect the user.
You could add JavaScript to do this, however you might struggle to add the JavaScript into every page of CRM.
Where I have worked on a CTI integration in the past (assuming you mean computer telephony integration), we always had some other component doing the screen pops - the client's all had a desktop app installed as part of the telephony solution.
Perhaps you could look into browser notifications, or a browser plugin?

Highlight a new feature added to angularjs single page application for first time login

Our application is Angularjs single page application, we developed a new feature and we are going live on new feature(service customer can use), so we want to notify the logged in user to that this feature is added and he can use it.
We want a small animation symbol(info symbol) with a tooltip kind of thing displayed when user log ins. We want to show this only a few times(mostly 2 or 3 times he logs in after releasing this feature)
Please suggest a way to achieve this. Ours is angularjs application.
In the stackoverflow documentation tab we can see blue animated bubbles for help as in attached screen, we need similar to that.
Animated bubble for help
Please suggest open source stack. Thank You.
based on what i understand.
I think this is easy and common, you need a database to store the login attempts(you need an let your backend team to expose an api where you can call to insert new login record to the database) and another api to check the login records for the user.. i guess that it is all about.
for short: (i assume you know backend/frontend things and the Rest API)
API for inserting record to database for every successful login
API for getting login records

Categories