Angular and Laravel

Question

How to setup Laravel and Angular.js folder structure on XAMPP. I understand creating an RESTFULL Laravel API.

I have been working on an app, but when I type in the address in the browser something like this "contacts/john" I get a Laravel View.

When I go to "/" then click on some contacts like John, I get correct table and browser address bar shoving "contacts/john", I refresh page and again get Laravel View.

It is a little bit unclear, but this seems to be and Laravel question, since there is no notion of Angular.js in there. Also this is very vague. What have you tried? — TheHippo, May 16 '13 at 15:54
I build simple app for viewing, saving, updating and deleting contacts(name, tel.number, email ...), using Laravel 3 in back-end, and Angular.js in front-end. It's work when I come in page from root( / ) but, if I entered url: "/contacts/some_user" in address bar, I get Laravel view not Angular. How to combine this two, I want to Angular routes trafick and use Laravel for quering database. — easyScript, May 16 '13 at 20:01
With Hashbangs all works good. I must rewrite every link to entry point of my application (e.g. index.html), for HTML5 mode. Thank You. — easyScript, May 16 '13 at 22:57

sisou · Answer 1 · 2014-12-07T23:59:11.457

I understand that Angular requests the route from the server via AJAX and then sets the browser's URL bar to the new location via the HTML5 history/pushstate methods?

If so, when you request the URL via a page reload, it gets routed by Laravel. Then, Laravel just serves the view that you have configured via your routes (sometimes plain JSON). Which is what you want, but only for Angular's AJAX calls.

I propose you add an isAJAX filter to your routes. In your filter.php declare this filter:

Route::filter('isAJAX', function()
{
    if (!Request::AJAX()) return Redirect::to('/')->with(array('route' => Request::path()));
});

Then put all your routes that you only want accessible via AJAX into a group. In your routes.php:

Route::group(array('before' => 'isAJAX'), function()
{
    Route::get('contacts/{name}', ContactController@index); // Or however you declared your route

    ... // More routes
});

This way, only Angular's AJAX calls return results from the database. Every manual page reload is routed back to '/' with a variable route set to the requested route. You would then have to pick up this route and initiate Angular's router with it.

Excellent solution. Can you tell me how to do the same in Laravel 5.1 please? — Neel, Jul 22 '15 at 12:55
Sorry, I haven't come around to using Laravel 5.* yet. Maybe someone else here may know. — sisou, Jul 23 '15 at 18:41
sure.. no worries. I see the filters are not there in laravel 5 but I think the same can be achieved through middleware. I need to figure out how to do that. :) — Neel, Jul 23 '15 at 18:46

score -1 · Answer 2 · answered May 12 '15 at 07:35

Basically this is my routes configuration when working with Angular as my API consumer

// HOME PAGE ===================================  
// we don't need to use Laravel Blade 
// we will return a PHP file that will hold all of our Angular content
// We'll put all of our angular file on the public folder  
Route::get('/', function() {   
    View::make('index'); // will return app/views/index.php 
});

// API ROUTES ==================================  
Route::group(array('prefix' => 'api'), function() 
    Route::resource('comments', 'CommentController', 
        array('only' => array('index', 'store', 'destroy')));

});

// CATCH ALL ROUTE =============================  
// all routes that are not home or api will be redirected to the frontend 
// this allows angular to route them 
App::missing(function($exception) { 
    return View::make('index'); 
});

Since we will put all of our angular code in public folder of the laravel, we also need changes the way laravel get the view.

// app/config/view.php
...

    // make laravel look in public/views for view files
    'paths' => array(__DIR__.'/../../public/views'),

...

This doesnt answer the OP's question I dont think although the OP has been very vague with the question without any code sample. But from the queston I am guessing OP probably has a route set-up like your answer said which will not prevent laravel routes from being accessed directly. I think @sisou answer is the correct one that actually prevents laravel's route being access via browser that are Non-AJax. — Neel, Jul 03 '15 at 14:12

Angular and Laravel

2 Answers2

Linked