Tema corporativo no Apache Guacamole

Neste post vamos dar um belo toque ao Apache Guacamole, Por um lado, faremos com que ele responda como o site padrão, Vá sem que os usuários tenham que colocar o /guacamole; E ainda por cima, o habitual, coloque um tema personalizado nele, perto do usuário, corporativo, com logotipos, Fundos, Cores da empresa…

Poço, Para lembrar, Em um post anterior já vimos Como instalar o Apache Guacamole, ademais como integrá-lo ao Active Directory. Uma ótima solução de código aberto que permite acesso remoto seguro a computadores pela Internet. Poço, Como eu disse, Hoje é hora de mudar de assunto e torná-lo legal, Veremos o que jogar minimamente para deixá-lo bem.

Site padrão

Para que o Apache Guacamole seja o site padrão em nosso Tomcat. Simplesmente, Vamos parar o Tomcat, renomeie o aplicativo para ROOT e inicie o Guacamole novamente; No porto 8080 Ele responderá sem /guacamole/

systemctl stop tomcat9 cd /var/lib/tomcat9/webapps/ rm -rf ROOT mv guacamole.war ROOT.war systemctl start tomcat9

Mas tenha cuidado! se tivermos proxy reverso com Apache, Também modificamos o arquivo /etc/apache2/sites-available/default-ssl.conf com as seguintes alterações:

De:

<Localização /guacamole/>

Para:

<Localização/>

De:

ProxyPass http://XXX.XXX.XXX.XXX:8080/guacamole/ flushpackets=on

Para:

ProxyPass http://XXX.XXX.XXX.XXX:8080/ pacotes de descarga=em

E de:

ProxyPassReverse http://XXX.XXX.XXX.XXX:8080/guacamole/

Para:

ProxyPassReverse http://XXX.XXX.XXX.XXX:8080/

E reiniciamos o Apache:

Systemctl Reiniciar Apache2

Alterando o logotipo

Para alterar o logotipo, nós simplesmente substituí-lo:

CP logo.png /var/lib/tomcat9/webapps/guacamole/images/guac-tricolor.png

