how to use ember simple auth without ember cli or AMD - authentication

we are re-writing our web application in ember.js. we use our rest api and the api uses oAuth 2.0 authentication system. Now, we are trying to use ember simple auth https://github.com/simplabs/ember-simple-auth and we also tried to use https://github.com/Vestorly/torii but it seems both needs to have AMD loader or ember cli. Unfortunately we are not using any of them. I would like to know what people using for authentication for oAuth2.0. Thanks in advance.
Update:
I downloaded ember simple auth 0.7.0 from distribution. But how do I configure with my ember application. I tried use it like this; But it didn't work.
Ember.Application.initializer({
name: 'authentication',
after: 'simple-auth',
initialize: function(container, application) {
var applicationRoute = container.lookup('route:application');
var session = container.lookup('simple-auth-session:main');
// handle the session events
session.on('sessionAuthenticationSucceeded', function() {
applicationRoute.transitionTo('index');
});
}
});
var ApplicationRouteMixin = requireModule('simple-auth/mixins/application-route-mixin')['default'];
in my route like this:
App.ApplicationRoute = Ember.Route.extend(SimpleAuth.ApplicationRouteMixin, {});
#marcoow do you have any example ?

Ember Simple Auth also has a distribution that exports a global (SimpleAuth) - download here: https://github.com/simplabs/ember-simple-auth/releases/tag/0.7.0
You should really use Ember CLI of course though...

Related

How to use nuxt auth module with AWS Cognito ui

