codecamp

Laravel 8 前端快速上手

注意:为了使用 Passport 的 Vue 组件,你必须使用 Vue JavaScript 框架。这些组件也使用了 Bootstrap CSS 框架。然而,如果你不打算使用这些工具,这些组件对于你自己的前端组件编写也十分有价值。

提供了一系列 JSON API ,你可以用它们来允许你的用户创建客户端和个人访问令牌。然而,编写与这些 API 交互的前端代码可能是很占用时间的。因此,Passport 也包括了预编译的 Vue 组件,你可以直接使用或将其作为你自己的前端参考。

要使用 Passport 的 Vue 组件,使用 vendor:publish Artisan 命令:

php artisan vendor:publish --tag=passport-components 

被发布的组件将会被放到 resources/js/components 目录下。当组件被发布后,你应该在你的 resources/js/app.js 文件中注册它们:

Vue.component(
    'passport-clients',
    require('./components/passport/Clients.vue').default
);

Vue.component(
    'passport-authorized-clients',
    require('./components/passport/AuthorizedClients.vue').default
);

Vue.component(
    'passport-personal-access-tokens',
    require('./components/passport/PersonalAccessTokens.vue').default
); 

注意:在 Laravel v5.7.19 之前,在注册组件时添加 .default 会导致控制台错误。有关此更改的解释,请参阅 Laravel Mix v4.0.0 release notes 发布说明。

注册完组件之后,需要运行 npm run dev 重新编译代码。编译好之后就可以在项目中使用组件建立客户端和个人访问令牌:

<passport-clients></passport-clients>
<passport-authorized-clients></passport-authorized-clients>
<passport-personal-access-tokens></passport-personal-access-tokens> 


Laravel 8 部署 Passport
Laravel 8 从环境中加载密钥
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

Laravel 8 入门指南

Laravel 8 基础功能

Laravel 8 前端开发

Laravel 8 安全相关

Laravel 8 综合话题

数据库

Eloquent ORM

测试相关

官方拓展包

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }