3分钟短文:Laravel slug,让你的url地址更“好记”

简介: wordpress瑟瑟发抖

引言

网络资源访问,路由是多么重要不消多言了。而友好的url地址更是能让人一目了然,增加用户的好感。同时对于爬虫也是好的示例,搜索引擎可以友好地展开工作了。

img

本文就来讲讲,如何在laravel中构造友好的url路由。

啥是slug?

在早期的互联网时代,为了在页面之间传递数据,复杂的交互一般都会使用cookie等本地缓存,但是浏览器版本的约束,使得服务器端交互仍然需要即时访问。所以各种各样的url地址,带参数跳转的,表单提交的,混为一谈,制作出符合统一规范的路由很不容易。

比如下面的路由,访问一个地址,并且携带querystring参数:

http://example.com/events.php?id=42

相应地,不同的用户,这个id也不相同。不同的页面,也不相同。像这样带参传递的路由地址,是最为原始的。我们在之前的章节已经使用laravel Route功能,重新构造了url,所以访问起来像是连贯的:

http://example.com/events/42

直接使用位置参数绑定的方式传递。因为数字42对用户而言没有实际意义,而对数据库来说是索引字段。如果使用如下方式,效果要友好的多:

http://example.com/events/laravel-hacking-and-coffee

这种基于字符串位置参数绑定的URL方式,被称为 slug。有一个第三方类库专门用于url的友好化。使用 composer 安装:

composer require cviebrock/eloquent-sluggable:^4.3

模型引入 Slug 功能

引入 eloquent-sluggable 类库,只需要在laravel模型文件内引入对应trait,并重载实现sluggable方法:

use Cviebrock\EloquentSluggable\Sluggable;
class Event extends Model {
    use Sluggable;
    public function sluggable()
    {
        return [
            'slug' => [
                'source' => 'name'
            ]
        ];
    }
}

上述 sluggable 方法指定了,哪个字段用于slug搜索,(此处是 slug)。以及slug字段对应的数据库表的字段来源,此处是 name 字段。

接着我们需要修改 events 表,为其追加 slug 字段。命令行创建迁移文件:

php artisan make:migration add_slug_column_to_events_table --table=events

执行成功返回:

Created Migration: 2020_10_04_225240_add_slug_column_to_events_table

然后手动实现迁移文件的 up 方法:

public function up()
{
    Schema::table('events', function (Blueprint $table) {
        $table->string('slug')->nullable();
    });
}

以及回滚使用的 down 方法:

public function down()
{
    Schema::table('events', function (Blueprint $table) {
        $table->dropColumn('slug');
    });
}

在命令行执行迁移成功后,数据库表events就会追加上slug字段了。

如果原来数据库表内已经又生产数据,此时我们需要手动更新一下。使用 tinker 快捷操作:

namespace App;
$events = Event::all();
foreach($events as $event) {
    $event->save();
}

数据量不大,我们也不考虑效率不效率的问题了。foreach循环直接用了。

创建基于 slug 的模型查询

数据库准备好了,模型准备好了,现在让我们把slug功能用起来。

如果你有印象的话,应该会记得laravel模型的find等方法,是基于primary key进行索引,以便加快查询速度。拿到模型的ID,查询该条目数据,然后返回模型实例。这是基于ID这个integer类型的查询。

而slug查询,是基于字符串的,如果要使用slug此功能,需要改写默认的列名。在模型文件内手动重写如下方法:

public function getRouteKeyName()
{
    return 'slug';
}

返回字符串,就是查询所依据的“字段名”。这样默认的查询就不走默认的 $primaryKey = 'id' 这个字段,而是使用手动指定的 slug字段了。

当然了,如果没有使用路由参数绑定,eloquent-sluggable类库也为我们提供了友好的trait,在模型文件内直接引入就好了:

use Cviebrock\EloquentSluggable\Sluggable;
use Cviebrock\EloquentSluggable\SluggableScopeHelpers;

class Event extends Model
{
    use Sluggable, SluggableScopeHelpers;
}

从名字你就能猜测的到,SluggableScopeHelpers 是一个全局作用域文件,这是我们上一章所讲内容,不再赘述。

完成引入后,在使用模型进行查询时,就可以这样使用了:

$event = Event::findBySlug('laravel-hacking-and-coffee');
$event = Event::findBySlugOrFail('laravel-hacking-and-coffee');

归根结底,就是使用slug字段记录查询的字符串,而slug字段在对应关系中定义为 source => ‘name’ 字段,所以SQL查询仍然是根据slug字段严格匹配约束返回数据集。

数据量大了之后,这种等于的WHERE子句性能必然不如ID字段的主键索引来的快。所以在数据库层面也同样需要优化。

写在最后

本文介绍了在模型文件内,引入slug的功能,并通过修改模型的查询方式,让模型的默认查询方式修改为通过字符串进行查询,从而可以在路由文件内构造更友好的查询url。

Happy coding :-)

我是@程序员小助手,专注编程知识,圈子动态的IT领域原创作者

相关文章
|
4月前
|
移动开发
钉钉H5微应用配置IP,应用首页地址报错:app url exceeds max length limit,这个怎么处理?
钉钉H5微应用配置IP,应用首页地址报错:app url exceeds max length limit,这个怎么处理?
282 0
|
8月前
|
应用服务中间件 nginx
Nginx rewrite(URL)地址重定向
Nginx rewrite(URL)地址重定向
312 0
|
10天前
【超实用】Angular如何修改当前页面网页浏览器url后面?param1=xxx&param2=xxx参数(多用于通过浏览器地址参数保存用户当前操作状态的需求),实现监听url路由切换、状态变化。
【超实用】Angular如何修改当前页面网页浏览器url后面?param1=xxx&param2=xxx参数(多用于通过浏览器地址参数保存用户当前操作状态的需求),实现监听url路由切换、状态变化。
|
6月前
|
SQL 安全 Java
开启 Kerberos 安全认证的大数据环境中如何正确指定 HS2 的 jdbc url 地址?
开启 Kerberos 安全认证的大数据环境中如何正确指定 HS2 的 jdbc url 地址?
|
3月前
|
小程序 前端开发
获取url地址指定参数值
获取url地址指定参数值
|
4月前
|
JavaScript 前端开发 API
(简单详细)javascript中new url()属性,轻松解析url地址
(简单详细)javascript中new url()属性,轻松解析url地址
127 0
|
5月前
thymeleaf获取url地址跳转时所带参数
thymeleaf获取url地址跳转时所带参数
|
8月前
|
XML 安全 搜索推荐
URL地址
一个完整的URL的组成部分是啥?实际意义又是啥?还不赶紧来看看!
157 0
|
8月前
selenium--获取HTML源码断言和URL地址
selenium--获取HTML源码断言和URL地址
|
8月前
|
编解码 人工智能
一个神奇的小工具,让URL地址都变成了"ooooooooo"
一个神奇的小工具,让URL地址都变成了"ooooooooo"
64 0