I am trying to build an OTP autoread in web. I read Chrome provides OTPCredential (here). But the check 'OTPCredential' in window fails on every mobile chrome browser I am trying even when the version is greater that 84. Have they removed the support now?
Check out navigator.credentials, it returns a Promise resolved with the one-time password (code) when the device receives the OTP SMS message containing the requesting URL and the code:
navigator.credentials.get({otp: {transport: ['sms']}})
Related
Web OTP API information provided by https://web.dev/web-otp is good. But demo provided in https://web-otp.glitch.me/ is working as of now with Version 86.0.4240.111 (Official Build) (64-bit).
The main reason I could see is that navigation credentials event for OTP is not getting triggered, and I don't understand why this is happening.
Is it problem with codebase of https://web-otp.glitch.me/ OR chrome mentioned version has any problem?
Steps to reproduce -
Open https://web-otp.glitch.me/ at your mobile browser.
As webpage says, get #web-otp.glitch.me #12345 as text message to your mobile, from unknown number . And you should receive a dialog message, asking you whether you want your browser to input this OTP.
Try changing the host name, incorrect host name may stop the Promise from getting resolved, i.e., navigator.credentials.get
Make sure your last line of text message should be like this:
#<HOSTNAME_OF_WEBSITE> #<OTP>
After some experimenting it only seemed to work if the last line with text before the last line (with the # and #) ended in numbers.
Really weird.
So its like:
OTP code: <OTP>
Ignore this: 1111
#<HOSTNAME_OF_WEBSITE> #<OTP>
I'm trying to modify the content of the clipboard by executing the "copy" command on a focused DOM element. However, the new content comes from the server, and arrives from a websocket, which is then processed in a callback that does not come from direct user interaction.
Because it wasn't triggered by the user, it is not allowed to do such thing as modifying the clipboard content, as specified in the Firefox's MDM website . The error message is:
document.execCommand(‘cut’/‘copy’) was denied because it was not
called from inside a short running user-generated event handler.
To overcome this issue, the same page suggest to request permissions to the browser throught navigator.permissions.query():
navigator.permissions.query({name: "clipboard-write"}).then(result => {
if (result.state == "granted" || result.state == "prompt") {
/* write to the clipboard now */
}
});
However, thought the article they use different names for the permissions:
clipboard-write
clipboard-read
clipboardWrite
clipboardRead
Within the same site, the permissions article shows a browser compatibility table , where it says Firefox supports clipboardWrite from version 51 and clipboardRead from version 54.
The problem is that none of these permissions is working on Firefox (I'm using Firefox 63). The query callback is never called. I have tried the four permission names without any luck.
To make sure the mechanism was working, I tested other permissions, such as notifications which worked flawlessly (It showed "prompt")
navigator.permissions.query({name: "notifications"}).then(result => {
alert(result.state)
});
So my question is: Am I doing something wrong when requesting the permissions, or have this permissions changed whatsoever?
It is intentional, aka. by design in Firefox. They chose to not expose this API to WEB content, only for browser extensions.
See here and more specifically here for your reference:
We do not intend to expose the ability to read from the clipboard (the Clipboard.read and Clipboard.readText APIs) to the web at this time. These APIs will only be usable by extensions...
I am trying to create an Outlook Add-in, but have a problem.
The Office library returned an error when I called Office.context.auth.getAccessTokenAsync running on Outlook for the desktop.
But when I run this program on the web version (Office365) it is working without problems.
How to get AccessToken on Outlook for the desktop?
Office.initialize = function () {};
function testfunction(event) {
Office.context.auth.getAccessTokenAsync(function (result) {
if (result.status === "succeeded") {
//...
}
})
}
Error:
code:13003
message:The identity type of the user is not supported
Using Outlook 2016 (15.0.9126.2152) on Windows 10 Pro.
From the documentation:
13001
The user is not signed into Office. Your code should recall the getAccessTokenAsync method and pass the option forceAddAccount: true in the options parameter. But don't do this more than once. The user may have decided not to sign-in.
This error is never seen in Office Online. If the user's cookie expires, Office Online returns error 13006.
With Outlook, in particular, you will see this using an Outlook.com account (MSA isn't currently supported). You may also get a 13001 if you're using an on-prem Exchange Server without "modern auth" enabled. If this is the case, you will need to enable modern auth to resolve the error.
Please note that your desktop Outlook 2016(15.0.9126.2152) is the MSI (non-subscription) version. getAccessTokenAsync is not supported on that version.
I have been struggling for hours on trying to enable notifications on chrome, on firefox it works perfectly and it works ok as well on localhost url address. But when it comes to non-localhost url address it just doesn't work.
i have been checking on the permissions that are displayed left next to the url input box where you see the website's information and it shows that notifications are permitted, but on advanced settings it shows block with a message "Blocked to protect your privacy" and i am not entirely sure what does that mean.
the code i am trying to execute first is simple:
if(Notifications.permission == "default"){
Notification.requestPermission()
.then(permission => {
console.log(`Permission given is: ${permission}`);
});
}
else{
console.log("Notification permission is: ${Notification.permission}`);
}
The result of this code is Notification permission is: denied meaning that else statement was executed but permission is given as if permission was already requested and denied was the answer of the request.
Can someone explain why does this happen?
I figured out that the problem was comming from loading the website with no TLS https, making some features in chrome to be disabled by design..
I was unabled to figure this out sooner because the host testing i was using was being accessed with 0.0.0.0 instead of localhost which is the one that chrome whitelists for features
I get the following error in Chrome's developer tools window when I try to set a cookie using this jQuery plugin:
Uncaught Error: SECURITY_ERR: DOM Exception 18
What does this error mean and how can I fix it? I get the same error when I use this jQuery plugin.
You're most likely using this on a local file over the file:// URI scheme, which cannot have cookies set. Put it on a local server so you can use http://localhost.
I also had this issue while developping on HTML5 in local.
I had issues with images and getImageData function.
Finally, I discovered one can launch chrome with the --allow-file-access-from-file command switch, that get rid of this protection security.
The only thing is that it makes your browser less safe, and you can't have one chrome instance with the flag on and another without the flag.
You can also "fix" this by replacing the image with its inline Base64 representation:
img.src= "data:image/gif;base64,R0lGODlhCwALAIAAAAAA3pn/ZiH5BAEAAAEALAAAAAALAAsAAAIUhA+hkcuO4lmNVindo7qyrIXiGBYAOw==";
Useful, when you do not intend to publish the page on the web, but instead use it on local machines only.
Faced with the same situation playing with Javascript webworkers. Unfortunately Chrome doesn't allow to access javascript workers stored in a local file.
One kind of workaround below using a local storage is to running Chrome with --allow-file-access-from-files (with s at the end), but only one instance of Chrome is allowed, which is not too convenient for me. For this reason i'm using Chrome Canary, with file access allowed.
BTW in Firefox there is no such an issue.
This error pops up, if you try to create a web worker with data URI scheme.
var w = new Worker('data:text/javascript;charset=utf-8,onmessage%20%3D%20function()%20%7B%20postMessage(%22pong%22)%3B%20%7D'); w.postMessage('ping');
It's not allowed according to the standard: http://www.whatwg.org/specs/web-apps/current-work/multipage/workers.html#dom-worker
I had this issue when using the history API.
window.history.pushState(null, null, URL);
Even with a local server (localhost), you want to add 'http://' to your URL so that you have something similar to:
http://localhost...
I wasn't completely happy by the --allow-file-access-from-files solution, because I'm using Chrome as my primary browser, and wasn't really happy with this breach I was opening.
Now I'm using Canary ( the chrome beta version ) for my development with the flag on.
And the mere Chrome version for my real blogging : the two browser don't share the flag !
One can also receive this error if using the new (so far webkit only) notification feature before getting permission.
First run:
<!-- Get permission -->
<button onclick="webkitNotifications.requestPermission();">Enable Notifications</button>
Later run:
// Display Notification:
window.webkitNotifications.createNotification('image', 'Title', 'Body').show();
The request permission functions needs to be triggered from an event caused by the user, otherwise it won't be displayed.
I was been getting that error in mobile safari when using ASP.NET MVC to return a FileResult with the overload that returns a file with a different file name than the original. So,
return File(returnFilePath, contentType, fileName);
would give the error in mobile safari, where as
return File(returnFilePath, contentType);
would not.
I don't even remember why I thought what I was doing was a good idea. Trying to be clever I guess.