Build and Secure a CRUD Application with Laravel 6

Hi @roenfeldt! Thanks for following along!

Laravel recently released 7.0 and we’re currently working to update the Auth0 package compatibility. It should be updated soon, but for now a quick fix to get the tutorial working is to specify to use Laravel 6. Laravel 6 was also just recently released and will continue to be supported into late 2021, so don’t worry about starting with 6. There isn’t a huge difference between the 2.

In composer.json, find where it says laravel/framework and change it to "laravel/framework": "^6.0",. Then run composer install again.

Let me know if that works for you! I’m going to update the article with that note as well, so thanks for pointing it out!

Hey @holly

Thanks for replying as well as providing me with the workaround! The thing is, I’ve recently started working with Laravel (coming from a WordPress background) so I’m hoping my questions don’t sound excessively ridiculous :slight_smile:

I tried out your solution, but I still couldn’t get past the same error. I ended up specifiying which Laravel version to use when creating the project the “Composer way”, i.e.

composer create-project --prefer-dist laravel/laravel tpc "6.*".

All went well this time, except for the step where laravel/ui Bootstrap package had to be added. Apparently, version 2 of laravel/ui is incompatible with Laravel 6.*. The error I encountered is described in this SO post, and the solution provided along with the first answer worked a treat for me. For the record, I simply replaced

composer require laravel/ui
with
composer require laravel/ui="1.*" --dev

The best thing is, I was finally able to complete the tutorial!

I really like the flexibility and insight into logins, that Auth0 provides. I’ll be looking forward to more high quality tutorials from you, @holly!

Finally have a little time to work on my web app again. Came back to your wonderful tutorial again when having trouble with Register. Getting the following error:

WE’RE SORRY, SOMETHING WENT WRONG WHEN ATTEMPTING TO SIGN UP.

Web console shows:

