泡泡IM本地调试

大家好，欢迎来到IT知识分享网。

泡泡IM本地调试教程

介绍

泡泡IM是一套完整的h5+vue+php的即时通讯聊天源码 ，泡泡IM包含完整的前端、后端、数据库、文档。项目完全独立，不依赖第三方即时通讯云，可直接部署使用。泡泡IM即时聊天源码可用huilder等软件打包成app，安卓 IOS都可使用。文档全面，代码精简规范、低耦合、注释全面、接口清晰，非常有利于二次开发。此h5即时通讯聊天源码对外销售。

技术特点：
界面类似微信界面。后端即时通讯基于高性能即时通讯框架workerman开发，api接口则基于tp5开发。 前端基于vue开发，前后端分离，模块化开发。以websocket协议完成即时通讯，保证消息数据即时传输。自带网络检测，断网自动重连，保证消息可靠送达。支持SSL/TLS通信隧道加密。即时通讯部分与业务逻辑高度解偶。

本地环境搭建

由于后端代码是通过php编写的，所以本地调试需要安装php环境。对于没有php开发经验的同学安装调试可能会费时费力，因此我们可以借助工具如PhPStudy（小皮面板），在程序安装时会内置安装php、mysql、nginx等。

下载地址：https://www.xp.cn/download.html

​ 安装成功后界面

nginx配置

1. 在首页-套件中启动nginx
2. 进入网站，选择创建网站
3. 在基本信息中填写域名、端口等，根目录配置泡泡IM代码\popim-web-source\pop-web\public目录
4. 高级配置中配置网站首页，如h5页面为index.php h5.html，web页面为index.php web.html
5. 在伪静态中添加以下配置

location /im/h5 { 
    try_files $uri $uri/ /h5.html?$args; } location /im/web { 
    try_files $uri $uri/ /web.html?$args; } location /ws { 
    proxy_pass http://127.0.0.1:6060; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "Upgrade"; proxy_set_header X-Real-IP $remote_addr; } location / { 
    if (!-e $request_filename) { 
    rewrite ^/index.php(.*)$ /index.php?s=$1 last; rewrite ^(.*)$ /index.php?s=$1 last; break; } } location ~* \.(eot|ttf|woff)$ { 
    add_header Access-Control-Allow-Origin *; } location ~ \/static\/.*\.php { 
    deny all; return 404; } location ~ \/upload\/.*\.php { 
    deny all; return 404; } 

数据库配置

数据库配置分为本地数据库配置和线上数据库配置

本地数据库配置：

1. 点击数据库，选择创建数据库
2. 填写创建本地数据库的表单信息，没有要求任意填写
3. 访问{网站域名}/admin/install，填写数据库配置，本地数据库地址填localhost，数据库端口可在首页-套件-mysql中的配置查看，其他信息填入创建的数据信息即可，覆盖数据库选择覆盖即可
4. 点击下一步后会在pop-web/config目录下生成database.php文件，该文件为对应的数据库配置信息
5. 服务器设置无需修改，保存即可

线上数据库配置

​ 在pop-web/config目录下创建database.php文件，填写数据库配置，按以下模板填写数据库配置保存即可

<?php // +---------------------------------------------------------------------- // | ThinkPHP [ WE CAN DO IT JUST THINK ] // +---------------------------------------------------------------------- // | Copyright (c) 2006~2016 http://thinkphp.cn All rights reserved. // +---------------------------------------------------------------------- // | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 ) // +---------------------------------------------------------------------- // | Author: liu21st <> // +---------------------------------------------------------------------- return [ // 数据库调试模式 'debug' => false, // 是否严格检查字段是否存在 'fields_strict' => false, // 是否自动写入时间戳字段 'auto_timestamp' => false, // 是否需要进行SQL性能分析 'sql_explain' => false, // 数据库类型 'type' => 'mysql', // 服务器地址 'hostname' => 'devmysql01.wiz.top', // 数据库名 'database' => 'wiz_popoim_hz', // 用户名 'username' => 'devuser', // 密码 'password' => 'devuser.COM2019', // 端口 'hostport' => '6033', // 数据库表前缀 'prefix' => '', // 数据库编码默认采用utf8 'charset' => 'utf8mb4', // 数据库连接参数 'params' => [], ]; 

修改pop-socket的数据库配置：

1. 打开pop-socket/config.php
2. 填写相应的数据库配置信息保存

注：在所有配置都修改好后，在首页-套件中重启Nginx

在线调试

1. 启动socket服务：

   ​ 打开pop-socket/chat目录，打开三个命令行窗口，分别执行php start_gateway.php、php start_register.php、php start_businessworker.php命令。

2. 首页-套件中启动Nginx
3. 首页-套件中启动mysql
4. 浏览器访问

​ h5

​ 访问地址：{网站域名}/im/h5

​ html代码：pop-web/public/h5.html

​ js代码：pop-web/public/static/h5/js/h5.js

​ 注：html中引入的为h5.min.js，若js需要调整，引入修改为h5.js，每次修改完代码都需要重启Nginx

​ web

​ 访问地址：{网站域名}/im/web

​ html代码：pop-web/public/web.html

​ js代码：pop-web/public/static/web/js/h5.js

​ 注：html中引入的为web.min.js，若js需要调整，引入修改为web.js，，每次修改完代码都需要重启Nginx