首页 > 其他分享 >纯前端仿GPT流式打字效果的js库,类似通义千问或者其他AI界面的打字效果

纯前端仿GPT流式打字效果的js库,类似通义千问或者其他AI界面的打字效果

时间:2023-04-13 16:48:30浏览次数:38  
标签:效果 AI 打字 流式 js GPT

因为GPT以及国内各大模型的发布,很多官网都设计的是,仿造流式打字效果,下面这个js库就能轻松实现。

typed.js  

具体实现代码参考下面:

<span  id="subTitle"></span>
<script src="https://unpkg.com/[email protected]/dist/typed.umd.js"></script>
<script>
    var typed = new Typed('#subTitle', {
        strings: ['我是知识库机器人,一个专门响应人类指令的大模型','我服务于人类,致力于让生活更美好','自建私有数据知识库 · 与知识库AI聊天'],
        cursorChar: '_',
        loop: true,
        typeSpeed: 120,
        backDelay: 3000,
    });
</script>

 

实现的效果可以看我的官网 gofly.v1kf.com 

我这里开发客服系统,所以毕竟契合这个打字效果,就给加上了

 

标签:效果,AI,打字,流式,js,GPT
From: https://www.cnblogs.com/taoshihan/p/17315323.html

相关文章

  • Java常用实体类介绍:POJO、Domain、DO、DTO、VO
    POJOPOJO是PlainOldJavaObject的简称,它指的是一个没有限制或要求下的纯平对象。POJO用于表示没有任何框架或技术限制的纯数据对象。在Java开发中,POJO通常用于简化复杂对象和降低对象的耦合度,是面向对象编程中"高内聚、低耦合"设计思想的体现。示例代码:@Datapublic......
  • ChatGPT安全:OpenAI的漏洞赏金计划提供高达2万美元的奖金
    广受欢迎的ChatGPTAI聊天机器人背后的公司OpenAI推出了一项漏洞赏金计划,以确保其系统“安全可靠”。为此,该公司与众包安全平台Bugcrowd合作,让独立研究人员报告其产品中发现的漏洞,以换取“低严重程度发现200美元,特殊发现最高2万美元”的奖励。值得注意的是,该程序不包括模型安全或幻......
  • C# Json序列化,设置驼峰命名(字段首字母小写)
    相关代码:varserializerSettings=newJsonSerializerSettings{//设置为驼峰命名ContractResolver=newCamelCasePropertyNamesContractResolver()};varresult=JsonConvert.Ser......
  • No qualifying bean of type ‘org.springframework.transaction.PlatformTransaction
    今天在ssm项目中遇到一个问题Noqualifyingbeanoftype'org.springframework.transaction.PlatformTransactionManager'available:expectedsinglematchingbeanbutfound2:这个问题产生的原因在于项目中配置了多个数据源,而代码中启用了事务@Transactional注解,导致事......
  • 在js中==与===的区别
    在js中两个=与三个=的区别在js中经常会有这种写法1=="1"实际上二者是不同的,但这种放在js中得到的结果是true,为什么会这样呢,是因为在对比之前,js将"1"转换为了number类型,所以得到的结果是true。而下面代码得到的结果为false1==="1"之所以会出现false,是因为比较之前没有转......
  • Chain of Thought(思维链)
    "思维链"(ChainofThought)是指一系列有逻辑关系的思考步骤或想法,这些步骤或想法相互连接,形成了一个完整的思考过程。它是指导我们思考和解决问题的一种方法,可以帮助我们更好地理解问题、分析问题和解决问题。一个有效的思维链应该具有以下特点:逻辑性:思维链中的每个思考步骤都应......
  • jsencrypt与sm-crypto对url加解密处理
    1.jsencrypt公钥私钥随便找个网站生成(https://www.bejson.com/enc/rsa/)1.安装包:npmijsencrypt--save2.封装函数import{JSEncrypt}from'jsencrypt';//加密msg为需要加密的字符串,返回加密后的字符串exportfunctionsetEncrypt(msg){constjsencrypt=newJS......
  • JAVA返回前端时候bean转json时首字母、第二个字母大写会自动变成小写的问题
      后台bean是privateStringuName;但是前端生成的json是uname会自动变成小写 如果我们只是个别的几个的话,只需要加个注解@JsonProperty("uName")privateStringuName; 这样就可以了......
  • kubernetes persistentVolumeClaim保留机制
    1.默认StatefulSet删除以后,对应的pvc默认是会保存的。2.控制  在1.23以后,有可选 .spec.persistentVolumeClaimRetentionPolicy 字段控制在StatefulSet的生命周期中是否保留或者删除PVC。  您必须启用StatefulSetAutoDeletePVCfeaturegate才能使用此字段。启用......
  • 手机直播源码,JS实现页面下拉加载数据操作
    手机直播源码,JS实现页面下拉加载数据操作主要是在id="ph"的div内加载数据: <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml&qu......