精华内容
下载资源
问答
  • 主要介绍了微信小程序 聊天室简单实现的相关资料,需要的朋友可以参考下
  • 主要介绍了微信小程序聊天功能的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • NLP微信小程序聊天机器人

    千次阅读 2021-01-09 21:52:06
    一个NLP微信小程序聊天机器人,前端就一个页面,后端是php的,可以接图灵等等各种api,也可以自己写个python的接口做NLP算法测试,算是给一个微信小程序的前端展示吧 直接上效果: 后端php就一个文件,可以自定义...

    今天把两年前大二时候的小程序又拿来玩了一下,决定开源这个小项目

    一个NLP微信小程序聊天机器人,前端就一个页面,后端是php的,可以接图灵等等各种api,也可以自己写个python的接口做NLP算法测试,算是给一个微信小程序的前端展示吧

    直接上效果:
    在这里插入图片描述

    后端php就一个文件,可以自定义回答,也可以接图灵机器人的api
    在这里插入图片描述

    在这里插入图片描述
    同时前端小程序支持如果聊天很多行的话,每说一句话自动弹到最新的聊天对话行,交互上做了简单的js逻辑

    目前只有文本,但是保留了图片、视频的代码注释,方便二开

    接了图灵之后的效果:
    在这里插入图片描述
    还可以查菜谱,查股票,查航班火车,查快递,想怎么开发就怎么开发

    附上两个小程序二维码吧,第二个可能过两天要干别的用了,第一个将会一直保留维护

    在这里插入图片描述
    在这里插入图片描述
    微信小程序后端php代码:

    <?php  
    $params = $_REQUEST;  
    $msg = $params['msg'];  
    $content = array();  
    switch ($msg) {  
        case '你是谁':  
        case '你叫什么':  
            $content['msgType'] = 'text';  
            $content['content'] = '我叫father,我是你爸爸';  
            break;  
        
    	case '今年多大了':  
        case '几岁了':  
            $content['msgType'] = 'text';  
            $content['content'] = '我就是我,没有年纪的花火';
            break;   		
        default:  
    	$apiKey = "xxxxxxxx"; //图灵机器人官网申请的api
    $apiURL = "http://www.tuling123.com/openapi/api?key=KEY&info=INFO"; 
    // 设置报文头, 构建请求报文 
    header("Content-type: text/html; charset=utf-8"); 
    $reqInfo = $msg; 
    $url = str_replace("INFO", $reqInfo, str_replace("KEY", $apiKey, $apiURL)); 
    
    /** 方法一、用file_get_contents 以get方式获取内容 */
    $res =file_get_contents($url); 
    //$res== array();  
    //$a= array_values($res);
    //echo $res;
    //echo $a[1];
    //echo json_encode($res); 
    
    $cc= explode('"',$res);
    
    //echo json_encode$cc[5];
    
    

    微信小程序源码地址 前端+后端
    https://download.csdn.net/download/weixin_41606022/19404851
    不定期分享微信小程序开发的相关内容

    展开全文
  • thinkphp5.1与workerman 开发微信小程序聊天室,支持用户之间语音,图片,文字的交互。
  • 本文主要介绍基于公司的一个微信小程序项目socket聊天系统的搭建,前后端代码,服务器配置均由一个人完成,难度不大;本文目录:1、搭建HTTPS和wss环境;2、定义前后端通信json协议;3 ...       本文主要介绍...
  • 微信小程序源码,前端源码,简单展示源码,原生小程序源码 非uniapp,仅供参考,如有涉及版权问题请联系作者。微信小程序源码,前端源码,简单展示源码,原生小程序源码 非uniapp,仅供参考,如有涉及版权问题请联系...
  • 自己写了个微信小程序聊天室,开发工具+本地eclipse调试已经ok。现在打算部署到互联网,有这方面操作经验的说一下,不用自己再去看文档,或者百度流程了。谢谢~
  • 微信小程序聊天demo

    千次阅读 2018-12-11 11:18:43
    本身经历历时1个月,完成 微信小程序前后端聊天Demo,前端(微信小程序)后端(java),服务器【linux(nginx)】,涵盖功能,微信授权认证首页,主页面,不同聊天的房间以及分类,个人信息页面,包含真实手机号认证...

    本身经历历时1个月,完成 微信小程序前后端聊天Demo,前端(微信小程序)后端(java),服务器【linux(nginx】,涵盖功能,微信授权认证首页,主页面,不同聊天的房间以及分类,个人信息页面,包含真实手机号认证,个人信息展示(UI棒棒滴),修改头像,修改个人姓名,聊天室包含,聊天底部组件,包含发送图片及预览。后台实现包含,房间群聊,并且里面涵盖图灵机器人,因时间原因,单聊也有相应代码已被注释,放开即可应用。本demo为本人想上线运行程序,奈何因为个人原因无法实现,现转手整套源码.涵盖 小程序,服务端,及教学linux服务器配置,及https配置等。另赠送短信包300条左右(接口已经涵盖,可用于测试或真实发送),整套程序价格很低,很低,要的可以看部分设计理念及想法,部分UI图片,或运行视频。诚信QQ:1635415329
    不喜勿喷,本人也挖坑填坑了1个月,弄个辛苦钱
    另外说明java端:springboot+mybatis+mysql+redis,  https配置可选

     

     

     

    展开全文
  • 详细视频请看:https://blog.csdn.net/qq_43764578/article/details/106024022 纯前端,数据缓存至本地,有语音功能等
  • 完整的微信小程序实现 WebSocket 长链接聊天代码,包括聊天室界面的样式。可直接使用,有疑问可加微信13977284413询问。有时间的话我会第一时间回复。
  • 作者:奋斗放个,来自原文地址  //utils文件夹下websoctet.js文件   var url = 'ws://地址端口';   function connect(user, func) {   wx.connectSocket({ url: url, ...wx.onSocketOpen(function (res) { ...
  • 微信小程序聊天系统搭建文档

    千次阅读 2017-04-14 14:38:11
    本文主要介绍基于公司的一个微信小程序项目socket聊天系统的搭建,前后端代码,服务器配置均由一个人完成,难度不大;

    本文主要介绍基于公司的一个微信小程序项目socket聊天系统的搭建,前后端代码,服务器配置均由一个人完成,难度不大;

    本文目录:

    1、搭建HTTPS和wss环境;

    2、定义前后端通信json协议;

    3、聊天系统搭建;

    4、注意事项。

    环境准备

    一、搭建HTTPS和wss环境

    具体搭建过程请查看我的另外一篇文章《微信小程序服务器环境搭建--suse版》,由于wss域名不能带端口,所以建议用Nginx进行代理转发。

    二、定义前后端通信json协议

    其中token用来验证消息来源合法性,fd为当前socket连接资源ID,from为对方socket连接资源ID,cmd定义当前操作。

    三、聊天系统搭建

    1、服务端

    采用TP5和swoole扩展,新建一个socket模块专门处理socket,目录结构如下

    分为服务端server.php和客户端client.php,服务端以cli形式运行,具体代码请参考swoole源码包中的ssl样例;

    运行命令如下(先切换到服务器程序代码的public目录 ):

    php index.php socket/server/index

    客户端其实是一个web端的websocket,源码包中同样有提供样例。请自行查看,此处不贴出源码。

    2、小程序客户端

    简单封装下微信提供的socket接口,用于处理连接成功,发送消息,连接失败自动重连等公用操作,目录结构如下

    发送方法封装参考:

    3、保证cli程序100%可用

    编写shell脚本如下:

    count=`ps -fe |grep "socket/server" | grep -v "grep" | grep "master" | wc -l`

    echo $count

    if [ $count -lt 1 ]; then

    ps -eaf |grep "socket/server" | grep -v "grep"| awk '{print $2}'|xargs kill -9

    sleep 2

    ulimit -c unlimited

    /opt/app/php/bin/php /opt/web/think/public/index.php socket/server/index

    echo "restart";

    echo $(date +%Y-%m-%d_%H:%M:%S) >/opt/script/log/restart.log

    fi

    启用crontab

    crontab -e

    加入一行:

    */1 * * * * /opt/script/check_server.sh #每隔一分钟检测下脚本

    crontab -l

    四、注意事项

    1、如果使用TP5的帮助函数model出现下面的错误,是数据库连接过期导致,把连接过期时间设置长点,但是总有过期的时候,所以建议改用mongodb

    2、微信小程序真机环境不予许指定端口,那上面的服务器配置就没有什么用,解决办法是:停用Apache的ssl模块,改用Nginx作为反向代理,具体方法参考我之前写的文章。亲测可用

    3、如果用Nginx作为反向代理遇到会话很容易过期,有两种办法,一个是设置代理超时时间为一个很长的时间;一个是客户端做个心跳检测.这两种办法会增加服务器内存消耗,但是没有办法只有折中考虑。

    展开全文
  • 微信小程序聊天室功能

    千次阅读 2018-08-08 10:15:10
    小程序项目新增一聊天室功能; 控件是用该博主的https://blog.csdn.net/sinat_27612147/article/details/78456363;感谢博主提供如此方便的源码; 功能需求: 一:WebScoket链接 这个是要创建小程序与后台间的...

    小程序项目新增一聊天室功能;

    控件是用该博主的https://blog.csdn.net/sinat_27612147/article/details/78456363;感谢博主提供如此方便的源码;

    功能需求:

    一:WebScoket链接

    这个是要创建小程序与后台间的连接,比较简单,微信api都有提供;

    https://developers.weixin.qq.com/miniprogram/dev/api/network-socket.html#wxclosesocket

    二、聊天室置底

    本人使用该控件时发现并没有很好的解决聊天置底问题,跟进自己想法改造下;

    1、组件<scroll-view> 设置scroll-top属性  

    这是我一开始的处理方式,在收到消息和发送消息时获取聊天记录列表,然后根据长度动态设置 scroll-top值

    let chatItems = this.data.chatItems;
    this.setData({
        scrollTopVal:chatItems.length*60+60  
    })  //scrollTopVal是<scroll-view/>的scroll-top属性值,*60是我这一个聊天记录大概60
    
    

    如果全是文字聊天这样是可行的,但是一旦出现了图片就不可行了。因为图片聊天高度是超过60的,我也不可能每次都去for聊天记录有多少图片,多少文字。

     

    2、组件<scroll-view scroll-into-view="{{toView}}"> 设置scroll-into-view属性(值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素)

    根据这个属性,我再列表的下方再添加一个<view id="toView"></view>的空标签;然后同理在发送和接受到消息的时候

    this.setData({
        toView:'toView'
    })

    这样我们就可以保证scroll-view可以置底了,美滋滋;

    三、聊天记录历史

    描述:我们在小程序上是不可能保存所有的聊天记录,所以暂时是只保存了50条记录,超过50条咋办?肯定是通过接口请求后台再渲染到小程序上。原以为很简单,只要根据<scroll-view/>提供的 bindscrolltoupper 属性便可实现,即滚动到顶部时触发scrolltoupper 事件请求接口获取数据,再将新老数据concat拼接。

    问题来了:这样一来,我们就永远是在顶部了,看过往数据只能上拉,看完再下拉到顶部加载新的记录;我们要实现的是像微信那样看记录只要一直下拉。

    解决方案:依旧是用scroll-into-view属性,我们拿到聊天记录数据时就给第一天添加一个id,然后出发scrolltoupper事件时获取该id,然后数据拼接完成后通过scroll-into-view回到id位置;(该方案并不优雅,还望各位大神提供更好的解决方案,谢谢

    .js
    console.log('更多历史记录');
    let store = [{type:'text',content:'测试1'},{type:'text',content:'测试2'},{type:'text',content:'测试3'},{type:'text',content:'测试4'},{type:'text',content:'测试5'},{type:'text',content:'测试6'},{type:'text',content:'测试7'},{type:'text',content:'测试8'},{type:'text',content:'测试9'},{type:'text',content:'测试10'},{type:'text',content:'测试11'},{type:'text',content:'测试12'},{type:'text',content:'测试13'}];//测试数据
          let currChatItems = this.data.chatItems;
          store[0].showId = new Date().getTime();//给第一条数据添加id(注:scroll-into-view的值应为某子元素id(id不能以数字开头))
          let id='';
        //列表每个有id我都添加了.prevId这个类,是为了方便我下边找
          wx.createSelectorQuery().selectAll('.prevId').fields({ 
            id:true,
          }, function(res){
            id = res[0].id;
            console.log(res)
          }).exec();
          this.setData({
            chatItems:store.concat(currChatItems),
          },()=>{
            this.setData({ 
              toView:id,
              loading:true
            })
          })
        }
    
    .wxml
    <template name="chat-item">
        <view id="{{item.showId?'view'+item.showId:''}}" class="{{item.showId?'prevId':''}}">
            <block wx:if="{{item.type!=='custom'}}">
                <template is="chat-time" data="{{showTime:item.showTime,time:item.time}}"/>
                <template is="chat-word"
                          data="{{length:length,index:index,headUrl:item.headUrl,isMy:item.isMy,showTime:item.showTime,time:item.time,content:item.content,type:item.type,sendStatus:item.sendStatus}}"/>
            </block>
            <block wx:else>
                <template is="chat-custom" data="{{content:item.content}}"/>
            </block>
        </view>
    </template>

     

    展开全文
  • 微信小程序聊天 表情

    2019-11-26 21:08:17
    1.emoji表情是文本,不是图片,可以直接复制粘贴,当字符串处理 ...2.在微信小程序中实现这样的效果 这里只贴出表情部分的实现, <scroll-view class="emojis_scroll" scroll-x="{{false}}" scroll-y="{{true}}...
  • 微信小程序 聊天

    千次阅读 2017-04-15 22:12:47
    //下面方法很好玩,因为使用的服务器 是开源的php服务器,所以微信小程序接收到的聊天室中文内容是 ASCII编码,所以经过此方法可以转换。哈  encodeStr: function (str) {  var character = str.split("\\u");...
  • 微信小程序开发交流qq群 173683895 承接微信小程序开发。扫码加微信。 小程序WebSocket 常见问题:(本文已解决的) 1.自动断开链接,重连但是只能存在两个WebSocket 的问题。 ---1兼容情况:1.1 正常聊天过一...
  • 我想用signalR开发微信小程序聊天功能 小程序有websocket API,我想大致流程应该是小程序端用websocket连接服务器端的signalR,但是具体的流程我又不清楚,因为我其他的功能都是http访问,使用wx.request这样的...
  • 微信小程序聊天

    2021-03-08 15:55:37
    最近在学习微信小程序,想做一个类似于淘宝客服那样的聊天室,希望大神们能帮帮忙
  • 微信小程序开发交流qq群 173683895 承接微信小程序开发。扫码加微信。 正文: 122 <!-- <button bindtap='close'>关闭</button> <button bindtap='open'>打开</button> --> &...
  • 微信小程序开发交流qq群 173683895 承接微信小程序开发。扫码加微信。 接入流程: 初次接触网易云通信IM服务,您可以通过以下产品介绍文档了解我们的产品功能、相关概念、业务限制: 产品简介 主要功能 帐号...
  • 云开发微信小程序聊天

    千次阅读 2020-02-23 00:20:55
    微信小程序聊天功能 WebSocket 实现发送文字,图片,语音以及WebSocket 常见问题解决方案 6.[微信小程序]聊天对话(文本,图片)的功能(完整代码附效果图) 如果有个性化的需要修改,可以联系我的微信。 先看一下效果图...
  • 微信小程序聊天室(云开发)

    千次阅读 2020-02-19 18:42:55
    在写聊天是之前我们可以先看一需要建四个云数据表,user(用户列表),qunList (群列表),qunUserList(群用户列表),news(消息列表)接下来就是页面布局,这个布局看个人其需求我这里就讲讲大概逻辑,数据的增删...
  • 聊天室前后台源码 前端源码博文地址:https://blog.csdn.net/oPiZuoPi/article/details/82050876
  • 聊天室需要发送表情怎么实现,其实非常简单,只需要这样 let emoji =['????','????','????','????','????','????','????','????','????','????','????','????','????','????','????','????','????','????','????','?...
  • 效果图如下所示 这两天比较闲就写了个聊天功能,语音功能因为是在电脑上所以不能使用,图片最大只能上传5M所有很多功能没有完全展示,想看完整手机版的视频可以加 QQ:1010753897 查看完整视频 下载地址:...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 24,294
精华内容 9,717
关键字:

微信小程序聊天

微信小程序 订阅