Solucionado (ver solução)
Solucionado
(ver solução)
9
respostas

Interceptor

Como excluir rotas específicas para que o interceptor não as olhe, liberando as publicamente ?

Outra detalhe foi que no curso do angular não é necessário utilizar # nas url's, porém o truque não foi ensinado no curso de como preparar o back para isso.

9 respostas

O curso de AngularJS mostra como retirar o # da rota

Na main você acrescenta

        .config(function ($routeProvider, $locationProvider) {
            $locationProvider.html5Mode(true); // esta linha

No index.html você acrescenta dentro de head

    <head>
        <base href="/"> /* esta linha */
...

Ele é mostrado na Aula 5 do AngularJS.

"Como excluir rotas específicas para que o interceptor não as olhe, liberando as publicamente ?" Não entendi muito bem por isso não vou opinar.

Configurei o AngularJS como eu falei acima porém se atualizar a página sem a cerquilha '#' ele aparece Cannot GET /fotos, este problema eu não sei solucionar.

Danilo retirar a # da rota eu sei fazer como foi mostrado nas aulas, porém o servidor(back-end) deve estar preparado para receber a implementação, onde não foi mostrado como deixa-lo pronto para isso.

O interceptador opera sobre requisições Ajax, não opera sobre rotas. O que o interceptador faz é verificar por 401. Se rolar 401, ele o joga para a tela de login. É só você escolher quais API's serão protegidas ou não.

Sobre o # eu não coloquei sem no treinamento de MEAN porque muitos alunos não chegam preparados para o treinamento de MEAN nem de Angular, ou falta algum conhecimento de JavaScript ou um entendimento mais sólido de como funciona um servidor. Se não houvesse hash, o aluno poderia confundir rota no cliente com rota de API no backend.

No entanto, se você não quer usar o hash (Google usa em vários serviços) seu servidor precisa devolver sempre index.html em qualquer requisição feita para o servidor que não seja processada por nenhum API.

Você pode abrir o servidor fornecido pelo curso de Angular, lá terá uma rota específica que devolve index.html.

Se quiser saber mais pode ver este post:

http://www.seankenny.me/blog/2013/08/05/angularjs-in-html5-mode-with-expressjs/

Só cuidado na hora de informar o caminho de index.html.

Show de bola Flavio, sobre o interceptor a idéia seria passar para ele uma url da qual eu não quero que ele verifique o 401, ou seja, independente se tem usuário logado ou não a página deverá ser exibida(página pública).

Em java consigo fazer isso através de anotação, crio uma anotação por exemplo @Public e no interceptor informo para ele não interceptar métodos anotados como @Public.

Sobre o # vou verificar os fontes do projeto alurapic feito em angular.

Abraços

solução!

Você está confundindo as coisas um pouquinho. Quem protege ou não recurso é sua API do seu servidor. Angular segue o status code que sua API determinar. É o seu server que orquestra isso.

Você está comparando uma SPA com uma aplicação Web tradicional, são coisas totalmente diferentes. Em SPA seu servidor fornecesse uma API para ser consumida por uma aplicação Angular, Android, IPhone seja lá qual aplicação for. Sua API é agnóstica de tecnologia de view e sua apenas o protocolo HTTP. Não é raro alunos criarem blogs ou outro tipos de aplicação que não faz muito sentido usar Angular.

Bom, vou me ater ao que você quer fazer para não entrar em questões arquiteturais que fogem do foco.

No curso de MEAN você viu que no JWT você pode colocar qualquer coisa no payload do token. Certo? Lá você pode colocar, por exemplo, alguma info para dizer se o usuário tem acesso ou não aquela ou essa página (parcial, para ser mais correto, porque página é a mesma durante toda aplicação). Daí você pode acessar quando o módulo de rotas processar a página, algo assim:

angular.module('moduloQualquer', [])
.run(function ($rootScope) {
    $rootScope.$on("$routeChangeStart",function(event, next, current){
      console.log( next.templateUrl) // mostra a view que quer acessar
      // acessa seu token aqui e faz alguma verificação.
    });
});

Com isso você tem um recurso análogo ao que você já usou lá no seu backend feito em Java.

Entendido, muito obrigado.

A solução de acessar o token no evento $routeChangeStart não vai funcionar. O token está encriptografado no cliente (esqueci desse detalhe). O que você pode fazer é criar duas app em Angular.. uma pública e outra privada... talvez fique melhor organizado.

Ok Flavio, estava pensando exatamente em fazer isso, ter o controle do banco em uma aplicação separada porém não tinha certeza se era uma boa idéia, mas vou fazer assim então vqv \o/.