auth0.min.esm.js:8 GET https://dev-pqc7zd86.auth0.com/user/ssodata 404
u._end @ auth0.min.esm.js:8
u.end @ auth0.min.esm.js:8
N.end @ auth0.min.esm.js:8
X.getSSOData @ auth0.min.esm.js:8
nt.getSSOData @ auth0.min.esm.js:8
t.getSSOData @ p2_api.js:190
t.getSSOData @ web_api.js:64
(anonymous) @ data.js:4
t.fetch @ cache.js:17
t.get @ cache.js:13
r @ data.js:7
syncFn @ remote_data.js:27
(anonymous) @ sync.js:56
D @ sync.js:51
(anonymous) @ index.js:29
St @ immutable.js:1971
St @ immutable.js:1980
St @ immutable.js:1980
pt.updateIn @ immutable.js:1278
a @ index.js:29
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:91
setTimeout (async)
(anonymous) @ sync.js:91
(anonymous) @ index.js:11
(anonymous) @ atom.js:38
t._change @ atom.js:38
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:91
setTimeout (async)
(anonymous) @ sync.js:91
(anonymous) @ index.js:11
(anonymous) @ atom.js:38
t._change @ atom.js:38
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:60
setTimeout (async)
(anonymous) @ sync.js:59
(anonymous) @ cdn_utils.js:17
setTimeout (async)
(anonymous) @ cdn_utils.js:17
i.<computed>.t.Auth0.<computed> @ cdn_utils.js:15
(anonymous) @ fbS7fgZtZTjFPzd4Gf47gIjZvnRxy4yz.js?t1584159367246:1
index.js:429 There was an error fetching the SSO data. This is expected - and not a problem - if the tenant has Seamless SSO enabled. If the tenant doesn't have Seamless SSO enabled, this could simply mean that there was a problem with the network. But, if a "Origin" error has been logged before this warning, please add "https://dev-pqc7zd86.auth0.com" to the "Allowed Web Origins" list in the Auth0 dashboard: https://manage.auth0.com/#/applications/fbS7fgZtZTjFPzd4Gf47gIjZvnRxy4yz/settings
R @ index.js:429
errorFn @ remote_data.js:41
(anonymous) @ sync.js:64
setTimeout (async)
(anonymous) @ sync.js:64
(anonymous) @ index.js:29
St @ immutable.js:1971
St @ immutable.js:1980
St @ immutable.js:1980
pt.updateIn @ immutable.js:1278
a @ index.js:29
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:60
setTimeout (async)
(anonymous) @ sync.js:59
(anonymous) @ cache.js:30
t.execCallbacks @ cache.js:30
(anonymous) @ cache.js:19
(anonymous) @ auth0.min.esm.js:8
u.callback @ auth0.min.esm.js:8
(anonymous) @ auth0.min.esm.js:8
e.emit @ auth0.min.esm.js:8
e.onreadystatechange @ auth0.min.esm.js:8
XMLHttpRequest.send (async)
u._end @ auth0.min.esm.js:8
u.end @ auth0.min.esm.js:8
N.end @ auth0.min.esm.js:8
X.getSSOData @ auth0.min.esm.js:8
nt.getSSOData @ auth0.min.esm.js:8
t.getSSOData @ p2_api.js:190
t.getSSOData @ web_api.js:64
(anonymous) @ data.js:4
t.fetch @ cache.js:17
t.get @ cache.js:13
r @ data.js:7
syncFn @ remote_data.js:27
(anonymous) @ sync.js:56
D @ sync.js:51
(anonymous) @ index.js:29
St @ immutable.js:1971
St @ immutable.js:1980
St @ immutable.js:1980
pt.updateIn @ immutable.js:1278
a @ index.js:29
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:91
setTimeout (async)
(anonymous) @ sync.js:91
(anonymous) @ index.js:11
(anonymous) @ atom.js:38
t._change @ atom.js:38
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:91
setTimeout (async)
(anonymous) @ sync.js:91
(anonymous) @ index.js:11
(anonymous) @ atom.js:38
t._change @ atom.js:38
t.swap @ atom.js:12
i @ index.js:25
(anonymous) @ sync.js:60
setTimeout (async)
(anonymous) @ sync.js:59
(anonymous) @ cdn_utils.js:17
setTimeout (async)
(anonymous) @ cdn_utils.js:17
i.<computed>.t.Auth0.<computed> @ cdn_utils.js:15
(anonymous) @ fbS7fgZtZTjFPzd4Gf47gIjZvnRxy4yz.js?t1584159367246:1
8557d39a829c684961f4734ba222225d:1 GET https://secure.gravatar.com/avatar/8557d39a829c684961f4734ba222225d?d=404&s=160 404
Image (async)
r @ preload_utils.js:9
(anonymous) @ avatar.js:29
i @ gravatar_provider.js:30
r @ avatar.js:26
e.componentDidMount @ email_pane.jsx:14
t.notifyAll @ CallbackQueue.js:74
close @ ReactReconcileTransaction.js:78
closeAll @ Transaction.js:207
perform @ Transaction.js:154
perform @ Transaction.js:141
perform @ ReactUpdates.js:87
z @ ReactUpdates.js:170
closeAll @ Transaction.js:207
perform @ Transaction.js:154
batchedUpdates @ ReactDefaultBatchingStrategy.js:60
i @ ReactUpdates.js:95
dispatchEvent @ ReactEventListener.js:145
index.js:94 GET https://secure.gravatar.com/8557d39a829c684961f4734ba222225d.json?callback=__jp0 net::ERR_ABORTED 404
o @ index.js:94
t.get @ jsonp_utils.js:5
o @ gravatar_provider.js:17
r @ avatar.js:36
e.componentDidMount @ email_pane.jsx:14
t.notifyAll @ CallbackQueue.js:74
close @ ReactReconcileTransaction.js:78
closeAll @ Transaction.js:207
perform @ Transaction.js:154
perform @ Transaction.js:141
perform @ ReactUpdates.js:87
z @ ReactUpdates.js:170
closeAll @ Transaction.js:207
perform @ Transaction.js:154
batchedUpdates @ ReactDefaultBatchingStrategy.js:60
i @ ReactUpdates.js:95
dispatchEvent @ ReactEventListener.js:145
index.js:94 GET https://secure.gravatar.com/8557d39a829c684961f4734ba222225d.json?callback=__jp1 net::ERR_ABORTED 404
o @ index.js:94
t.get @ jsonp_utils.js:5
o @ gravatar_provider.js:17
r @ avatar.js:36
r @ fn_utils.js:6
setTimeout (async)
(anonymous) @ fn_utils.js:9
e.handleChange @ email_pane.jsx:21
executeOnChange @ LinkedValueUtils.js:130
i @ ReactDOMInput.js:239
r @ ReactErrorUtils.js:24
a @ EventPluginUtils.js:83
s @ EventPluginUtils.js:106
d @ EventPluginHub.js:41
h @ EventPluginHub.js:52
r @ forEachAccumulated.js:22
processEventQueue @ EventPluginHub.js:252
r @ ReactEventEmitterMixin.js:15
handleTopLevel @ ReactEventEmitterMixin.js:25
i @ ReactEventListener.js:70
perform @ Transaction.js:141
batchedUpdates @ ReactDefaultBatchingStrategy.js:60
i @ ReactUpdates.js:95
dispatchEvent @ ReactEventListener.js:145
auth0.min.esm.js:8 POST https://dev-pqc7zd86.auth0.com/dbconnections/signup 400

