更新记录

v1.0.0（2023-01-06）

初始版本更新

平台兼容性

原生插件通用使用流程：

1. 购买插件，选择该插件绑定的项目。
2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

使用说明

该插件为原生的socket.io客户端工具，当前版本为v2版本，socket.io服务端对应版本请使用3x、4x

IOS端正在开发着

具体使用方法

基本用法与jssdk的方法端一致

Api说明

具体案例

<template>
    <view class="s-page">
        <!-- 服务连接部分 -->
        <view class="s-content-view">
            <view class="s-label-view">
                <text>服务连接</text>
            </view>
            <input type="text" class="server-input" 
                v-model="serverUrl" placeholder="请输入服务器地址"/>
            <input type="text" class="server-input" 
                v-model="queryParams" placeholder="query参数"/>
            <view class="s-button-view">
                <button class="s-button" type="primary" @click="connectBtn">开始连接</button>
                <button class="s-button" style="margin-left: 26upx;" 
                    type="primary" @click="disconnectBtn">断开连接</button>
            </view>
        </view>
        <!-- 模拟发送消息 -->
        <view class="s-content-view">
            <view class="s-label-view">
                <text>发送消息</text>
            </view>
            <input type="text" class="server-input"
                v-model="msgContent" placeholder="消息内容"/>
            <view class="s-button-view">
                <button class="s-button" type="primary" @click="sendMsg">发送数据</button>
            </view>
        </view>

    </view>
</template>

<script>
    // 导入组件
    const JSocket = uni.requireNativePlugin('J-SocketIOV2')

    export default {
        data() {
            return {
                serverUrl: 'http://192.168.0.88:5000',
                queryParams: 'token=123',
                msgContent: '测试消息'
            }
        },
        onLoad() {

        },
        methods: {
            /**
             * 连接socket服务
             */
            connectBtn() {
                this.listenerCreate()
                // 开启连接
                JSocket.connect(this.serverUrl, {
                    query: this.queryParams,
                    transports: ['websocket'],
                    forceNew: true,
                    // jsonData: true               // 如果为true，将可以直接发送json数据以及收到消息时如果是json格式则自动解析为json对象
                })
            },
            /**
             * 监听事件需要在连接之前执行
             * */
            listenerCreate() {
                // 监听连接成功后事件
                JSocket.on('connect', res => {
                    uni.showModal({
                        title: '温馨提示',
                        content: '连接成功，' + JSON.stringify(res) 
                    })
                })
                // 连接错误
                JSocket.on('connect_error', data => {
                    uni.showModal({
                        title: '温馨提示',
                        content: '连接错误，' + JSON.stringify(data) 
                    })
                })
                // 错误
                JSocket.on('error', data => {
                    uni.showModal({
                        title: '温馨提示',
                        content: '连接错误error，' + JSON.stringify(data) 
                    })
                })

                // 断开连接
                JSocket.on('disconnect', data => {
                    uni.showModal({
                        title: '温馨提示',
                        content: '断开连接，' + JSON.stringify(data) 
                    })
                })

                // 收到消息
                JSocket.on('txtMsg', data => {
                    uni.showModal({
                        title: '温馨提示',
                        content: '收到消息，' + JSON.stringify(data) 
                    })
                })

            },
            /**
             * 发送数据
             */
            sendMsg() {
                JSocket.emit('txtMsg', this.msgContent, res => {
                    // res.flag 为true，代表发送成功
                    // res.msg 成功失败的msg
                    uni.showModal({
                        title: '温馨提示',
                        content: `发送${res.flag?'成功':'失败'}:${res.msg}` 
                    })
                })
            },
            /**
             * 断开socket服务
             */
            disconnectBtn() {
                JSocket.disconnect()
            }
        }
    }
</script>

<style lang="scss">
    page {
        background-color: #f4f4f4;
    }

    .s-content-view {
        padding: 32upx;

        .server-input {
            height: 90upx;
            margin-bottom: 16upx;
            border-bottom: 1upx solid #e1e1e1;
        }
    }

    .s-label-view {
        border-left: solid #007aff 6upx;
        margin-bottom: 16upx;
        text {
            font-size: 30upx;
            color: #888888;
            padding-left: 16upx;
        }
    }

    .s-button-view {
        display: flex;
        padding-top: 16upx;
        .s-button {
            width: 100%;
        }
    }

    .s-button {
        height: 70upx;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 30upx;
    }

</style>

联系作者

QQ：476743842