Rasa webchat widget issue

Hi everyone,

I’m using Rasa-x v0.37 and Rasa v2.3.1 with docker compose. I installed it from Docker Compose Installation. I didnt change anything else.

I want to use rasa webchat in my own website. I added to creadentials.yml belowing lines as described Your Own Website.

socketio:
  user_message_evt: user_uttered
  bot_message_evt: bot_uttered
  session_persistence: true

Also i use webchat widget in GitHub - botfront/rasa-webchat: A feature-rich chat widget for Rasa and Botfront.

My html file like this

<body>
<div id="webchat"/>
<script>!(function () {
let e = document.createElement("script"),
    t = document.head || document.getElementsByTagName("head")[0];
(e.src =
    "https://cdn.jsdelivr.net/npm/rasa-webchat@1.0.1/lib/index.js"),
    (e.async = !0),
    (e.onload = () => {
        window.WebChat.default(
            {
                socketUrl: "http://xxx:5005",
                socketPath: "/socket.io",
                title: "Title"
            },
            null
        );
    }),
    t.insertBefore(e, t.firstChild);
})();
</script>
</body>

But it’s not working. And also tried react component but still same issue. I checked network tab in chrome and i saw request with http 200. For example: � ÿ0{"sid":"5de50ac9fe234630befdc06543535cb2","upgrades":["websocket"],"pingTimeout":60000,"pingInterval":25000}

But there is an exception in chrome console: Error: server error at u.onPacket (index.js:116) at e.exports.<anonymous> (index.js:116) at e.exports.r.emit (index.js:1) at e.exports.onPacket (index.js:12) at index.js:17 at Array.forEach (<anonymous>) at e.exports.onData (index.js:17) at f.<anonymous> (index.js:116) at f.r.emit (index.js:1) at f.onData (index.js:116)

I throws from case ‘error’ from onPacket method. input e.type=error, e.data= ‘parser error’

How can i fix this problem.

Thanks.

Can you try again using Rasa v2.5.0 or greater?

Ok i will try version upgrade. Before upgrading rasa-x and rasa version i wanted to backup my old files. When i try export stories in Rasa X UI, there is an error like belowing.

rasa-x_1           | [2021-05-05 07:09:57 +0000] [32] [ERROR] Exception occurred while handling uri: 'http://xxx/api/stories'
rasa-x_1           | Traceback (most recent call last):
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/sanic/app.py", line 973, in handle_request
rasa-x_1           |     response = await response
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/api/decorators.py", line 216, in decorated_function
rasa-x_1           |     return await await_and_return_response(args, kwargs, request)
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/api/decorators.py", line 146, in await_and_return_response
rasa-x_1           |     response = await response
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/api/blueprints/core/stories.py", line 124, in get_stories
rasa-x_1           |     yaml_content = StoryService.from_request(request).get_stories_as_string(
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/services/story_service.py", line 287, in get_stories_as_string
rasa-x_1           |     return self._get_stories_as_yaml_string(project_id, stories)
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/services/story_service.py", line 252, in _get_stories_as_yaml_string
rasa-x_1           |     is_test_story = any([story["is_test"] for story in stories])
rasa-x_1           |   File "/usr/local/lib/python3.8/dist-packages/rasax/community/services/story_service.py", line 252, in <listcomp>
rasa-x_1           |     is_test_story = any([story["is_test"] for story in stories])
rasa-x_1           | TypeError: list indices must be integers or slices, not str

How can i export my stories? Thanks.

Ahha! You also need to upgrade Rasa X to 0.39

I upgraded versions;

RASA_X_VERSION=0.39.2
RASA_VERSION=2.5.1
RASA_X_DEMO_VERSION=0.38.0

Stories exception is fine now, thanks. But socket has another exception like;

        Access to XMLHttpRequest at 'http://xxx:5005/socket.io/?EIO=4&transport=polling&t=NayJmd6' from origin 'http://localhost:8012' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
    index.js:116 GET http://xxx:5005/socket.io/?EIO=4&transport=polling&t=NayJmd6 net::ERR_FAILED
    create @ index.js:116
    f @ index.js:116
    request @ index.js:116
    doPoll @ index.js:116
    poll @ index.js:17
...

but my docker compose file has CORS config;

x-rasa-services: &default-rasa-service
  restart: always
  image: "rasa/rasa:${RASA_VERSION}-full"
  volumes:
      - ./.config:/.config
  expose:
    - "5005"
  command: >
    x
    --no-prompt
    --production
    --config-endpoint http://rasa-x:5002/api/config?token=${RASA_X_TOKEN}
    --port 5005
    --jwt-method HS256
    --jwt-secret ${JWT_SECRET}
    --auth-token '${RASA_TOKEN}'
    --cors "*"
  depends_on:
    - rasa-x
    - rabbit
    - redis

Thanks

Hi @kaplan441,
I just stumbled onto this post. Did you solve your CORS policy issue?
Just in case someone has the same issue and is looking for a solution: I had the same and fixed it by adding a header in my website’s .htaccess file:

<ifModule mod_headers.c>
Header set Access-Control-Allow-Origin: *
</ifModule>