Also, can you explain about where the new user register info is stored - in your database or mine? Tutorial doesn’t really explain it in depth.

@greg7
When you get that error at signup, is there anything to see in the logs in Auth0 side?

Auth0 Dashboard > Logs > Search ?

Any failure logged that you can check? (If logged, click on it to view details)

Ah, yes. It says I already exist. That makes sense. I didn’t realize user info was actually being stored on Auth0 site. If the logs are smart enough to know the real reason for the error, would it be possible to tell the customer the real reason, rather than the vague message they get now?

Just wanted to say this is by far one of the best tutorials I’ve had the pleasure of following along to. Please keep up with this style of writing and teaching! It works incredibly well with the 0Auth/Laravel workflow.

Just as I found myself wondering a of couple things and noticing changes weren’t saving when editing reservations I went back to the page to find exactly what I was after! I’ve been following along to 0Auth tutorials for laravel authentication for a couple days now and this is the only one that got me up and running in a way that I expected the end result to be. Also the bonus for touching on how to use homestead and VM’s was an awesome addition! :smiley:

3 Likes

@holly I’m building a Laravel-driven SaaS website, and I’m seriously considering subscribing to the paid “DEVELOPER” Auth0 plan. As a matter of fact, I’ll do it in a heartbeat, if what I need is achievable :slight_smile:

Long story short, my SaaS website would provide 3 membership levels: Free / Premium / Premium Plus. I’ve already created three different roles under my Auth0 dahsboard ready for the users to get assigned to them, based on their chosen plan. Each plan will require users to input a rather wide array of personal info (first/last name, gender, date of birth, avatar image, street, zipcode, city, country, phone no. ) during the actual registering process. On top of that, the desired membership level must be also chosen by the user.

Would it be, therefore, possible that, when the user finishes filling up all the required info, and clicks the “Submit/Create Account” button, all the above mentioned info to be sent to Auth0, and the user account gets programatically created, along with all the personal details I was referring to?

And another question: what do you think is better, should I rely solely on the Auth0’s database to store the members’ account information, or should I also save the users’ info in the application’s database?

One final question: if I sign up for the “DEVELOPER” Auth0 annual plan, with the default 1,000 External Active Users, is it difficult to upgrade without any interruption in service, should my application require additional users?

I would highly appreciate your expert input on this. Thank you so much!

1 Like

Hello, Daniel. Thank you for your interest in using Auth0 as the Identity Solution for your SaaS product. Holly is currently out of office but, while she comes back, I have also raised your question in our internal channels. We’d get back to you with an answer as soon as possible :slight_smile:

2 Likes

Hello Dan,

Thank you for your reply! I just realized I provided a lot of details related to my SaaS project, except for the framework that the website will be run on. Just so that there’s no doubt about it, it’s Laravel 6. I know it should be pretty obvious, since my initial post belongs to the discussion thread on the Auth0/Laravel integration, but I thought I’d still point out the obvious nevertheless :blush:

Just for the record, I signed up for the yearly Developer planyesterday :star_struck:, can’t wait to be able to start building something awesome, especially in terms of safety and convenience for the users!

I will be looking forward to good news from you, Holly, or anyone else at Auth0 :star:

Thanks for suplementing that info @roenfeldt! :slight_smile:

1 Like