Use chat on instance which runs on a different port then port 80. (was: No chat window stable or development package)

emper0r · October 19, 2018, 8:16am

Infos:

Important:
If you are a Zammad Support or hosted customer and experience a technical issue, please refer to: support@zammad.com using your zammad-hostname / or company contract.

Used Zammad version: 2.6 and 2.7
Used Zammad installation source: (source, package, …) :

zammad 2.6.0-1539902613.d89d86d8.stretch amd64
zammad 2.7.0-1539932435.8b554e9d.stretch amd64

Operating system: Debian 9.5 last stable update stable server side
Browser + version: Chrome Versione 69.0.3497.100, Safari - Versione 12.0 (14606.1.36.1.9), Mojave 10.14 client side

Expected behavior:

Show chat window when agent connect or at least show windows minimized when no agent are online.

Actual behavior:

Not appears any windows, maximized or minimized, I test everything like the doc. using chat module manual or automatic and nothing happened, Tested the code into wordpress and thinking was wordpress issue I tested it in a simple html code.

Steps to reproduce the behavior:

apt install zammad (stable or develop) fresh install
configure standard settings apply to open chat,
create the agent,
login as agent and open another browser tap
create this simple code and test.

( label tag of html are semi-showed to can see the code )

h1>My First Heading</h1
p>My first paragraph.</p
script src=“https://code.jquery.com/jquery-2.1.4.min.js”/script

as a doc explain: automatic or manual way not work in both packages stable or develop installation

script src=“http://192.168.207.9:8083/assets/chat/chat.min.js”></script
script
$(function() {
new ZammadChat({
background: ‘#ededed’,
fontSize: ‘12px’,
chatId: 1
});
});
/script

/body
/html

edneymatias · October 19, 2018, 11:00am

Chat needs to be ativated on Zammad and at least one online agent to show up. Did you check that?

emper0r · October 24, 2018, 4:35pm

the agent of course exist because I test with me myself, but what is Zurmo ?, I’m using the code into a simple web html file before use into a wordpress home page

edneymatias · October 24, 2018, 8:40pm

My mistake, I meant Zammad.

edneymatias · October 24, 2018, 8:50pm

I also used a simple html to test:

<html lang="pt-br">
<meta charset="utf-8">
<head>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>
<script src="https://ajuda.odontolifeodontologia.com.br/assets/chat/chat.min.js"></script>
<script>
$(function() {
  new ZammadChat({
    background: '#e3d0bb',
    fontSize: '12px',
    chatId: 1
  });
});
</script>
</body>
</html>

Hannes · October 25, 2018, 8:50am

Hi @edneymatias,

is anything logged within the developer tools? An 404 or 500 error code or an JS Error in the console log?

emper0r · October 25, 2018, 10:20am

Hi again

using your test page not show up nothing, i can load all jquery requisites as .js and see all the code on browser inclusive chat.js but when I try to load appears blank

Hannes · October 25, 2018, 10:32am

Hi @emper0r
there is a console and a network tab.
Please post the output from those two tabs.

I would suggest to put you test.html in the /opt/zammad/public folder of Zammad and test it there.

regards

edneymatias · October 25, 2018, 11:20am

You need to change your test html! You must use the one suggested in the admin interface under chat channel configuration. The one I put here was just an example, just to show you that it works with a simple html. It won’t work with your server.

emper0r · October 26, 2018, 2:13pm

Hi,

I put the image screenshot… the console log show error with websocket… in the zammad apache configuration explain need to be use a localhost with 6042 port but this one is up too…and still no show the chat window.

This never works… need to be listen to 8083

chat.min.js:1 WebSocket connection to 'ws://192.168.207.9/ws’ failed: Error during WebSocket handshake: Unexpected response code: 200

must to be load http://192.168.207.9:8083/assets/chat/chat.css
NOT http://192.168.207.9/assets/chat/chat.css

I want to add. the apache config is a virtualserver by default into port 80 a mediawiki for our wiki intern… and the zammad site is running on 8083 custom port, so any request to can enable chat windows must to be pass under 8083 not 80 directly… so I think need to be change the zammad.conf but what I can change ??

