Troubles making app working

[laurentplenet]

Hey there! I am trying (as a newbie) to make your boilerplate working, I followed the entire documentation but facing the following errors : https://ibb.co/cCGygcL Could you help me with this because I spent hours on this without found out what was my mistakes... I've launched the serve, seeing the login/signup panel, but when I click on signup button those errors occurs and nothing seems to be working... Your help would be appreciated! Regards, Laurent

[iliyaZelenko]

I will be very happy to help you. A couple of days ago I saw you put me a star, thanks for that!

I have encountered this error. izitoast notifier is called, but, it is not supported on the server side.

At first this method was started:

https://github.com/iliyaZelenko/laravel5.7-vue-cli3-boilerplate/blob/master/frontend/src/plugins/notifications.js#L8

After which it started:

https://github.com/iliyaZelenko/laravel5.7-vue-cli3-boilerplate/blob/master/frontend/src/tools/validator.js#L44

It's silly to use this method on the server side, I don't know why I did it then (I wrote this code a long time ago)

Fortunately, I have a similar project, it is on a github, and so I thought out the notification system well.

Here is the same file:

https://github.com/iliyaZelenko/blog-laravel/blob/master/frontend/src/plugins/notifications.js

The output of messages on the client is the same, but how the output of messages on the server is arranged:

• Cookies are used to store server messages: $cookies.set('showMessagesInBrowser', serverMessages)
• Cookies are read in the nuxt template and displayed via the browser method (client side).

For cookies i use https://github.com/iliyaZelenko/blog-laravel/blob/master/frontend/package.json#L20.

I am very sorry that this took you so much time. Write if there are still questions.

[laurentplenet]

Hey there! Thanks a lot for your reply!

I tried to make the change in the notification.js file but that doest change a thing... Sorry Im on learning VueJs with Laravel so maybe Im missing something... I still got the same 404 error.... Here is the changes I made :

In rootPath/.env file: FRONTEND_URL=http://localhost:8080 FRONTEND_EMAIL_VERIFY_URL=/verify-email?queryURL= VUE_APP_BACKEND=http://localhost:8080 APP_NAME=Laravel APP_ENV=local APP_KEY=base64:Z4E/aDM8yknYHPp2Aqs432UTI1kp6PYUEf7K6M4gksM= APP_DEBUG=true APP_URL=http://localhost:8080

LOG_CHANNEL=stack

DB_CONNECTION=mysql DB_HOST=localhost DB_PORT=3306 DB_DATABASE=laracli3 DB_USERNAME=u_laracli3 DB_PASSWORD=test0000

BROADCAST_DRIVER=log CACHE_DRIVER=file QUEUE_CONNECTION=sync SESSION_DRIVER=file SESSION_LIFETIME=120

REDIS_HOST=127.0.0.1 REDIS_PASSWORD=null REDIS_PORT=6379

MAIL_DRIVER=smtp MAIL_HOST=smtp.mailtrap.io MAIL_PORT=2525 MAIL_USERNAME= MAIL_PASSWORD= MAIL_ENCRYPTION=null

PUSHER_APP_ID= PUSHER_APP_KEY= PUSHER_APP_SECRET= PUSHER_APP_CLUSTER=mt1 MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}" MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}" JWT_SECRET=gQ4fVKtGzhRjdmDBEELGO2VJX47YrdMD

Also created a .env through : /rootPath/frontend/.env file with this in it: VUE_APP_BACKEND=/admin

When I process the npm script with PhpStorm the app is compiling, and I can acess the localhost app, I can see the login page, signup page etc... But on the click I got 404 Error bad request as you can see in the previous post... Did I missed something ?! Is there any thing that I must change with my configuration ? I just followed the steps as describe in your readme (and skip the steps 6).

Is there any thing more that must be done to make the boilerplate works properly ? Regards, Laurent

[laurentplenet]

When I processed "npm install" on the last step it returns:

audited 42573 packages in 12.34s found 63 low severity vulnerabilities run npm audit fix to fix them, or npm audit for details

Don't know if this helps?!

[laurentplenet]

As you can see below, with the: VUE_APP_BACKEND=/admin I got the following error when I hit the Signup button:

[iliyaZelenko]

I understand what the problem is, the path for the backend (REST API server) must be specified as an absolute path, that is, include the host and port.

I created example .env, my bad is that i haven't done it for the frontend before.

Let me know if this resolves your problem.

[laurentplenet]

Hey @iliyaZelenko Thanks again for your time! I made the changes but still got an error, but a different one this time as you can see bellow! that says: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL Is there something more ?!

Regards, Laurent

[iliyaZelenko]

It looks like the request is not a valid url. Try displaying the URL of the request via console. Maybe something with VUE_APP_BACKEND, try changing the position of the comment.

This project worked for many others, so in my code I think there is no error.

[laurentplenet]

Thanks @iliyaZelenko ! With your previous explainations I am now abble to login to the admin panel ! I can see the profile page, reset password, etc... ! One more thing, I don't mean to be a bother, I would like to know about How does the laravel controller is called to generate vuejs variables.... ? If I wanted to add some section with « add project » how would I process to create the vuejs tunnel that makes the datas saved in database and accessible with vuejs ?

[iliyaZelenko]

I'm happy I helped fix the error.

By the way, what I wrote in the first message, you do not need to do, it probably confused you. I forgot that there is no ssr (Nuxt.js), there is an ordinary spa, so the notifications are ok.

One more thing, I don't mean to be a bother, I would like to know about How does the laravel controller is called to generate vuejs variables.... ?

Frontend (Vue) and backend (Laravel) are two different projects.

Lara is used only as api. That is, it returns the necessary data or accepts the request and works through it with the database.

You can find more information on the Internet, look for "Laravel, Vue REST API".