Issue with HTML5 Notification and permission - javascript

I'm trying to use the new HTML notification API...
I'm still stuck in the request authorization phase;
when user click on a button it's executed the function:
// this is all inside a click handler
var fn = console.info;
window.Notification.requestPermission(function(grant) {
fn(grant);
});
When i tryed this for the first time in chrome, a chrome's message came out asking me if i want to concede the Notification grant to my localhost web site... I said no (just to test even this case). Then I tried again, but that message from chrome never came out.
My question:
If the user change opinion about notification, how could enable notification for a website?
Maybe do I've to change something in the chrome settings?
Thanks in advance

You can manage and re-allow notifications in Chrome by going to Settings -> Privacy -> Content Settings -> Scroll down to Notifications - here you can manage which sites are allowed to show notifications and which are not.
Update:
As mentioned by #ivan_vaz in the comments, it is also possible to configure this as well as other permissions by clicking the favicon of the website in the address/navigation bar.

Related

Javascript Notification show as 'pop-up'

Currently, I am working on a PWA.
I would like to implement a push notification system, luckily the browser exposes the Push API. I got this part working so far, I can receive the push event in the Service Worker.
But when displaying a notification, the notification is received 'silently' in the background.
What i wish that happened:
But this 'pop-up' style message is disabled by default when the PWA is installed (at least, I think so). The default behaviour causes the notification to only shop op in the notification tray, without ever showing above popup.
When I go the the settings of the PWA's notifications, there is an option to enable pop-up notifications: 'Show as pop-up'
When i enable this options, i get the desired result. However i wish this to be de thefault behaviour, and not have to tell every user of the web app to change the settings on their device.
My used code for the Notification from within my push event listener in the service worker.
self.registration.showNotification('New message', {
body: payload,
});
Testing on Samsung Galaxy S22 with Chrome as the (default) browser.
Does anyone know why this is the default behaviour and if there is a fix for this?
Thanks in advance

Hidden Sign out from all Google accounts in my website

I need to force my users to Sign out from all their Google accounts. I have a link which can do that:
https://www.google.com/accounts/Logout
And also I found a way in javascript how can I trigger this link:
new Image().src = "https://www.google.com/accounts/Logout";
Everything works except incognito mode and Firefox webbrowser.
The result in Web browser console is exactly the same in both situations and also it triggers that endpoint cause I can see entries in Networking which response with status 200, but I am still sign in with accounts.
Do you have any idea what might be wrong? There is no error in console. I do only receive CORS blocked but I don't care about response. I just need to make sure users are logged out before they do next actions in my website.
Do you have any other ideas how can I achieve that?
Thanks in advance

how to make use fake ui permanent in chrome?

I have made an application to record a video by following this steps : https://github.com/muaz-khan/RecordRTC,
I want access to allow the camera always 'allow',
i've tried bypass the allow permission in popup allow webcam use start chrome --use--fake-ui--for--media-stream and it's work for me, but when i closed my chrome and then i opened chrome again , the popup permission allow webcam still showing,
what's the solution?
If you serve your application from an https domain, Chrome will remember the user's answer to the permissions dialog after the first use, so if they use it once, permission is granted (they click "allow"), the next time they use it, permission will be granted automatically and they won't be shown the pop up again.

Chrome Notifications - Magic Push even when the website is not open

I have built a chrome extension in the past and I have used chrome notifications API in that extension so I'm familiar with how it works.
I recently found this website which shows this notifications when something happens but the weirdest part is that even when this website is not opened in any tab it pushes these notifications (as long as chrome is open). I want to know how they do it.
I checked my settings->extensions list to see if I installed their extension somehow but there is none. So where are they running this magic javascript from?
Website is called https://www.greentoe.com
According to the official documentation and as stated by #Andreas
The reason for this is that when a push message is received, the
browser can start up a service worker, which runs in the background
without a page being open, and dispatch an event so that you can
decide how to handle that push message.
The javascript code you are asking for is inside the worker.
If you want to see the workers actually used in your browser just go to chrome://inspect/#service-workers in a new tab. You can see the worker code by clicking on the inspect link under the worker name.

Detecting Chrome Media Settings in Javascript

Chrome has recently released an update to its media settings which prompts a user to grant permission to a site allowing access to his/her microphone and camera. Is there a way to detect these settings in Javascript?
I have a flash player (which will eventually be HTML5 based) with microphone functionality. The player is currently set up with a friendly tutorial on how to grant permission before starting the session. However, since Chrome released the update, the flash player and Chrome permissions are conflicting causing an error in the flash until the user has allowed/denied the Chrome settings prompt. What I'd like to do, until the player is moved to HTML5, is detect if the browser is Chrome (with appropriate version) and if the user's settings aren't set to then show additional tutorial screen.
Couple things:
This is specific to Chromes implementation so you can not tell what permissions the user has granted unless Chrome supplies that information to your app. I.E. there is no API you can query for this info.
It's not even something that Chrome stores. If you look under the advanced settings tab on this page, you will see that its on a per app basis not a one time thing. Chrome will only remember what permission was granted for a specific application if that app asks for the permission over https. If it asks for it over http then it will forget what permissions were granted.
Your best bet (though by no means full-proof) is to sniff out the browser agent and version. For one of the better implementations of this see here.
You will want to specifically look for Chrome and any version >= 21. (21 was the version that introduced the getMediaApi). Then it's a simple if check:
if (version >= 21){
//ask permission though the getMediaApi
} else{
//ask permission though flash
}
i stumbled into an approach for this that works fairly well, and doesn't require cookies (people can change these settings out-of-band, so the cookie can become incorrect), or for Chrome to provide an ounce of help (it doesn't).
if (chrome) {
var madeMicDecision = false;
navigator.getUserMedia({whatever},
function(stream) {
madeMicDecision = true;
//close the stream, move to the next page
//they have either just granted permission, or have in the past and it's remembered
},
function(error) {
madeMicDecision = true;
//go to error handling page
//the error handling page should describe going to chrome://settings/contentExceptions#media-stream
//or how to allow the user media via clicking on the crossed out camera icon in the 'wonderbar'
}
}
But we also want to show the tutorial screen - the above code will pop the chrome infobox if the permission setting isn't remembered. But without permission events from chrome, or an API to query permissions, how do we know when to show the chrome+infobox tutorial content?
My trick was to show the content automatically, but only after a delay. People who have accepted or denied permissions previously would never see this content, because our success/error handler would have moved them on before the delay. So, give the getUserMedia call a moment to detect/react - if the browser hasn't moved on, it's time to show the help content.
setTimeout(function() {
if (!madeMicDescision) {
//display chrome/infobox/getUserMedia permissions help content
}
}, 2000);
Not perfect (bizarre and sad really), but seems to work for the most common cases.

Categories

Resources