VueJS2 and Laravel Auth (and history mode) - laravel

I'm creating a backend system that I want to use VueJS2 for with a Laravel backend. The problem i'm facing at the moment is integrating this all together while keeping the 'tidy' URLS (no hashbangs) utilising Vue's history mode:
const router = new VueRouter({
routes,
mode: 'history'
})
I am a fan of the way Laravel handles Authentication and as such i've tried to use that in this system as an entry point into the SPA but doing so breaks the history mode.
In my routes file i've added a Vue capture route that works to allow hard refreshing of the browser and back button etc and this works fine:
Route::get('/{vue_capture?}', function () {
return view('home');
})->where('vue_capture', '[\/\w\.-]*');
However in order to use Laravel Auth i've added the following check, which works to force you to login before accessing anything else but breaks the history mode:
if (Auth::check()) {
Route::get('/{vue_capture?}', function () {
return view('home');
})->where('vue_capture', '[\/\w\.-]*');
}
else {
// the home controller has the auth middleware in the __construct
Route::get('/', 'HomeController#index');
}
I've tried adding middleware onto the end of the vue capture route but it didn't seem to do anything.
Many thanks!

To get SPA working with any backend, you should use Api authentication based on JWT.
This is Laravel docs about it: https://laravel.com/docs/5.3/passport
This is good package for this purpose: https://github.com/tymondesigns/jwt-auth

Related

Call laravel controller from vue file

I created a component in vue file and I want to fetch data from laravel controller function.
Currently, I have used axios to fetch data. But can I directly call laravel controller function?
Thanks in advance.
No, the only way to communicate with your laravel app is your web service. ( Ex: REST Api )
Because Laravel and Vuejs are completely separated.
Although in using web services you would have different methods.
Expose a route from Laravel/Lumen app
Call the route or url from vue using any http client(axios)
N.B: You cann't call the controller method on Laravel app directly from your Vue CLI
You need to do few steps.
in vue js file script area
const url = `https://www.naveedramzan.com/api/getData/users/4`;
Axios.defaults.headers.common['Authorization'] = `Bearer ${params.token}`; // if you are using some token authentication
Axios.get(url,{params: params})
.then((response) => {
res(response.data);
})
.catch((err) => {
rej(err);
});
In laravel, routes/api.php file
Route::post('getData/users', 'UsersController#getData');
In laravel, the controller file
use Illuminate\Http\Request;
public function getData(Request $request){
....
}

LImit Access on pages. to prevent access pages without login

as we know when we code on localhost we can go directly to dashboard admin on our website without login first by typing the link. so how we can stop that? so if we want to access the admin dashboard we really have to log in first
use laravel middleware to limit accesses ... you can use auth middleware like:
Route::get('/profile', function () {
//
})->middleware('auth');
for more info visit laravel docs
use laravel middleware in your web.php if you are using a simple function for your route
Route::get('/admin/dashboard',function () {
return view....``
})->middleware('auth');
Or you can use a constructor in your Controller to limit access for all function in this controller
public function __construct()
{
$this->middleware('auth');
}

Redirect to custom tool url in a laravel nova application

Laravel Version: 7
Nova Version: 3
PHP Version: 7.4
Database Driver & Version:
Operating System and Version: MacOS
Browser type and version: Chrome
Reproduction Repository: https://github.com/###/###
Description:
I am trying to redirect a user after checking for a condition in a middleware, I have tried to use
return redirect('/admin/paddle-subscription');
But it does not work, it just redirects the page and shows it right in the browser url but show a 404 error in the screen, it looks that as nova uses vue.js it is creating some kind of errors.
I have been reading some post in laracast https://laracasts.com/discuss/channels/nova/nova-resource-route-redirect and it is clearer to me that it requires a special way to redirect.
I have tried
return redirect()->action('\Laravel\Nova\Http\Controllers\RouterController#show', ['resource' => '/admin/paddle-subscription']);
And it does not work, how I am supposed to redirect properly?
Thanks
Detailed steps to reproduce the issue on a fresh Nova installation:
You can do this by creating the route in the backend first so that Laravel knows the page exists. Use Nova's RouterController#show action for the route like in your Laracast example and make sure to apply all the Nova middleware to it.
In app/Providers/NovaServiceProvider.php add a custom route to your routes() method:
protected function routes()
{
Nova::routes()
->withAuthenticationRoutes()
->withPasswordResetRoutes()
->register();
Route::domain(config('nova.domain', null))
->middleware(['web'])
->as('nova.')
->prefix(Nova::path())
->group(function () {
Route::get('/admin/paddle-subscription', [\Laravel\Nova\Http\Controllers\RouterController::class, 'show'])
->middleware(config('nova.middleware', []));
});
}
In your middleware you can now redirect to that route and the page will render properly:
public function handle(Request $request, Closure $next)
{
if ($foo === $bar) {
return new \Illuminate\Http\RedirectResponse('/admin/paddle-subscription');
}
return $next($request);
}
try this:
add in your nova action
public function handleRequest(\Laravel\Nova\Http\Requests\ActionRequest $request)
{
parent::handleRequest($request);
return Action::redirect('/admin/paddle-subscription');
}

Laravel route group page redirects to home

I have installed Laravel and set up authentication and I have also created a route group like this:
// users that want to access test route should be logged in.
Route::group(['middleware' => ['web', 'auth']], function () {
Route::get('first', function () {
return 'first';
});
});
The problem is when I access the route like this:
http://localhost/first
I can see my "first" message, but when I refresh the same page laravel redirects me to:
http://localhost/home
I could not solve this and I have moved my first route out of the route group now everything is working well. If I keep it in the route group with auth & web middlewares it is not working.
Try to remove web middleware if you're using 5.2.27 and higher.

Laravel Sentinel redirect after successful login

I am using laravel 4 for a project that we are doing and using sentinel which is a sentry implementation. Link to package is as below
https://github.com/rydurham/Sentinel
When I log in, I need to do a routing which directs to the dashboard page. My code as below in the filters.php under the app folder
Route::filter('auth', function()
{
if (Auth::guest())
return Redirect::guest('login');
else if (!Auth::guest())
return Redirect::to('dashboard');
});
But its not working. Anyone can help?
https://github.com/rydurham/Sentinel
This package uses Sentry2.
referance : Sentinel Filters

Resources