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

AngularJS - Alterar path das APIs dinamicamente (na instalação em cliente)

Boa noite, estou desenvolvendo um sistema web utilizando AngularJS e gostaria de saber se existe algum padrão de projeto ou uma forma na qual eu altere o path dos meus endPoints dinamicamente. Vou explicar melhor: Tenho um JS responsavel pelo lookup da aplicação, isto é, controlar e direcionar todos os endpoints. Segue exemplo do arquivo:

(function() {

    'use strict';

    angular
        .module('aplicacao-app.serviceLookup', []);

    angular
        .module('aplicacao-app.serviceLookup')
        .factory('serviceLookup', serviceLookup);

    serviceLookup.$inject = [];

    function serviceLookup() {

        var init = 'https://10.71.64.29:8243/api/aplicacao';

        var OPERACAO_SERVICES = {
            COMMON: init + 'operacoes/:id',
            COMMON_ZOOM: init + 'operacoes/buscar/:codigo'
        };


//todo mapeamento das APIs

var SERVICES = {
            OPERACAO: OPERACAO_SERVICES,
        };

        return {

            getService: function(serviceName, serviceType) {
                return SERVICES[serviceName][serviceType];
            }
        };
    };
}());

A partir deste arquivo, todas minhas Factory's utilizam dele para mapear os endpoins. Como faço para deixar >> var init = 'https://10.71.64.29:8243/api/aplicacao'; << de acordo com o contexto que vou instalar no cliente? Alguma variável de ambiente, parâmetro externo ?

Fico no aguardo. Desde já obrigado!

11 respostas

Opa Patrick, não sei se há de fato um padrão pra esse tipo de coisa. Mas é muito comum o uso de variáveis de ambiente para coisas parametrizáveis. Acho que é uma boa ideia, assim você pode definir uma para trabalhar localmente no projeto e quando subir o projeto no cliente, já configurar a variável de acordo.

Boa noite... Você teria algum exemplo de como o JavaScript captura alguma variável de ambiente?

No caso do cliente, não conheço nenhuma forma Patrick. Infelizmente esse é o fato. Como as variáveis de ambiente praticamente dependem do SO, no navegador não temos esse recurso até onde sei.

Se estivesse usando versões mais recentes do Angular que são mais vinculadas ao Node e com opções server side, sim, seria muito tranquilo fazer isso.

Tem alguma forma de ler algum arquivo externo, um properties?

Estou pesquisando alguma forma de pegar uma variável de ambiente, global ou alguma forma de externalizar estas informações...

Alguém tem uma dica?

Opa Patrick, desculpa a demora, mas pesquisando aqui uma forma, você pode ser escrever um arquivo properties por exemplo no projeto e ler ele via XMLHttpRequest, o velho ajax também serve para leitura de arquivos locais.

Documentação do XHR: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

Se tratando de leitura de arquivos, o que vai mudar é: você não vai verificar o status 200 por exemplo, que é o status que o servidor web te envia, mas sim pelo status 0 que pode significar duas coisas: Que a requisição está "aberta" ou "não definida".

Lembrando que precisa passar o caminho completo para o arquivo. Testa pra gente?

Lembrando que precisa tratar a entrada de texto, se for um properties com chave e valor, você ainda vai usar talvez Regex para pegar exatamente o valor que quer capturar ou mesmo irá fazer parte desse arquivo de texto para um objeto javascript.

Boa pessoal!!

Valeu galera... vou tentar e até amanhã já coloco o exemplo implementado aqui...

solução!

Bom dia pessoal! Desenvolvi o exemplo e funcionou perfeitamente do jeito que eu precisava. Segue o exemplo abaixo:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Teste</title>
</head>

<body>

    <script>

        function reqListener() {
            console.log(this.responseText);

            if(this.responseText){
                var json = JSON.parse(this.responseText);
            }
        };

        var oReq = new XMLHttpRequest();
        oReq.onload = reqListener;
        oReq.open("get", "../file.json", true);
        oReq.send();

    </script>

</body>

</html>

Lembrando que o arquivo file.json fica fora da pasta da aplicação. ;)

Bacana Patrick, que bom que a solução que te indiquei funciona! Fico feliz que tenha dado certo. Bons estudos!

Obrigado amigo!