this is what i got.

root@webhosting:/opt/zammad/public# cat /etc/apache2/sites-available/zammad.conf

this is the apache config for zammad

<VirtualHost *:8083>
# replace ‘localhost’ with your fqdn if you want to use zammad from remote
ServerName supporto.ctimeapps.it

## don't loose time with IP address lookups
HostnameLookups Off

## needed for named virtual hosts
UseCanonicalName Off

## configures the footer on server-generated documents
ServerSignature Off

ProxyRequests Off
ProxyPreserveHost On

<Proxy localhost:3000>
Require local
</Proxy>

ProxyPass /assets !
ProxyPass /favicon.ico !
ProxyPass /robots.txt !
ProxyPass /ws ws://localhost:6042/
ProxyPass / http://localhost:3000/

DocumentRoot "/opt/zammad/public"

<Directory />
    Options FollowSymLinks
    AllowOverride None
</Directory>

<Directory "/opt/zammad/public">
    Options FollowSymLinks
Require all granted
</Directory>

emper0r · October 26, 2018, 2:15pm

I know your test was for your server, I always show my 1st error using my own server… is the same test code take it from the admin example…

Hannes · October 26, 2018, 2:58pm

Hi, kann you please add debug: true to your chat widget. Just beneath the chatId: 1 and then post the output

Hannes · October 26, 2018, 3:04pm

Addition:

I’m pretty sure the issue is related to your apache config:
Have you enabled the needed mods?

a2enmod proxy
a2enmod proxy_http
a2enmod proxy_wstunnel

emper0r · October 29, 2018, 4:16pm

Hi, yes I got it enabled from the beginning

root@webhosting:~# a2enmod proxy
Module proxy already enabled

root@webhosting:~# a2enmod proxy_http
Considering dependency proxy for proxy_http:
Module proxy already enabled
Module proxy_http already enabled

root@webhosting:~# a2enmod proxy_wstunnel
Considering dependency proxy for proxy_wstunnel:
Module proxy already enabled
Module proxy_wstunnel already enabled

root@webhosting:~# /etc/init.d/apache2 restart
[ ok ] Restarting apache2 (via systemctl): apache2.service.

this is the debug from chat with option debug.

the first screenshot is without change apache2 by default zammad configuration,

the next one is changing to do some test but still nothing…

Hannes · October 29, 2018, 4:50pm

What happens when you click on the error message.

what do you get as an response?

emper0r · October 29, 2018, 5:00pm

Yes I need to change that to continue use zammad by custom port 8083 because I explain before is a virtualhost and the default port 80 is for mediawiki. so when you click there open mediawiki page in the 80 port.

emper0r · October 29, 2018, 5:02pm

but if you add :8083 you can see the css file in the browser.

Hannes · October 29, 2018, 5:13pm

Then please change this to match it. This is def. not an Zammad Chat issue. It is an issue with your setup.
I would bet, if you create a test instance on zammad.com and use this one, it will work right out of the box.

regards

emper0r · October 29, 2018, 5:17pm

I don’t create a test zammad suite… i install a zammad to use as ticket system, the problem is zammad need to be add as a feature if someone can use virtualdomain using custom ports, because right now I’m using 80 for mediawiki, and other ports web using docker. anyway i understand… just keep in mind that as a feature to use as custom port. i try to fix this. thanks any way for all

Hannes · October 29, 2018, 6:11pm

Hi @emper0r,

OK, ich created an Zammad on Debian 9.5 and can use Zammad on multiple ports. But there is actually an issue with the logic in chat.js which detects the port automatically.

Normally this is no issue, because you use multiple domains / subdomains and no ports in a real world scenario. But I will address this issue to the devs.

I created my test site here:
http://139.59.147.81 (NGINX)
http://139.59.147.81:8081 (APACHE)
http://139.59.147.81:8082/chat.html (Apache+modified chat.js)

I’ll get back to you.