Cloudflare Turnstile with Livewire
Playing
03. Installing the Cloudflare Turnstile package

Episodes

0%
Your progress
  • Total: 18m
  • Played: 0m
  • Remaining: 18m
Join or sign in to track your progress

Transcript

00:00
Next up, we're going to get the Laravel Cloudflare turnstile package pulled in, and I'm going to show you how to configure everything. Let's go down to the instructions, and we'll grab the command here to install this with Composer,
00:12
and of course, come over and pull this into our project. So next up, we're going to go ahead and add the keys that we extracted in the last episode into our config services file. So let's go ahead and grab the entire structure of this and go over to that file, so under config and services, and let's pull this down just at the
00:32
very bottom. So let's pull this in, and now we need to hook the keys that we grabbed earlier, the site key and the secret key, up to here. So we've got turnstile site key and turnstile secret key. Since we already moved these over, we can just hook these up. Let's say turnstile site key and assign that, and turnstile secret key, and we'll assign that. That's that one done.
00:54
Okay, so next up, we're going to go ahead and pull in the script. Because turnstile requires that we add the script to every page that we want to use this widget on, we've got a couple of options here. Now, since I'm using Laravel Breeze, and we have this overall template, so this layouts and app file, so open this up, this will be used within all of the authenticated layouts.
01:19
What we also have, if you are using Laravel Breeze, and come over to resources, views, and layouts, is this guest layout as well. That will be for the login and register pages. So I'm just going to add this to app.blade.php, but you can do exactly the same thing over in that guest layout if you want to. Okay, let's come down to the script section, and we'll use
01:39
this turnstile scripts directive to pull them in, and now they're pulled in on every page. And of course, you could pull them in manually on individual pages if you didn't want them everywhere. Okay, so now that we've done that, we are pretty much ready to go. Let's go over to the next episode and look at rendering this widget out inside of here.

Episode summary

In this episode, we focus on getting the Cloudflare Turnstile package set up in our Laravel project. First, we pull in the necessary package using Composer, following the official instructions. Next, we dive into configuring the package by adding the site key and secret key we grabbed earlier into our config/services.php file, making sure they're hooked up properly.

After configuring the keys, we shift our attention to pulling in the required Turnstile script. Since the widget needs its script loaded on every page where it will be used, we explore a couple of different ways to include it. If you're using Laravel Breeze, you'll likely want to add the script to your main layout files, such as app.blade.php or the guest layout for login and registration pages.

By the end of this episode, we've got the package installed and the scripts in place, so we're ready to start rendering the widget itself in the next episode!

Episode discussion

No comments, yet. Be the first!