Para adaptar o logotipo ao tamanho que melhor nos convier, em /var/lib/tomcat9/webapps/guacamole/guacamole.css na seção .login-ui .login-dialog .logo { Mudar:

De:

Para:

Largura: 3eme;
altura: 3eme;
tamanho de fundo: 3em 3em;
-tamanho de fundo de moz: 3em 3em;
-tamanho do plano de fundo do webkit: 3em 3em;
-khtml-background-size: 3em 3em;

Largura: 235Px;
altura: 55Px;
tamanho de fundo: 235px 55px;
-tamanho de fundo de moz: 235px 55px;
-tamanho do plano de fundo do webkit: 235px 55px;
-khtml-background-size: 235px 55px;

E também em /var/lib/tomcat9/webapps/guacamole/guacamole.min.css dentro da seção .login-ui .login-dialog .logo{

De:

...margem:.5em auto;Largura:3eme;altura:3eme;tamanho de fundo:3em 3em;-tamanho de fundo de moz:3em 3em;-Webkit-B...

Para:

...margem:.5em auto;Largura:235Px;altura:55Px;tamanho de fundo:235px 55px;-tamanho de fundo de moz:235px 55px;-Webkit-B...

Podemos alterar o idioma e a breve descrição alterando em /var/lib/tomcat9/webapps/guacamole/translations/en.json

De:

"NOME" : "Apache Guacamole",
"NOME" : "Inglês",

Para:

"NOME" : "Acesso ao Meu Computador",
"NOME" : "Espanhol",

E reiniciamos o Tomcat:

Systemctl Reiniciar tomcat9

Alterando o plano de fundo

Para alterar o plano de fundo e colocar uma imagem em vez do branco padrão, em /var/lib/tomcat9/webapps/guacamole/guacamole.min.css; na seção div.login-ui{

De:

fundo:Branco;

Para:

imagem de fundo: URL('RUTA.jpg');tamanho de fundo:cobrir;

E também em /var/lib/tomcat9/webapps/guacamole/guacamole.css Dentro da seção div.login-ui {

De:

fundo: preto;

Para:

imagem de fundo: URL('RUTA.jpg');
tamanho de fundo:cobrir;

Alterando a caixa central

Se quisermos modificar o quadro central, por exemplo, remova a borda e a sombra, e torná-lo um sombreamento que pareça mais elegante, em /var/lib/tomcat9/webapps/ROOT/guacamole.min.css; na seção .login-ui .login-dialog{

Retirar:

Fronteira: 1px rgba sólido(0, 0, 0, 0.25);
sombra de caixa: 1px 1px 2px rgba(0, 0, 0, 0.25);

Adicionar:

cor de fundo:rgba(0,0,0,0.2);

E o mesmo em /var/lib/tomcat9/webapps/ROOT/guacamole.css Dentro da seção .login-ui .login-dialog {

Retirar:

Fronteira: 1px rgba sólido(0, 0, 0, 0.25);
sombra de caixa: 1px 1px 2px rgba(0, 0, 0, 0.25);

Adicionar:

cor de fundo:rgba(0,0,0,0.2);

Campo de nome de usuário e senha

O campo de nome de usuário e senha é transparente, colocamos branco da seguinte forma, em /var/lib/tomcat9/webapps/ROOT/guacamole.min.css; dentro da seção .login-ui .login-fields .labeled-field.empty entrada{

De:

fundo: transparente;

Para:

fundo: Branco;

E igualmente, em /var/lib/tomcat9/webapps/ROOT/guacamole.css Na seção .login-ui .login-fields .labeled-field.empty entrada {

De:

fundo: transparente;

Para:

fundo: Branco;

Cor do botão

E venha por último, Para alterar a cor do botão, cada um ao seu gosto, ei!: Em /var/lib/tomcat9/webapps/ROOT/guacamole.css na seção de entrada[tipo=”Enviar”], botão, a. botão {

De:

cor de fundo: #3C3C3C;

Para:

cor de fundo: #7D0458;

Fazendo a mudança persistente

Algo muito importante e que não comentamos até agora, mas a mudança do logotipo, plano de fundo e CSS para seu tamanho são perdidos toda vez que a máquina é reiniciada, por isso, Faremos cópias dos arquivos modificados em /home/guacamole/no_borrar/

cp /var/lib/tomcat9/webapps/ROOT/guacamole.min.css /home/guacamole/no_borrar/ cp /var/lib/tomcat9/webapps/ROOT/guacamole.css /home/guacamole/no_borrar

E com um pequeno script no cron, ele será copiado toda vez que você inicializar o logotipo, fundo, O css… Nós chamamos isso de: (e torná-lo executável) /Home/Guacamole/no_borrar/cambia_tema_guacamole.sh com o seguinte conteúdo:

cp /home/guacamole/no_borrar/logo.png /var/lib/tomcat9/webapps/ROOT/images/guac-tricolor.png cp /home/guacamole/no_borrar/guacamole.css /var/lib/tomcat9/webapps/ROOT/guacamole.css cp /home/guacamole/no_borrar/guacamole.min.css /var/lib/tomcat9/webapps/ROOT/guacamole.min.css cp /home/guacamole/no_borrar/en.json /var/lib/tomcat9/webapps/ROOT/translations/en.json systemctl restart tomcat9

E colocamos no Cron, por exemplo, para que toda vez que a máquina for iniciada, ela a carregue, com 'crontab -e':

@reboot dormir 30 && /Home/Guacamole/no_borrar/cambia_tema_guacamole.sh

Poço, Por trás deste emblema, ou txapa em Bilbao, Espero que você tenha algo legal, você viu que não custa nada colocar um tema personalizado no Apache Guacamole, Que com um logotipo, um Fundo, Mude a cor do botão e mais alguns truques serão totalmente corporativos, Então, se todos os nossos portais são personalizados, Os usuários terão um maior senso de confiança ao entrar nos sites, Os chefes felizes…

Um abraço para tod@s!