How to use FIDO credentials with WebAuthn on mobile - javascript

I have implemented desktop browser based U2F using the firefox-built-in and chrome-with-javascript U2F API. I've followed the basic recipe here:
https://github.com/castle/ruby-u2f
For each physical device, I have 4 attributes:
certificate
key_handle
public_key
counter
I believe, but I am not certain, that having harvested this information about this physical device, I can now repurpose it when rendering the exact same web page on a mobile device to implement WebAuthn, which, instead of rendering a web page for the user to authenticate, will render a mobile-os-native interface to request NFC authentication (if the device has NFC).
I am trying to use the 4 attributes above to render javascript with nav.credentials.get, but I am stuck.
It's not clear to me which of the following is true
A) You CAN use the credentials / information collected and validated during the U2F device registration process on desktop web for authentication on mobile with web authn
B) If you wish to you use web authn on mobile so it can trigger a native mobile NFC authentication process, you must, in addition to the regular U2F flow, also secretly process webauthn registration (by "secret" i don't mean you're intentionally not telling the user that they're doing this, but rather, the user is unaware of the distinction between A and B).
Following the example linked above, their javascript is something like:
var appId = <%= #app_id.to_json.html_safe %>
var registerRequests = <%= #registration_requests.to_json.html_safe %>;
var signRequests = <%= #sign_requests.as_json.to_json.html_safe %>;
u2f.register(appId, registerRequests, signRequests, function(registerResponse) {
var form, reg;
if (registerResponse.errorCode) {
return alert("Registration error: " + registerResponse.errorCode);
}
form = document.forms[0];
response = document.querySelector('[name=response]');
response.value = JSON.stringify(registerResponse);
form.submit();
});
Using the mozilla example here:
https://developer.mozilla.org/en-US/docs/Web/API/PublicKeyCredentialRequestOptions
I am attempting to adapt that into something like:
var appId = <%= #app_id.to_json.html_safe %>
var registerRequests = <%= #registration_requests.to_json.html_safe %>;
var signRequests = <%= #sign_requests.as_json.to_json.html_safe %>;
var options = {
challenge: new Uint8Array([/* bytes sent from the server */]),
rpId: "example.com" /* will only work if the current domain
is something like foo.example.com */
userVerification: "preferred",
timeout: 60000, // Wait for a minute
allowCredentials: [
{
transports: "usb",
type: "public-key",
id: new Uint8Array(26) // actually provided by the server
},
{
transports: "internal",
type: "public-key",
id: new Uint8Array(26) // actually provided by the server
}
],
extensions: {
uvm: true, // RP wants to know how the user was verified
loc: false,
txAuthSimple: "Could you please verify yourself?"
}
};
navigator.credentials.get({ "publicKey": options })
.then(function (credentialInfoAssertion) {
// send assertion response back to the server
// to proceed with the control of the credential
// update the hidden form input then
form.submit();
}).catch(function (err) {
console.error(err);
});
But it's not clear how I map the U2F attributes to the webauthn attributes. I can't seem to find a concrete example of this working, but I am certain it does work because GitHub and DropBox both have this exact flow - you register the U2F device on desktop web, and then the NFC device is usable on native mobile.
The reason, by the way, that I want to implement this is that the user, on native mobile, never has to leave your web app, the native NFC interface is rendered and they are magically taken back to your web app. What I currently have is, if mobile is detected, render the OTP interface, which requires the user to switch over to an authenticator app like Authy, and then copy the OTP and go back to mobile web. It's much nicer to just pull our your key and buzz it.
Thanks for any help,
Kevin

When using the navigator.credentials.get(), make sure to set the extensions: {appid: u2f_appid}, i.e. the U2F appId parameter during u2f.register call. In my case I used the origins.json trustedfacet list URL.
https://developer.mozilla.org/en-US/docs/Web/API/PublicKeyCredentialRequestOptions/extensions
The reason you need to set extensions.appid parameter is if WebAuthn rpId fails, it will fallback to older U2F using the extensions.appid parameter

Related

Trouble during passing extension data along with session request in QuickBlox

I am working on a project which provides video calling from web to phone (iOS or Android). I am using QuickBlox + WebRTC to implement video calling. From web I want to pass some additional info along with call request like caller name, etc. I looked into the JavaScript documentation of QuickBlox + WebRTC which suggest to use the following code (JavaScript):
var array = {
me: "Hari Gangadharan",
}
QB.webrtc.call(callee.id, 'video', array);
I have implemented the same code but unable to get the info attached with session request on the receiver side (getting nil reference in iOS method).
- (void)didReceiveNewSession:(QBRTCSession *)session userInfo:(NSDictionary *)userInfo {
//Here userInfo is always nil
}
Please use the following structure
var array = {
"userInfo": {
"me":"Hari Gangadharan",
}
}
because our iOS SDK uses "userInfo" as a key for parsing custom user info
Check Signaling v1.0

WebView won't delete cookies/storage even after clearData, no persist value, and terminate - Chrome Kiosk App

I have a Kiosk App that will be used to collect public signups and the signup page is a public website that is displayed in a controlled WebView. I need to clear all of the user's personal data from the WebView cache but can't seem to do that using the Documented procedures.
Here is my WebView markup:
<div><webview id="wv" style="width:100%; height:95%;position:absolute;margin:0px;padding:0px;" partition="extraContent"></webview></div>
Here is the code I use to clear the cache and storage:
var webview = document.getElementById("wv");
var options = {
'since':1000000000
};
var caches = {
"appcache": true,
"cache": true,
"cookies": true,
"fileSystems": true,
"indexedDB": true,
"localStorage": true,
"webSQL": true
};
webview.clearData(options, caches, function() {
webview.terminate();
$("webview").remove();
appendWebview();
});
When clearData didn't do the job, I started terminating the view entirely and adding a new one with the same markup. Yet still I can see personal details when the new WebView loads. Why is this happening and how can I remove the data?
It seems that currently it isn't possible to do what I want (seriously?):
Similar SO Question
There is however a workaround for my particular use case. I can display the local content in a normal view, or even it's own webview, and then use a unique, dummy partition ID for webviews showing web content. When the session should be ended I can generate a new unique partition ID and use that to start a new webview that will not have access to the cache of the previous one.
For anyone else having similar issues, this is not the only unacceptable and buggy behavior I've found on this platform and it should be avoided for serious projects until the Chromium team can produce a more stable product.

Read the phone number of device using javascript [duplicate]

Is there any way to fetch user’s phone number in Firefox OS?
If so, any help would be appreciated.
According to Mozilla's app permissions page, there is an permission called "phonenumberservice" but there is no information about it. Anyway, the permision is listed under the "Internal (Certified) app permissions", which means that, when available, it can only be used by "system-level apps and default apps created by Mozilla/operators/OEMs".
With Firefox 2.0 you should be able to use Mobile Identity API:
https://wiki.mozilla.org/WebAPI/MobileIdentity
https://bugzilla.mozilla.org/show_bug.cgi?id=1021594
I believe the permission is:
"permissions": {
"mobileid": {} }
And it is privileged.
So, as #Jason said, the Mobile Identity API provides this capability, and not just for certified, but for privileged applications. So it is no longer just for OEMs.
The Mozilla Wiki site shows the API:
dictionary MobileIdOptions {
boolean forceSelection = false;
};
partial interface Navigator {
Promise getMobileIdAssertion(optional MobileIdOptions options);
};
The site also provides a sample code skeleton for this:
function verifyAssertion(aAssertion) {
// Make use of the remote verification API
// and return the verified msisdn.
// NB: This is necessary to make sure that the user *really* controls this phone number!
}
// Request a mobile identity assertion and force the chrome UI to
// allow the user to change a possible previous selection.
navigator.getMobileIdAssertion({ forceSelection: true })
.then(
(assertion) => {
verifyAssertion(assertion)
.then(
(msisdn) => {
// Do stuff with the msisdn.
}
);
},
(error) {
// Process error.
};
);
For this to work, you need to add the mobileid permission in the manifest file, for example like this (I made up the description):
"permissions": {
"mobileid": {
"description": "Required for sending SMS for two factor authentication",
"access": "readonly"
}
}
PS: I made this answer, because most answers are outdated, and the one that isn't, does not contain all useful information.
References:
App Manifest Documentation
Firefox Remote Verification

JS OAuth 2.0 on Windows Phone 8.1

So, I'm trying to create a Gitter client for Windows Phone and to do so I need to use Bearer OAuth on their API. This process seems to result in a redirection to a gitter webpage (to get access tokens) and then it redirects to a web page specififed by my application. However obviously an APP is not a web page, so how am I supposed to get the returned temporary access token to use the API?
I've read a little bit about using ms-app://<security identifier> but it's all very fuzzy and little to no information seems to be about using it without using c#, but that's not what I'm looking for.
Any help would be greatly appreciated!
EDIT I just noticed this has been asked here oAuth 2.0 in Windows Phone 8.1 but hasn't been awnsered. Sorry for the duplication.
Seems that it was under my nose the whole entire time!
You can use Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAndContinue(startURI, endURI);
(docs are mainly c# but here: http://msdn.microsoft.com/en-us/library/dn631755.aspx)
i.e
var redirect_uri = 'ms-app://<sid>';
var client_id = '<client id>';
// testing
var requestUri = new Windows.Foundation.Uri(
'https://<site>/?client_id=' + client_id + '&redirect_uri=' + redirect_uri
);
Windows.Security.Authentication.Web.WebAuthenticationBroker.authenticateAndContinue(requestUri, Windows.Foundation.Uri(redirect_uri));
app.addEventListener("activated", function (args) {
if (args.detail.kind == activation.ActivationKind.webAuthenticationBrokerContinuation) {
//take oauth response and continue login process
console.log(args.detail.webAuthenticationResult);
}
//Handle normal activiation...(hidden)
});
source: http://blog.stevenedouard.com/andcontinue-methods-for-windows-universal-apps/

Adobe DPS Android Entitlement

We are stuck with an Adobe DPS project. We cant get our DPS android app to do Entitlement for our print subscribers and we were wondering if anyone out there has managed to get this right.
We've used Adobe's tutorial here:
http://www.adobe.com/devnet/digitalpublishingsuite/articles/library-store-combined-template.html, with isEntitlementViewer set to true.
The code asks for a username and password and then via Adobe's API AdobeLibraryAPI.js, it authenticates a user via our own API. the very same code is working 100% in the iPad version of the app.
The file that actually processes the login (called LoginDialog.js) contains the following code within a function called clickHandler (we’ve added a few javascript alerts to try debug the login process)
// Login using the authenticationService.
var transaction = adobeDPS.authenticationService.login($username.val(), $password.val());
alert("1: "+transaction.state ); //returns “1: 0”
transaction.completedSignal.addOnce(function(transaction) {
alert("2: "+transaction.state ); //never returns
var transactionStates = adobeDPS.transactionManager.transactionStates;
if (transaction.state == transactionStates.FAILED) {
$("#login .error").html("Authentication Failed.")
} else if (transaction.state == transactionStates.FINISHED){
this.$el.trigger("loginSuccess");
this.close();
}
alert("3: "+transaction.state ); //never returns
}, this);
alert("4: "+transaction.error ); //never returns
Anyone out there with some DPS/android/Entitlement experience?
Android Entitlement only works after an integrator ID is registered with Adobe, as the android viewers service routes are only configured via the integrator ID.
If you do not have an integrator ID, you need to acquire one from Adobe Support.
Also it is worth mentioning, that in contrary to iOS, Android DPS viewers only support one base Route/URL for Authentication and Entitlements.
For Example whereas in iOS you can have the login been done via the first URL:
https://example.com/api/v1/SignInWithCredentials
The second URL for entitlements can be on a different URL:
http://server2.example.com/v1/api/entitlements
In android both URLs have to be the same, e.g.:
https://example.com/api/v1/SignInWithCredentials and
https://example.com/api/v1/entitlements

Categories

Resources