laravel backpack 管理后台使用手机号替换邮箱登录

这个时代用邮箱的人越来越少。很多客户反馈，希望使用手机号替换掉目前的邮箱登录管理后台的方式。

Laravel 切换登录方式确实非常简单。

使用手机号替换邮箱登录

修改 username 的返回即可。

+++ b/app/Http/Controllers/Auth/LoginController.php
@@ -20,6 +20,11 @@ class LoginController extends Controller

     use AuthenticatesUsers;

+       public function username()
+       {
+               return 'tel';
+       }

登录页面的模板中，将 email 统一替换为 tel.

resources/views/vendor/backpack/base/auth/login.blade.php

针对 backpack admin 管理后台的路由修改。

+++ b/routes/web.php
@@ -16,3 +16,7 @@ Route::get('/', function () {
 });

+
+Route::group(['prefix' => config('backpack.base.route_prefix')], function () {
+        $this->post('login', 'Auth\LoginController@login');
+});

用户体验优化

禁止 chrome 浏览器自动填充密码，主要是为了规避在后台编辑用户信息时，将已登录账号的密码赋值给了其他账号。

             [
                 'name'  => 'password',
                 'label' => '密码',
                 'type'  => 'password',
                 'tab' => '1: 基本信息',
+                'attributes' => [
+                    'autocomplete' => 'new-password',
+                ],

修改成 new-password 之后，无论之前有没有密码，在编辑用户资料时，密码字段都会显示为空。

如果之前有密码，当前编辑页面，不设置密码，保存之后，旧有密码依旧有效。我觉得这是合理的。

但是，我一直没有搞明白为什么 chrome 下 autocomplete 并不生效。

增加校验

+++ b/app/Http/Requests/UserUpdateCrudRequest.php
@@ -14,6 +14,14 @@ class UserUpdateCrudRequest extends CrudRequest
     public function rules()
     {
         return [
+            'password' => 'confirmed',
+        ];
+    }
+
+    public function messages()
+    {
+        return [
+            'password.confirmed' => '请确认密码一致',
         ];
     }
 }

关于作者 🌱

我是来自山东烟台的一名开发者，有敢兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊， 查看更多联系方式