I am want to build an app which has a static frontend ( target: 'static' in nuxt.config.js ), and a backend using ktor. The app will need to authenticate users but I do not want to manage passwords and things myself, so I would like to integrate with AWS Cognito. Based on my understanding, I think this is the workflow I want:
User is browsing the site anonymously (no login)
They do some action which requires login or explicitly click on login button.
User gets redirected to AWS Cognito ui for login. They may register for new account, login with their existing, or login using another provider (after configuring cognito for it).
Cognito ui redirects user back to the app ui but with JWT tokens in query params (I think this is just how cognito does it)
The JWT token (s?) get stored in vuex store / nuxt auth
The token is used when making requests to the backend. As well as showing some additional components / actions if the user is authenticated and their basic info like username (part of jwt?)
I think I have cognito and the ktor backend setup correctly but I don't know how to get started for the frontend.
The nuxt auth module guide says to set up middleware, but afaik middleware is only for server side rendered apps.
I need to activate the vuex store but I don't know what to put there. Are there some specific things the auth module expects or do I just create an empty file in the directory?
How do I tell it when to redirect or read the token from query param?
How to parse the JWT token (if it doesn't automatically) and get some payload info like username from it?
Does the axios module get configured automatically to make use of this?
I found this old github issue 195 in the auth module repo, but I believe that's for when the "login form"/ui is part of the nuxt app and client is making use of the cognito api without 'redirect'.
Unfortunately everything in this stack is new for me so any help is appreciated. If there is already a project doing something similar, I look at the code and try to figure it out but right now I'm lost.
update 2020-12-31, mainly so that I can put a bounty on this soon: The live demo at https://auth0.nuxtjs.org/ seems to be doing what i'm looking for but then the github page read me shows something else https://github.com/nuxt/example-auth0. Also i don't see middleware / plugins used anywhere. it's all mostly configured through nuxt config, so it only works for the auth0 custom provider?
I was having the same issue as you:
How do I tell it when to redirect or read the token from query param?
I solved this by configuring auth.redirect.callback to match the endpoint that cognito will callback with the token. I believe this will tell the middleware when to look for a new token in the query param.
nuxt.config.js:
auth: {
redirect: {
callback: '/signin',
...
},
strategies: {
awsCognito: {
redirectUri: "http://localhost:8080/signin",
...
}
}
}
And to answer your other questions:
The nuxt auth module guide says to set up middleware, but afaik middleware is only for server side rendered apps.
I tried this setup with ssr: false and it still works fine.
I need to activate the vuex store but I don't know what to put there. Are there some specific things the auth module expects or do I just create an empty file in the directory?
An empty index.js file is fine.
How do I tell it when to redirect or read the token from query param?
See first answer above.
How to parse the JWT token (if it doesn't automatically) and get some payload info like username from it?
From my initial testing I found that the middleware will automatically call the userInfo endpoint when user data is requested e.g. this.$auth.user.email
strategies: {
awsCognito: {
scheme: "oauth2",
endpoints: {
userInfo: "https://x.amazoncognito.com/oauth2/userInfo",
ref: https://docs.aws.amazon.com/cognito/latest/developerguide/userinfo-endpoint.html
Does the axios module get configured automatically to make use of this?
Yes.

Xero Authentication in WordPress

I have a client that wants to be able to create xero invoices from a custom backend plugin that I have created in WordPress. I understand the xero api docs and what data to pass to the api to create a new invoice but I have to somehow authenticate the user so that they can send data to the api. So far I have created my xero app with a client id and client secret which I believe is required to help authenticate the api request.
But how can I authenticate the api request?
If I do simple request like this it fails:
jQuery(document).ready(function ($) {
$.ajax({
url: 'https://api.xero.com/connections',
error = (res) => {
console.log(res);
},
success = (res) => {
console.log(res);
}
});
});
I'd first recommend using the official xero PHP sdk, however I'm not sure if you are able to import packages to Wordpress like this. I've done some wordpress but I know there are some limitations with importing certain external libraries.
https://github.com/XeroAPI/xero-php-oauth2
However as an alternate solution, theres a recent blogpost on using a raw OAuth2.0 library to connect to XeroAPI manually though. This might set you on the right direction!
https://medium.com/#sid.maestre/use-php-to-connect-with-xero-31945bccd037

Google Sheets API with React Native

New to react-native. Trying to do simple crud operations on a google spreadsheet located in google drive. I've successfully implemented the packages for react-native-google-signin and react-native-google-drive-api-wrapper and can see my spreadsheets. Next step is finding a react-native package that implements google sheets API v4. I've tried Iwark's/react-native-spreadsheet for react/node.js but it produces errors when trying to build in a react-native environment. Any direction would be appreciated.
I am hoping can do this using googleapis and google-auth-library two libraries;
Then initialise the apis by doing
var authClient = new googleAuth();
var auth = new authClient.OAuth2();
auth.credentials = {
access_token: accessToken
};
this.service = google.sheets({version: 'v4', auth: auth});
Then use the this.service
If this doesn't make much sense, wait for few hours or tomorrow, I will help you with a working copy. :)
EDIT:
This is what I think you should do,"
If you have your spreadsheet public, follow this
If your spreadsheet is private
a) You need to make the user login (use firebase google login), then get the access_token and do a get with access_token in https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId} or post request etc.
b) Make a post request in your node server where you handle all of these
Note: I might help you with a working example this weekend.
install
npm install tabletop
import
import Tabletop from 'tabletop';
use
Tabletop.init({
key: url,
callback: googleData => {
console.log(googleData);
},
simpleSheet: true
})
Publishing your Google Sheet
url = File->Publish to the web then click Start publishing

Authentication with vuejs and laravel

Where have I to authenticate in a SPA application using laravel and vuejs? I'm developing a normal web application with laravel and blade. Nothing out of ordinary, but, now, I'm trying to make a spa application using laravel and vuejs - backend separeted from frontend. Where would I have to authenticate in this example? In php routes or vuejs routes or both? My laravel app, only laravel, it works as expected, user permissions, user session, a normal application but in vuejs, how I can do the same verifications as well?
Without knowing you exact Laravel authentication setup I would just say you authenticate through ajax at the same route as you do in Laravel. In a fairly standard setup using axios I do it like this.
ajaxLogin(){
axios.post('/login',{
email: this.loginEmail,
password: this.loginPassword
}).then(function (res) {
this.getCrsfToken(); //refresh crsf token
}.bind(this));
}
Notice the getCrsfToken function here. This may be necessary if your SPA (page) is not being refreshed when logging out and back in. Like in the case of the session expiring while the browser window is open. You would use something like the following to refresh the crsf token if you are including it the standard Laravel way in the header.
In your Routes or Controller
Route::get('/getToken', function(){
return csrf_token();
})->middleware('auth');
In your Vue component
getCrsfToken(){
axios.get('/getToken')
.then(function(res){
// Refresh crsf token from session after login
window.axios.defaults.headers.common['X-CSRF-TOKEN'] = res.data;
});
},

Tweeting from within meteor application

I am trying to build an app with Meteor that involves the user signing in with twitter, facebook, or google+, and then posting to those accounts from within the application.
First I'm trying to get twitter to work. I have my twitter sign in working, with the permission to tweet on their behalf working, but how to I actually send a tweet?
I think I need this: https://dev.twitter.com/docs/api/1.1/post/statuses/update but I can't figure out how the authentication works with Meteor.
Are there any examples that can help me here? Or tutorials?
You need an API to help you a bit unless you want to do it manually using REST with Meteor.http. I'd recommend you get meteorite: https://github.com/oortcloud/meteorite
Its installed like a node module via npm install -g meteorite
Meteorite is a wrapper for meteor that lets you use the community packages over at http://atmosphere.meteor.com
The twitter package you could use is twitter-api installed via mrt add twitter-api : https://github.com/Sewdn/meteor-twitter-api
Once added using the server api you can add a tweet via:
Server JS
var twitter = new Twitter();
Meteor.methods({
postTweet: function (text) {
if(Meteor.user())
twitter.postTweet(text),
return true;
}
});
Client JS
//Use this in your click handler where you want to post a tweet:
Meteor.call("postTweet", "This is Twweeeeeetttt!", function(err,result) {
if(!err) {
alert("Tweet posted");
}
});
The api takes care of the user's oauth tokens so you don't have to worry too much