1

I have singlepage app at https://example.com. App's api and backend is driven by laravel. Can someone point me to the right direction how to open my spa at: https://example.com and backend at https://example.com/backend

What I've tried:

  1. I've put all my files of SPA in public folder and move laravel public files (including .htaccess and index.php) in public/backend folder

  2. Changed the public path of laravel to public/backend

This gives me Internal Server Error when access https://example.com/backend

Thanks in advance!

Improve this question

1 Answer 1

Reset to default
1

In case you want your SPA served via Laravel

Edit your routing so the api group is changed to backend. Then create a route in the web group for / which loads a blade template containing your vue components and vue router. The vue router will handle the SPA page loads after its loaded.

In case you want your SPA served separately from Laravel

In this case you'll have an entry point for your backend which is index.php. And you'll have an entry point for your SPA which will be index.html. I would advice you to keep your index.php in the /public folder of our Laravel installation. Then change the way index.html is compiled so it's placed in a different folder, lets say /build. You can probably achieve this by adjusting some webpack or vue-cli settings. Then adjust your webserver configuration (apache/nginx) so it will have the following two entries:

  1. https://example.com/backend which maps to /var/www/{project}/public
  2. https://example.com/ which maps to /var/www/{project}/build
Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Nice shot... but I don't want to mess my compiled index.html with blade's files of laravel. I'll wait a while for some others answer and will mark your question because it is a worked solution after all.
Ah I did not know you'd like to keep your index.html as is. I've updated my answer with a possible solution which might work for you in that case.
The solution in your update is better!!! Just to mention that I've implemented the first approach and after some tweaking (in routing and folder structure) working as expected... The only disadvantage is that after every build must paste the content of index.html in blade file! Thanks!
Doesn't your build create an app.js which can be included in the blade file instead? That way you won't have to copy-paste it over after every change. The only drawback is that you can't use versioning because then the the filename will change after every build.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.