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

Technical assistance
1

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

02
021582×618 71.9 KB

2

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

3

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

4

My mistake, I meant Zammad.

5

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>

image

image
image801×326 29.2 KB

6

Hi @edneymatias,

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

7

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

16
16802×156 40 KB

23
23716×206 44.5 KB

35
351592×794 106 KB

8

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

9

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.

10

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.

43
431597×736 114 KB

22
221538×764 225 KB

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>
11

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…

12

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

13

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
14

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,

22
221595×738 176 KB

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

40
401594×768 199 KB

15

What happens when you click on the error message.
image
what do you get as an response?

16

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.

17

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

18

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

19

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

20

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.