Question

如何在React-Native中的应用程序与Asp.Net Core中的服务器之间建立WebSockets连接？

React-Native中当前的SignalR不适用于Net Core版本。

是否有必要在两边使用干净的WebSocket？

Answer 1

已发布的react-native-signalr库实际上不适用于Net Core。

但是解决方案在JavaScript客户端@aspnet/signalr版本1.0.3中。

在服务器上，我们还安装了SignalR版的1.0.3

双方必须兼容。

在移动应用程序一侧的使用示例：

import React, {
    Component
} from 'react'
import {
    View
    , StyleSheet
    , Text
    , Button
} from 'react-native'

import * as signalR from '@aspnet/signalr';

export default class Settings extends Component {
    constructor(props) {
        super(props);

        this.state = {
            message: 'No messages.'
        };

        this.messageReceived = this.messageReceived.bind(this);

        const hubUrl = 'http://10.0.2.2:62954/chat';

        const connectionHub = new signalR.HubConnectionBuilder()
            .withUrl(hubUrl)
            .configureLogging(signalR.LogLevel.Information)
            .build();

        connectionHub.on('ReceiveMessage', this.messageReceived);
        connectionHub.start()
            .catch(err => this.logError(err));

        this.connection = connectionHub;
    }

    messageReceived(message) {
        this.setState({
            message
        });
    }

    sendTestMessage() {
        this.connection.invoke('SendMessage', 'NameUser', 'Test message from mobile app.')
            .catch(err => this.logError(err));
    }

    render() {
        return (
            <View style={styles.container}>
            <View>
                <Text>{this.state.message}</Text>
            </View>
            <View>
                <Button title={"send"} onPress={this.sendTestMessage.bind(this)}>
                </Button>
            </View>
        </View>
        )
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1
        , backgroundColor: '#0a3c63'
    , }
, });

SignalR文档建议的服务器站点

Websocket连接

1 个答案: