Meteor - Redirecting the user to /dashboard after login

Question

I'm using Meteor.loginWithFacebook. All is working well except after login the user is redirected back to the / page. Instead I would like to redirect the user to /dashboard.

Is this possible to do from meteor, or do I have to create a <Route> that will handle this? I am using react-router. Here's my routes:

import React from 'react'
import { Router, Route, Switch, Redirect } from 'react-router'
import createBrowserHistory from 'history/createBrowserHistory'
import { withTracker } from 'meteor/react-meteor-data'
import { Meteor } from 'meteor/meteor'

import HomePage from '../../ui/pages/HomePage.js'
import DashboardPage from '../../ui/pages/DashboardPage.js'
import NotFoundPage from '../../ui/pages/NotFoundPage.js'

const browserHistory = createBrowserHistory();

const ProtectedRoute = ({
    component: Component,
    user,
    loggingIn,
    ...rest
}) =>
    (!user && loggingIn && <div>Loading</div>) ||
    (user && <Route {...rest} render={props => 
        <Component {...props} user={user} />}
    />) ||
    <Redirect to="/"/>

const Routes = (props) => (
    <Router history={browserHistory}>
        <Switch>
            <ProtectedRoute exact path="/dashboard" component={DashboardPage} {...props} />
            <Route exact path="/" component={HomePage} />
            <Route component={NotFoundPage} />
        </Switch>
    </Router>
)

export default withTracker((props) => {
    return {
        user: Meteor.user(),
        loggingIn: Meteor.loggingIn()
    }
})(Routes)

I had a similar question, but not sure if this is a duplicate. For your convenience there might the an answer there. https://stackoverflow.com/questions/44391262/react-router-v4-use-declarative-redirect-without-rendering-the-current-component — Jankapunkt, Apr 09 '18 at 08:31
@Jankapunkt solution 2 is actually very similar to what I'm doing already. But, I do not want to redirect the already logged in user when they land on the `/` route. I was thinking more along the lines of passing a `redirectUrl` to Facebook login, and then Facebook will send that `redirectUrl` back after the user has logged in. Not sure if that is possible. — BugHunterUK, Apr 09 '18 at 08:36
I see. Have you checked the facebook API? I think that `loginWithFacebook` must utilize Facebook's API in some way for the oAuth request. Maybe you find some answers in the [package code](https://github.com/meteor/meteor/tree/devel/packages/accounts-facebook). — Jankapunkt, Apr 09 '18 at 08:39

score 1 · Accepted Answer · answered Apr 09 '18 at 14:35

I figured it out. The documentation shows loginWithFacebook accepts a redirectUrl property. I simply set this to the dashboard URL. After the user has logged in they will be redirected to the dashboard.

To show an example here is the click handler for button component I created. When the user clicks they are redirected to accept the Facebook application permissions, once complete they will be redirected to the dashboard route:

handleClick = () => {
    Meteor.loginWithFacebook(
        { 
            requestPermissions: this.props.permissions,
            loginStyle: this.props.loginStyle,
            redirectUrl: Meteor.absoluteUrl('dashboard'),
        },
        err => {
            // These will be unsed when using redirect flow
            if (err) return this.props.onError(err)
            return this.props.onSuccess()
        }
    )
}

Meteor - Redirecting the user to /dashboard after login

1 Answers1