I have a task to create SPA that will be using Evernote account data. For authetication I want to use Oauth.io service.
"Try auth" button from Oauth.io site works fine. I see popup with prompt to sign in.
In my app html I have a simple button:
<button id="login-evernote-btn" type="button" class="bx-button bx-button-accept" onclick="app.loginWithEvernote();"><i class="fa fa-sign-in"></i> Evernote Login</button>
and my JS application:
//Constructor
function Application() {
OAuth.initialize('HERE_PASTE_MY_PUBLIC_KEY');
};
/*----------------------------*/
/* Application methods */
/*----------------------------*/
Application.prototype.loginWithEvernote = function() {
OAuth.popup('evernote', function(error, success){
});
};
// Create application Object
app = new Application();
But after clicking on my button I see splash window that closing in second. I can't enter my credentials.
What step I am doing wrong?
After successful authetication I want to use Evernote API to list all notes.
You need to log the error to see what is the problem with the popup. That maybe the domain whitelist or using 'evernote' provider instead of 'evernote_sandbox'
According evernote-sdk-js on github, you can use your token this way
Application.prototype.loginWithEvernote = function() {
OAuth.popup('evernote').done(function(evernote) {
var client = new Evernote.Client({token: evernote.oauth_token});
var noteStore = client.getNoteStore();
notebooks = noteStore.listNotebooks(function(err, notebooks) {
// run this code
});
}).fail(function(e) {
console.error(e)
});
};
Related
I have a web page where I implement ADAL.JS.
When browsing the page via the web it works perfectly; however when I try to view it on an iPhone, and I have saved it as a shortcut on the desktop using the Add to Homescreen button, things go haywire.
The initial page (index.html) shows correctly using the apple-mobile-web-app-capable meta tag; however, when the authentication is invoked, I am taken to a real browser window. Once redirected back to index.html, I am still in the separate browser window not the Web App view.
Ultimately, I want to have this as an offline web site with all page functionality running in the view produced by apple-mobile-web-app-capable. Any other ideas as to how to implement this are appreciated.
Thanks in advance.
This is one of the big problems currently existing in iOS webapps. Every link or redirection opens up in a new window.
You can fix it changing window.location.href with JavaScript.
Seem to be missing something...I get at urlNavigate not defined error...suggestions?
alert('Running Auth');
online = navigator.onLine;
authContext = new AuthenticationContext({
tenant: azureTenant,
clientId: azureClientId,
postLogoutRedirectUri: window.location,
//redirectUri: "https://shlpkpiapi.azurewebsites.net/kpiapp/test.html"
});
authContext.config.displayCall=function(url){
if (urlNavigate)
{
this.info('Navigate to:' + urlNavigate);
window.location.href=urlNavigate;
}
else
{
this.info('Navigate url is empty');
}
}
if (authContext.isCallback(window.location.hash)) {
authContext.handleWindowCallback();
var err = authContext.getLoginError();
if (err) {
alert('Error on callback')
}
}
else {
var user = authContext.getCachedUser();
if (user) {
//We have a user in cache and are using those credentials
console.log('Signed in as: ' + user.userName);
} else {
console.log('Not signed in.')
if (online)
{
alert('signing in');
authContext.login();
}
else
{
alert('currently offline');
}
}
}
Ok...I made the change and the error is gone but I don't understand how this is supposed to address the issue. When I add my page to my IPhone home screen (https://xxxxx.azurewebsites.net/app/test.html) and then click on the tile I am taken to the test.html page. On that page page there is an auth function that executes which uses adal.js and takes me to "https://login.microsoftonline.com/xxx.onmicrosoft.com/oauth2...". This shows up in the scope of my IOS Web app and has my account listed and the Use another account option. I click on my account or choose the Use another account option and I am taken to another page that is opened in Safari.
I've built a Chrome Extension that takes a selection of text and when I right click and choose the context menu item, it sends that text to my Meteor app. This works fine, however, I can't figure out the process of using Oauth to authenticate users.
I'm using this package: https://github.com/eddflrs/meteor-ddp
Here is the JS within background.js (for Chrome Extension):
var ddp = new MeteorDdp("ws://localhost:3000/websocket");
ddp.connect().then(function() {
ddp.subscribe("textSnippets");
chrome.runtime.onMessage.addListener(function(message) {
ddp.call('transferSnippet', ['snippetContent', 'tag', snippetString]);
});
});
Here is the relevant portion of my other JS file within my Chrome Extension:
function genericOnClick(info) {
snippetString = [];
snippetString.push(info.selectionText);
var snippetTag = prompt('tag this thing')
snippetString.push(snippetTag);
chrome.runtime.sendMessage(snippetString);
}
And here is the relevant portion of my Meteor app:
'transferSnippet': function(field1, field2, value1, value2) {
var quickObject = {};
quickObject.field1 = value1[0];
quickObject.field2 = value1[1];
TextSnippets.insert({
snippetContent: value1[0],
tag: value1[1]
});
}
Basically I'm stuck and don't know how to go about making a DDP call that will talk to my Meteor app in order to authenticate a user
This question is a bit old, but if anyone is still looking for a solution. I had a similar problem that I was able to solve using the following plugin: https://github.com/mondora/asteroid. Here is an example of how to do it for twitter oauth:
https://github.com/mondora/asteroid/issues/41#issuecomment-72334353
I have a chrome Apps use push notification of GCM. I have a problem, when i don't login account on chrome. I can't receive registerId from GCM. I think a idea. When registerId empty, i show notification, request user login to chrome and show login page account on chrome. But because of security concerns , the chrome does not allow access to its setting from external links . How is open "chrome://settings/" from external links? Can register to gcm, If i don't want login account on chrome?
My code:
function setValue()
{
//var thongtin=$('#status').val();
//var thongtin = document.getElementById('status').innerText;
if(registrationId == "")
{
// Pop up a notification to show notification.
chrome.notifications.create(getNotificationId(), {
title: 'CLOUD MONITOR',
iconUrl: 'gcm_128.png',
type: 'basic',
message: 'You must sign in account gmail on google chrome!'
}, function() {});
//event click to notification
chrome.notifications.onClicked.addListener(function() {
window.location.href = "chrome://settings/"
});
}
else
{
//http://mtraffic.longvan.net/device_register?regId=" +registrationId+"&device=android
//document.getElementById('webviewSendData').src = "http://192.168.64.246:8080/register?REGID=" +registrationId+"&DEVICE=desktop";
document.getElementById('webviewSendData').src = "http://mtraffic.longvan.net/device_register?regId="+registrationId+"&device=android";
//document.getElementById('webviewSendData').src = "http://192.168.64.124:8080/monitor/device_register?regId=" +registrationId+"&device=android";
//var url = "http://192.168.64.124:8080/monitor/device_register?regId=" +registrationId+"&device=android";
//httpGet(url);
//alert(thongtin);
//document.getElementById('status').innerHTML="Infomation New";
// Pop up a notification to show notification.
}
}
This code don't run.
chrome.notifications.onClicked.addListener(function() {
window.location.href = "chrome://settings/"
});
I fix code as Derek 朕會功夫.
chrome.notifications.onClicked.addListener(function() {
chrome.tabs.create({url: "chrome://settings/"});
});
And receive error notify: Error in event handler for notifications.onClicked:TypeError: Can't read property 'create' of underfined.
I'm afraid at the moment it's not possible.
Chrome Apps don't have access to tabs/windows API that can open privileged pages; that's why Derek's suggestion does not work.
In future, they may be a way to do this with chrome.browser API. See this feature request, this proposal, and please leave feedback there with your use case.
Sorry for a big edit. I am starting over as I am not stating my question correctly.
I am trying to write a client side app in HTML5. I do not want it to be hosted on a website. I am not even sure this is possible, I am fairly new to this type of application.
Anyway, I want to access Google services, which requires authenticate such as OAuth. Being that it is javascript, it sounds like OAuth2 is what I need.
I am trying to open up the google authentication in a popup (I have this part), let the user allow access, and then pass flow back to my application which can then query Google services. Problem is either 1. it asks the user to copy/paste a token into the app whenever I use response_type=code, but if I use response_type=token it requires that I redirect back to a valid URL which, since this is not hosted on a webserver, there is none.
So how can I use OAuth, and let the user grant access seamlessly?
You should have some Redirect URL defined for Google to redirect to after the authentication is done. If you cant host your pages on any web site, you can very well host it in local host.
Regarding getting the access token from the popup to the main parent window, you can setup a timer in parent window which keeps on checking the document location of the popup. Once the document location matches the Redirect URL, u can parse the access token which will will be in the URL itself.
I wrote a tutorial on exactly the same problem (using local host) yesterday and here is the link:
http://www.gethugames.in/2012/04/authentication-and-authorization-for-google-apis-in-javascript-popup-window-tutorial.html
Hope you will find it useful.
To avoid a potential click jacking, Google authentication forces you to go to a full page login. I don't think you can control that.
EDIT after comment, here is a code extracted from the Google OAuth2 page that does it:
<body>
<a href="javascript:poptastic('https://accounts.google.com/o/oauth2/auth?scope=https://www.google.com/m8/feeds&client_id=21302922996.apps.googleusercontent.com&redirect_uri=https://www.example.com/back&response_type=token');">Try
out that example URL now</a>
<script>
function poptastic(url) {
var newWindow = window.open(url, 'name', 'height=600,width=450');
if (window.focus) {
newWindow.focus();
}
}
</script>
</body>
I believe you can use google api (gapi) for Oauth in Javascript.
Here is the documentation: Authentication using the Google APIs Client Library for JavaScript
You will not require the user to copy/paste any codes and you will not require to provide a redirect uri
All you need to do is: Go to your project in Google Developers Console and generate the following:
1. Generate new Client Id and choose options 'Installed Application' and 'Other'.
2. Generate a Public API Key
Sample Code from the above documentation:
// Set the required information
var clientId = 'YOUR CLIENT ID';
var apiKey = 'YOUR API KEY';
var scopes = 'https://www.googleapis.com/auth/plus.me';
// call the checkAuth method to begin authorization
function handleClientLoad() {
gapi.client.setApiKey(apiKey); // api key goes here
window.setTimeout(checkAuth,1);
}
// checkAuth calls the gapi authorize method with required parameters
function checkAuth() {
gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult); // scope and client id go here
}
// check that there is no error and makeApi call
function handleAuthResult(authResult) {
var authorizeButton = document.getElementById('authorize-button');
if (authResult && !authResult.error) {
makeApiCall();
}
}
// API call can be made like this:
function makeApiCall() {
gapi.client.load('plus', 'v1', function() {
var request = gapi.client.plus.people.get({
'userId': 'me'
});
request.execute(function(resp) {
var heading = document.createElement('h4');
var image = document.createElement('img');
image.src = resp.image.url;
heading.appendChild(image);
heading.appendChild(document.createTextNode(resp.displayName));
document.getElementById('content').appendChild(heading);
});
});
}
I've written a mini JS library for the task, take it and see if it works for you.
https://github.com/timdream/wordcloud/blob/6d483cd91378e35b54e54efbc6f46ad2dd634113/go2.js
I am recently developing another project that rely on the same script, so I am isolating this one into an independent library project ... check the progress follows (if there are).
I'm trying to logout of facebook from my App using the following code below, but i'm still logged in (and my alert does not execute)
also note, this is an external App, using the facebook API.
any ideas?
FB_RequireFeatures(
["Api"],
function(){
FB.Facebook.init(api_key, channel_path);
var api = FB.Facebook.apiClient;
FB.Connect.logout(function(){alert("logged out!");})
}
);
With the new JavaScript API, you can do:
FB.logout()