When developing an app that has an admin section (or any non-public section), you'll likely seed test users to login. In large teams that work on many different apps it can be cumbersome to keep track of the right credentials. Is the user account "yourname@company.com", or "test@company.com", or even "admin@company.com"? Is that password "password", or "secret", or something is else? How do I login with a user that has a different role?
This package solves that problem by offering a component that will render a login link. When clicked, that link will log you in.
In your login view, you can add the x-login-link
component to show the login link. The @env('local')
will make sure that the links are only rendered in the local environment.
@env('local')
<div class="space-y-2">
<x-login-link email="admin@spatie.be" label="Login as admin"/>
<x-login-link email="user@spatie.be" label="Login as regular user"/>
</div>
@endenv
Here's what that might look like in the browser:
It is meant for local development, and probably shouldn't be used in any publicly reachable environment.
Here's a Laracasts video that demonstrates Laravel Login Link made by Christoph Rumpel.
We invest a lot of resources into creating best in class open source packages. You can support us by buying one of our paid products.
We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on our contact page. We publish all received postcards on our virtual postcard wall.
You can install the package via composer.
composer require spatie/laravel-login-link
Optionally, you can publish the config file with:
php artisan vendor:publish --tag="login-link-config"
This is the contents of the published config file:
use Spatie\LoginLink\Http\Controllers\LoginLinkController;
return [
/*
* Login links will only work in these environments. In all
* other environments, an exception will be thrown.
*/
'allowed_environments' => ['local'],
/*
* The package will automatically create a user model when trying
* to log in a user that doesn't exist.
*/
'automatically_create_missing_users' => true,
/*
* The user model that should be logged in. If this is set to `null`
* we'll take a look at the model used for the `users`
* provider in config/auth.php
*/
'user_model' => null,
/*
* After a login link is clicked, we'll redirect the user to this route.
* If it is set to `null`, we'll redirect the user to their last intended/requested url.
* You can set it to `/`, for making redirect to the root page.
*/
'redirect_route_name' => null,
/*
* The package will register a route that points to this controller. To have fine
* grained control over what happens when a login link is clicked, you can
* override this class.
*/
'login_link_controller' => LoginLinkController::class,
/*
* This middleware will be applied on the route
* that logs in a user via a link.
*/
'middleware' => ['web'],
];
Optionally, you can publish the views using
php artisan vendor:publish --tag="login-link-views"
To render a login link, simply add the x-login-link
Blade component to your view. We highly recommend to only render it in the local
environment.
@env('local')
<x-login-link />
@endenv
This component will render a link that, when clicked, will log you in. By default, it will
redirect you to the last intended/requested url, but you can customize that by specifying a route name in the redirect_route_name
of the login-link
config file.
You can also specify the redirect URL on the component itself:
<x-login-link redirect-url="{{ route('dashboard') }}" />
By default, it will use the user model class that is specified in the providers.users.model
key of the auth
config file. To override this, you can set the user_model
of the login-link
config file to the class name of your user model.
The package will log in the first user in the table. You customize that by passing an email
attribute. The user with that mail address will be logged in.
<x-login-link email="admin@example.com" />
Alternatively, you can specify the primary key of the user (in most cases this will be the id
)
<x-login-link key="123" />
You can also specify the attributes of the user that needs to be logged in.
<x-login-link :user-attributes="['role' => 'admin']" />
By default, the package will display "Developer login" as the text of the login link. You can customize that by passing a label
attribute.
<x-login-link label="Click here to log in">
A login link will have the Tailwind class underline
by default. To customize that, you can pass any css class that you want to the class property. These classes will override the underline
default.
Here's how you can create a red, underlined link (when using Tailwind CSS).
<x-login-link class="underline text-red-500">
By default, the package will use the default guard. You can specify another guard.
<x-login-link guard="admin">
If the user that needs to be logged in does not exist, the package will use the factory of your user model to create the user, and log that new user in.
If you don't want this behaviour, set automatically_create_missing_users
in the local-link
config file to false
.
The package has a built-in component to support Vue or React and InertiaJS. The props are the same of blade component.
Edit the HandleInertiaRequests
middleware like so:
public function share(Request $request): array
{
return array_merge(parent::share($request), [
'environment' => app()->environment(),
// ...
]);
}
So, if you need to show the button only in your local environment, use the component like so for Vue :
import LoginLink from '@/../../vendor/spatie/laravel-login-link/resources/js/login-link.vue';
<LoginLink v-if="$page.props.environment === 'local'" />
// or
<LoginLink v-if="$page.props.environment === 'local'" label="Login as user@example.com" class="pb-3 text-red-500" :redirect-url="route('dashboard')" />
For React, use the component like so:
import LoginLink from '@/../../vendor/spatie/laravel-login-link/resources/js/LoginLink';
// or for TypeScript, uncomment the following line
//import LoginLink from '@/../../vendor/spatie/laravel-login-link/resources/ts/LoginLink';
{page.props.environment === 'local' && (
<LoginLink />
)}
// or
{page.props.environment === 'local' && (
<LoginLink
label="Login as user@example.com"
className="pb-3 text-red-500"
redirectUrl={route('dashboard')}
/>
)}
The package comes with Vue and React support only. When you use any other JS front end framework to render your views, you can still make use of the package.
You should send a POST
request to /laravel-login-link-login
. If you don't give it any payload, then it will log in the first user in your users table. If there is no user, it will be created.
Optionally, you can post any of these payload fields. The functionality of these payloads fields match those of the attributes that you can pass to x-login-link
component.
email
: attempt to log in the user with the given email addresskey
: attempt to log in the user with the given key (in most cases theid
of the users)redirect_url
: to which URL should we redirect after logging inuser_attributes
: an array containing the attributes that the user that will be logged in needs to have.
Since this is a POST request, make sure to pass a CSRF token as well.
Out of the box, the login link will only work in a local environment. If you want to use it other environments, set the allowed_environments
key of the login-link
config file to the names of those environments.
Beware however, that you should never display login links in any environment that is publicly reachable, as it will allow anyone to log in.
Povilas Korop of Laravel Daily made a nice video on the internals of the package.
composer test
Please see CHANGELOG for more information on what has changed recently.
Please see CONTRIBUTING for details.
Please review our security policy on how to report security vulnerabilities.
The MIT License (MIT). Please see License File for more information.