1. 首页
  2. Laravel

Laravel使用Sanctum验证移动应用程序

Sanctum是Laravel的轻量级API身份验证包。在我的上一篇文章中,我研究了通过Sanctum用Laravel API验证React SPA。本教程将介绍如何使用Laravel Sanctum验证移动应用程序。这款应用程序将内置于谷歌的跨平台应用程序开发工具包Flutter中。我可能会跳过移动应用程序的一些实现细节,因为这不是本教程的重点。
本文末尾提供了指向最终代码的链接。后端
我已经设置了Homestead来提供域名api.sanctum-mobile.test,我的后端将在这里提供服务,以及MySQL数据库。
首先,创建Laravel应用程序:
1laravel new sanctum_mobile
在编写本文时,它给了我一个新的Laravel项目(v8.6.0)。与SPA教程一样,API将提供一个书籍列表,因此我将创建相同的资源:
1php artisan make:model Book -mr
mr标志也创建迁移和控制器。在我们处理迁移之前,让我们先安装Sanctum包,因为我们将再次需要它的迁移。
1composer require laravel/sanctum2php artisan vendor:publish>
现在,创建books迁移:
1Schema::create(\”books\”, function (Blueprint $table) {2$table->id();3$table->string(\”title\”);4$table->string(\”author\”);5$table->timestamps();6});
接下来,运行应用程序的迁移:
1php artisan migrate
如果您现在查看数据库,您将看到Sanctum迁移创建了一个personal_access_tokens表,我们稍后将在验证移动应用程序时使用它。
让我们更新DatabaseSeeder.php以提供一些书籍(以及稍后的用户):
1Book::truncate();> 3for> 4Book::create([>> 7]); 8} 9User::truncate();10User::create([14]);
现在为数据库种子:php artisan db:seed。最后,创建路由和控制器操作。将此添加到routes/api.php文件:
1Route::get(\”book\”, [BookController::class, \”index\”]);
,然后在BookController的index方法中,返回所有书籍:
1returnresponse()->json(Book::all());
在检查终结点工作后-curl https://api.sanctum-mobile.test/api/book-是时候启动移动应用程序了。移动应用程序
对于移动应用程序,我们将使用Android Studio和flatter。Flutter允许您创建跨平台应用程序,在Android和iPhone设备上重复使用相同的代码。首先,按照说明安装flatter并设置Android Studio,然后启动Android Studio并单击\”创建新的flatter项目\”。
按照flatter的食谱从internet获取数据,创建一个从API获取书籍列表的页面。向Android Studio设备公开API的一个简单快捷的方法是使用homestad的share命令:
1share api.sanctum-mobile.test
控制台将输出一个ngrok页面,该页面将为您提供一个URL(类似https://0c9775bd.ngrok.io)向公众公开您的本地服务器。(ngrok的另一个替代方案超出了代码的公开范围)因此,让我们创建一个utils/constants.dart文件将其放入:
现在,回到flatter食谱。创建一个文件books.dart,它将包含我们的图书列表所需的类。首先,一个Book类保存来自API请求的数据:
1classBook { 2finalint id; 3finalString title; 4finalString author; 5Book({this.id, this.title, this.author}); 6factoryBook.fromJson(Map json) { 7returnBook( 8id: json[\”id\”], 9title: json[\”title\”],10author: json[\”author\”],11);12}13}
其次,一个BookList类获取书籍并调用生成器显示它们:
1classBookListextendsStatefulWidget { 2@override> 4} 5 6class_BookListStateextendsState { 7Future> futureBooks; 8 9@override10voidinitState() {11super.initState();13}1415Future>fetchBooks() async {16List>17final>18if (response.statusCode ==200) {19List>20for (int>21books.add(Book.fromJson(data[i]));22}23return books;24} else {25throwException(\”Problem loading books\”);26}27}2829@override30Widgetbuild(BuildContext context) {31returnColumn(32children:[33BookListBuilder(futureBooks: futureBooks),34],35);36}37}
最后,一个BookListBuilder来显示书籍:
1classBookListBuilderextendsStatelessWidget { 2constBookListBuilder({ 3Key key, 4@requiredthis.futureBooks, 5}) :super(key: key); 6 7finalFuture> futureBooks; 8 9@override10Widgetbuild(BuildContext context) {11returnFutureBuilder>(12future: futureBooks,13builder: (context, snapshot) {14if (snapshot.hasData) {15returnExpanded(child:ListView.builder(16itemCount: snapshot.data.length,17itemBuilder: (context, index) {18Book>19returnListTile(20title:Text(\”${book.title}\”),21subtitle:Text(\”${book.author}\”),22);23},24));25} elseif (snapshot.hasError) {26returnText(\”${snapshot.error}\”);27}28returnCircularProgressIndicator();29}30);31}32}
现在我们只需要修改main.dart中的MyApp类来加载BookList:
1classMyAppextendsStatelessWidget { 2@override 3Widgetbuild(BuildContext context) { 4returnMaterialApp( 5title:\”Sanctum Books\”, 6home:newScaffold( 7body:BookList(), 8) 9);10}11}
现在在您的测试设备或模拟器中启动它,您应该会看到一个书籍列表。与Sanctum的身份验证
很好,所以我们知道API正在工作,我们可以从中获取书籍。下一步是设置身份验证。
我将使用provider包,并遵循官方文档中关于设置简单状态管理的指导原则。我想创建一个身份验证提供程序来跟踪登录状态并最终与服务器通信。创建一个新文件,auth.dart。下面是身份验证功能的发展方向。目前,我们将返回true,以便测试流程是否正常:
1classAuthProviderextendsChangeNotifier { 2bool> 3> 5 6Futurelogin(String email, String password) async { 7print(\”logging in with email $email and password $password\”);> 9notifyListeners();10returntrue;11}12}
使用此提供程序,我们现在可以检查是否已通过身份验证并相应地显示正确的页面。修改您的main函数以包含提供程序:
1voidmain() {2runApp(3ChangeNotifierProvider(4create: (BuildContext>5child:MyApp(),6)7);8}
…并修改MyApp类以显示BookList小部件(如果我们已登录),否则将显示LoginForm小部件:
1body:Center( 2child:Consumer( 3builder: (context, auth, child) { 4switch (auth.isAuthenticated) { 5casetrue: 6returnBookList(); 7default: 8returnLoginForm(); 9}10},11)12),
LoginForm类包含大量\”widgety\”cruft,因此如果您有兴趣,我将向您推荐GitHub repo。无论如何,如果你在测试设备中加载了这个应用程序,你应该会看到一个登录表单。填写一封随机电子邮件和密码,提交表单,然后您将看到一个图书列表。
好的,让我们设置后端来处理身份验证。文档告诉我们创建一个路由,该路由将接受用户名和密码以及设备名,并返回一个令牌。因此,让我们在api.php文件中创建一个路由:
1Route::post(\”token\”, [AuthController::class, \”requestToken\”]);
和一个控制器:php artisan make:controller AuthController。这将包含文档中的代码:
1publicfunctionrequestToken(Request $request):string 2{ 3$request->validate([>>> 7]); 8>1011if (! $user ||!Hash::check($request->password, $user->password)) {12throwValidationException::withMessages([14]);15}1617return $user->createToken($request->device_name)->plainTextToken;18}
如果用户名和密码有效,这将创建一个令牌,将其保存在数据库中,并将其返回给客户端。要想让它发挥作用,我们需要在

Laravel使用Sanctum验证移动应用程序 为WP2原创文章,链接:https://www.wp2.cn/laravel/laravel%e4%bd%bf%e7%94%a8sanctum%e9%aa%8c%e8%af%81%e7%a7%bb%e5%8a%a8%e5%ba%94%e7%94%a8%e7%a8%8b%e5%ba%8f/