I need to make laravel redirect to an Angular route.
I'm deploying my first project using Angular7 for front & laravel 5.8 for the API and it works fine in development. However when I build the Angular project and locate it in the public directory of laravel so that I can access it by http://127.0.0.1:8000/<my project name> angular route doesn't work if I request a specific link like http://127.0.0.1:8000/<my project name>/view/data/45. In this case laravel returns 404 response since this is Angular's route not laravel.
fixed it by adding a new route to Laravel routes which redirect whatever it got to the index page of Angular and added the <router-outlet></router-outlet> to my index.html page
Related
Any help would be really appropriated on how to achieve this.
I have currently three separate applications, two front-ends running with vue.js and one backend app, with laravel tenancy, only serving API's, no front-end.
The main base URL or the backend url is set to example.com, this is the tenancy application. It auto-generate URL subdomain.example.com for tenants & databases, as the tenancy package works.
Another domain setup for secure.example.com that points to the another vue application, where we register. Works perfectly well.
Now I have a third application on vue.js, for the tenant's, that points to anything to *.example.com,
and the way the tenancy works, is that wildcards & directory must be set to the main application where tenancy is installed, for the tenancy to work with subdomains.
I cannot create *.example.com & point it to the vue application, as the API calls, then go to vue application not to the back-end, as the sub-domain *.example points to vue application
The whole point is to separate the Tenant UI entirely using a frontend framework like vue.js from the back-end.
Im using Quasar separated from the Laravel Api, with the Hyn Multitenant package..
brightmind-erp.com
demo.brightmind-erp.com
In public/panel from Laravel public folder I'm inserting the dist assets from Quasar, and redirecting '/' calls to that route where Vue Router enters in action:
Route::get('/', function() {
return redirect()->route('frontend');
});
// Route everything else to Vue
Route::get('panel/{any?}', function () {
return file_get_contents(public_path().'/panel/index.html');
})->where('any', '.*')->name('frontend');
If you're using Webpack you have to configure it to find the Vue assets from (in this case) '/panel' folder....
I fought with a lot of tutorials to configure .htaccess file or nginx config to make the api work in '/api' route and vue in '/' but I couldn't
Let me explain myself better. I have a website created with CodeIgniter and I am trying to add another project created in Laravel that I want to be accessible by subdomain.
How can I proceed about this? How can I establish the subdomain routing in CodeIgniter to be able to point to the Laravel project?
Nothing to do with Laravel or CodeIgniter routing,
If you set the Laravel app in subdomain, just call the url to that domain from CodeIgniter.
I am using angular 6 project in a laravel backend. I build the project with --prod and -base-href = /public/angular/dist/ and everything is great. Now i load the index html file from public/angular/dist/index.html inside a laravel blade:
include base_path()./public/angular/dist/index.html';
The blade loads perfectly the static angular deployed html file but my only problem is that the url turn into
mydomain.com/public/angular/dist
I tried with htaccess to rewrite the url but I couldn't make it. Is there any way u can help me?
As I understand, the combination of Angular 2+ and Laravel are meant to be separated projects.
In the backend you make an api with Laravel and then you can consume it from any front end: angular, react, android, etc.
In the frontend you make a service that fetch the api urls in the backend and that url responses a json, it may be in example, a list of users.
it will works :
1. Build your angular app with following cmd :
ng build --prod --output-path pwa-app--base-href /pwa-app/
Copy paste angular project build to your laravel application
3.Go to resources > views . Create app.php and paste the following code
<?php readfile("./pwa-app/index.html"); ?>
4.Add the following route inside web.php
Route::any('/pwa-app/{any?}',function() { return view('app'); });
5.Try !!!
yourdomain/pwa-app
I hope this will works ...
I have an application with Vue and laravel5.6 which is working fine on my virtual machine setup.
What is the way to host it on live shared hosting server.
I got 500 internal server error while accessing it from URL,as there is no routes defined as GET.
Note:The index is coming from the Vue project. Laravel is only API
Like #Gaurave Dave had suggested in the comment section,
you can insert a code in your web.php for all request to go to a view. An example is given below.
Route::get('/{any}', function(){
return view('index');
})->where('any', '.*');
so inside your index.blade.php, you can insert your Vue script code or component, this will serve as landing for your Vue app.
I would require a little help here if this method will work out well.
Firstly, I have a backend API server created using Laravel and Laravel Passport. Secondly, I have also created the frontend with Vuejs within the same project. As such, I will be required to use both the api.php and web.php routes. I am also redirecting these routes using vue-router.
Backend
Inside the web.php routes, I have used two different routes because I want to display generic contents on my landing site and the other as an authentication required dashboard.
Example:
web.php
As above, this is to capture the routes which are 404 Not Found that are directly manipulated in the address bar to redirect correctly to their respective pages. I also ended up having two different blade templates named as dashboard.blade.php and home.blade.php respectively. Is this an okay practice for a Laravel-Vuejs project? Or are there ways that you would like to recommend?
dashboard.blade.php
home.blade.php
Login related problem with login page using the layout of the landing page into another layout of the dashboard page
The problem that I am faced with when doing an API login with the password grant is that the login page does not redirect to the dashboard page properly. The URL route does change but the page is rendered as blank.
The login using axios here:
I have managed to fix the problem.
In web.php, since we have
Route::get('/dashboard/{any?}', function () {
return view('dashboard');
})->where('any', '^(?!.*api).*$[\/\w\.-]*');
Inside of my Login.vue redirect handler, I use location.href = '/dashboard' instead of this.$router.push('dashboard').