OvidijusParsiunas / deep-chat

Fully customizable AI chatbot component for your website
https://deepchat.dev
MIT License
1.27k stars 176 forks source link

Custom url #50

Closed linqingfan closed 7 months ago

linqingfan commented 7 months ago

I just started looking at deep.dev and I m looking at the following example:

<!-- This example demonstrates how to set values via attributes and properties (recommended) -->
<!-- !!Please note that upon loading/saving this sandbox - the property values applied will not be applied without a RESTART!! -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="./src/styles.css" />
  </head>
  <script
    type="module"
    src="https://unpkg.com/deep-chat@1.4.3/dist/deepChat.bundle.js"
  ></script>
  <body>
    <h1>Deep Chat</h1>
    <!-- Attributes can be set as strings either directly on the element (demo/textInput) or via a `setAttribute` method on its reference (introMessage).
      When passing JSON objects make sure that they are first correctly stringified (use the following tool https://jsonlint.com/), functions assigned
      to properties must not have external references and all regex values are properly escaped.
      You can also pass values into the component via properties by using the element reference (initialMessages).
      -->
    <deep-chat
      id="chat-element"
      demo="true"
      textInput='{"placeholder":{"text": "Welcome to the demo!"}}'
    ></deep-chat>
  </body>
  <!-- !!Either set the script as "module" or place your code in a timeout in order to wait for the component to load -->
  <script type="module">
    const elementRef = document.getElementById("chat-element");
    // Setting value via a property (easiest way)
    elementRef.initialMessages = [
      { role: "user", text: "Hey, how are you today?" },
      { role: "ai", text: "I am doing very well!" }
    ];
    elementRef.setAttribute(
      "introMessage",
      JSON.stringify({
        text: "JavaScript demo for the Deep Chat component."
      })
    );
  </script>
</html>

Assuming i have set the request url, but how do I get the response message from URL request?

OvidijusParsiunas commented 7 months ago

Hey @linqingfan. Hope your issue got resolved. For reference, I recommend looking at the connect part of the documentation for more information.

linqingfan commented 7 months ago

I have managed to make flask openai example to work but I don't know why there is always error after some medsag5 have been streamed. Also the streamed text seems to repeat itself...

OvidijusParsiunas commented 7 months ago

The double stream behaviour does seem to be a bug, let me see what I can do to fix it.

In regards to the error you are referencing, I don't seem to be getting it on my end. Could you let me know what setup code you are using for Deep Chat and what the error is to help me get a better idea about it. Also, I am using the example UI project to connect to the example server right out of the box, it might be worth to check it out.

OvidijusParsiunas commented 7 months ago

Never mind, I now started to get the error too. I'll look into this now.

OvidijusParsiunas commented 7 months ago

Ok, it appears that OpenAI's streaming functionality can now sometimes return an incomplete JSON at the start or at the end which is what was causing the errors to be thrown. On the other hand it is now returning multiple choices per chunk which was causing the same message being returned multiple times as the strategy to aggregate text had to be changed.

For Python specifically - I had to also increase thechunk_size to 2048 as longer messages weren't fully read. You can raise this value to higher if you have longer messages.

Please check out the new code in this file.

Thanks!

linqingfan commented 7 months ago

Hi, after using the new file, it works without repetition and no error. Thanks