I'm trying to logout using this method:
In render I have a div like this:
<div>
<a href="#" onClick={this.logout()}>LOGOUT</a>
</div>
and the logout function:
logout() {
// localStorage.clear();
location.href = 'localhost:3000';
}
At localhost:3000 I have the login page.
Put when I press logout, nothing happends. What can I do?
Thank you
this solved my problem
logout() {
localStorage.clear();
window.location.href = '/';
}
Give to us the Minimal Example to be tested.
You already checked if your function is being called? Try to put some console.log inside logout(), it smells Binding to methods of React class issue.
Try to insert http:// inside location.href, like this: location.href = 'http://localhost:3000';
Related
I am working on AngularJS 1.5 project where I have to clear some settings before logout()
Working code (which does not clear settings)
this.logout = userSession.logout
userSession is a service which has logout
Modified code (which clears the settings but does not logout)
this.logout = () => {
mySettings.clear()
userSession.logout
}
Html Code:
<a href="" ng-click="$ctrl.logout()">
<span class="icon-logout"</span>
</a>
You forgot the parentheses when calling userSession.logout.
Should be:
this.logout = () => {
mySettings.clear()
userSession.logout(); // added parentheses
}
my logout function works (we display login page), but when i click on button disconnect the login page will be displayed but it will refresh 2 times.
how to fix this error to display login page without refresh
here is my function:
var _logOut = function () {
localStorageService.remove('authorizationData');
$state.go("login", {}, { reload: true });
$window.location.reload();
// _authentication.isAuth = true;
};
I don't think that $window.location.reload() is necessary.
Try removing it.
In my ionic mobile app. I have signup page. Once a user's signup is success user will be navigated to profile page. Now what i want, once user is successfully signed up, users are not allowed to get back to signup page.
How can I make sure that back button won't navigate to signup page once signup was success ?
One solution I have is, to check for some condition every time signup page is loaded and based on that condition stay or navigate to other page. e.g.
if(userIsLoggedin()) {
$state.go('home')
}
Create a factory to store data
module.factory('DataStore', [function () {
var _local = {}, dataStore = {};
dataStore.setValue = function (field, value) {
_local[field] = value;
};
dataStore.getValue = function (field) {
return _local[field] || null;
};
return dataStore;
}])
Then once you validate that the user is registered you set the flag in DataStore
module.controller('registration', function(..., DataStore) {
...
//do all necessary logic
if(allGood) {
DataStore.setValue('RegistrationSuccessful', true);
}
});
Then anytime you can check from any other controller that imports DataStore
module.controller('home', function(..., DataStore) {
...
//do all necessary logic according to the code in your question
$scope.onbtnclick = function () {
if(DataStore.getValue('RegistrationSuccessful')) {
$state.go('home')
} else {
$state.go('registration');
}
};
});
You can do this by handling back button in ionic app. Check the app state on back button click if it's on profile page then do nothing so it will prevent default back event.
$ionicPlatform.registerBackButtonAction(function (event) {
if($state.current.name!="menu.profile" ){
$ionicHistory.goBack(-1);
}else{
// if state is profile then control will be here.
}
}, 100);
Put this code in app.js file.
Other suggestion: once user is register and login in to profile then he or she should be taken to profile page directly on app start.
you can do this in your register or verification function if user is not register then take it to signup page. and if user is logged in the take it to profile page.
Your solution looks good. I think you may also want to make sure you check the user session on the server side.
I want to open the link in the system browser, for example in ios in safari and for android chrome(whatever the default browser is).
The problem i'm having the that the link does indeed opens in the system browser but it also open in the application. I want the link only to open in the system browser and not inside the app.
this is my code.
<a ng-href="http://example.com/login/{{user._id}}" onclick="window.open(this.href, '_system', 'location=yes')" class="ion-home color-primary item"> Dashboard</a>
Keep in mind that im also passing an id to my endpoint.
try
<a class="ion-home color-primary item" href="#" onclick="window.open('http://example.com/login/{{user._id}}', '_system', 'location=yes'); return false;"> Dashboard</a>
In newer(3.0) version In App Browser Plugin is better solution.
<button ion-button block clear (click)="openWebpage(url)">Open Webpage</button>
and the openWebpage method goes like this
openWebpage(url: string) {
const options: InAppBrowserOptions = {
zoom: 'no'
}
// Opening a URL and returning an InAppBrowserObject
const browser = this.inAppBrowser.create(url, '_self', options);
// Inject scripts, css and more with browser.X
}
You can do it with InAppBrowser plugin https://cordova.apache.org/docs/en/3.0.0/cordova/inappbrowser/inappbrowser.html
If you for some reason don't want to use plugin, check out my answer on similar question: https://stackoverflow.com/a/30397786/1630623
EDIT: if you are already using the plugin, you might have to either remove the onclick code and add target="_system", or add event.preventDefault(); in the onclick handler
Capacitor has an easy to use plugin for launching an in-app browser.
https://capacitorjs.com/docs/apis/browser
Installation:
npm install #capacitor/browser
npx cap sync
Usage:
import { Browser } from '#capacitor/browser';
const openCapacitorSite = async () => {
await Browser.open({ url: 'http://capacitorjs.com/' });
};
Simple Solution
<a href="#" onclick="window.open('https://www.badhaobusiness.in',
'_system', 'location=yes'); return false;"> www.badhaobusiness.in</a>
Use this method in ActionSheet to open link in another browser:
import { ActionSheetController} from '#ionic/angular';
...
constructor(public actionSheet: ActionSheetController) {}
async presentActionSheet() {
const action = await this.actionSheet.create({
buttons: [{
text: 'Open link',
icon: 'link-outline'
handler: () => {
window.open('http://google.com');
}
}]
});
await action.present();
}
}
I have a simple Firebase Facebook OAuth login set like below by following the official tutorial for the Ionic Firebase Facebook login.
The problem is that once I click on the login with Facebook button, I get redirected to Facebook, I log in, and I get redirected back to my app. However, the problem is that I stay in the login page. Strange thing is that if I physically refresh my browser (testing with ionic serve) by pressing F5 the onAuth triggers and I get redirected to the Items page. If I don't refresh the browser, onAuth doesn't get called.
Did someone have this issue? How did you solve it?
Please note that yes, I did my research (and am slightly starting to lose it), but can't get it to work. I searched SO, tried with $timeout from google groups, tried to call $scope.$apply(), but all to no avail - so please help me figure out where I'm doing it wrong?
.controller('AppCtrl', function($scope, Items, Auth, $state, $ionicHistory) {
$scope.login = function(provider) {
Auth.$authWithOAuthRedirect(provider).then(function(authData) {
}).catch(function(error) {
if (error.code === "TRANSPORT_UNAVAILABLE") {
Auth.$authWithOAuthPopup(provider).then(function(authData) {
});
} else {
console.log(error);
}
});
};
$scope.logout = function() {
Auth.$unauth();
$scope.authData = null;
$window.location.reload(true);
};
Auth.$onAuth(function(authData) {
if (authData === null) {
console.log("Not logged in yet");
$state.go('app.login');
} else {
console.log("Logged in as", authData.uid);
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('app.items');
}
$scope.authData = authData; // This will display the user's name in our view
});
})
<ion-view view-title="Members area">
<ion-content padding="true">
<div ng-if="!authData">
<button class="button button-positive button-block" ng-click="login('facebook')">Log In with Facebook</button>
</div>
<div ng-if="authData.facebook">
<div class="card">
<div class="item item-text-wrap">Hello {{authData.facebook.displayName}}!</div>
</div>
<button class="button button-assertive button-block" ng-click="logout()">Log out</button>
</div>
</ion-content>
</ion-view>
edit: I sort of solved it by using $timeout:
$timeout(function(){
Auth.$onAuth(function(authData) {
if (authData === null) {
console.log("Not logged in yet");
$state.go('app.login');
} else {
console.log("Logged in as", authData.uid);
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('app.items');
}
$scope.authData = authData; // This will display the user's name in our view
});
}, 3000);
However, this just feels wrong (mildly put), and there has to be a better way, so please suggest one. Also, I noticed that the whopping 3second delay is barely enough (few of the resources I found suggested 500ms would be enough, but in my case, that's not the case).
Posted on the github issues, but will reply here as well.
This only happens in the browser using $authWithOAuthRedirect. The example was intended for cordova apps, so this really shouldn't be an issue.
But if you really need it, you could just skip the redirect and use a popup.
Auth.$authWithOAuthPopup(authMethod).then(function(authData) {
console.dir(authData);
});
This was a bug that has been fixed in the latest Firebase JS client release (2.3.0). You can now use $authWithOAuthRedirect and the $onAuth callback will be triggered when you navigate back to the page.