{"id":4749,"url":"https://github.com/olofd/react-native-signalr","last_synced_at":"2025-04-06T01:09:41.846Z","repository":{"id":51817736,"uuid":"44567124","full_name":"olofd/react-native-signalr","owner":"olofd","description":"Use SignalR with React Native","archived":false,"fork":false,"pushed_at":"2020-10-08T11:52:10.000Z","size":231,"stargazers_count":150,"open_issues_count":32,"forks_count":62,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-03-30T00:09:28.589Z","etag":null,"topics":["react-native","signalr","websockets"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/olofd.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-10-19T22:11:54.000Z","updated_at":"2025-03-14T07:20:56.000Z","dependencies_parsed_at":"2022-08-22T23:30:48.946Z","dependency_job_id":null,"html_url":"https://github.com/olofd/react-native-signalr","commit_stats":null,"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olofd%2Freact-native-signalr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olofd%2Freact-native-signalr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olofd%2Freact-native-signalr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olofd%2Freact-native-signalr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/olofd","download_url":"https://codeload.github.com/olofd/react-native-signalr/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247419861,"owners_count":20936012,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react-native","signalr","websockets"],"created_at":"2024-01-05T20:17:22.129Z","updated_at":"2025-04-06T01:09:41.806Z","avatar_url":"https://github.com/olofd.png","language":"JavaScript","funding_links":[],"categories":["Components"],"sub_categories":["Integrations"],"readme":"# react-native-signalr\n\nConnect to your SignalR-server with a active websocket-connection from react-native.\nSupports all error-handling and reconnection, including longpolling if needed.\n\nToday the module shims the jQuery-dependency that signalr has.\nThere is however an ongoing task upstream to remove this dependency.\n\n### Does NOT pull in the entire jQuery-library. Only shimes the few methods SignalR needs. Tested on iOS and Android. No known issues.\n\n# Install:\n```\nnpm i react-native-signalr --save\n```\n\n##\nThere is an example server setup at https://react-native-signalr.olofdahlbom.se (Also a http version but you must disable App security transport on iOS for that, read in issues) (no webite, only responds to signalr)\nIf it's up and running, you can use it to debug against.\nYou can find the source for that server under examples/server.\nThe code below uses that server to setup a connection and communicate over websockets using signalr.\n\n# Awesome-project:\n\n~~~js\nimport React, { Component } from 'react';\nimport {\n  AppRegistry,\n  StyleSheet,\n  Text,\n  View,\n} from 'react-native';\nimport signalr from 'react-native-signalr';\n\nclass AwesomeProject extends Component {\n\n  componentDidMount() {\n    //This is the server under /example/server published on azure.\n    const connection = signalr.hubConnection('https://react-native-signalr.olofdahlbom.se');\n    connection.logging = true;\n\n    const proxy = connection.createHubProxy('chatHub');\n    //receives broadcast messages from a hub function, called \"helloApp\"\n    proxy.on('helloApp', (argOne, argTwo, argThree, argFour) =\u003e {\n      console.log('message-from-server', argOne, argTwo, argThree, argFour);\n      //Here I could response by calling something else on the server...\n    });\n\n    // atempt connection, and handle errors\n    connection.start().done(() =\u003e {\n      console.log('Now connected, connection ID=' + connection.id);\n\n      proxy.invoke('helloServer', 'Hello Server, how are you?')\n        .done((directResponse) =\u003e {\n          console.log('direct-response-from-server', directResponse);\n        }).fail(() =\u003e {\n          console.warn('Something went wrong when calling server, it might not be up and running?')\n        });\n\n    }).fail(() =\u003e {\n      console.log('Failed');\n    });\n\n    //connection-handling\n    connection.connectionSlow(() =\u003e {\n      console.log('We are currently experiencing difficulties with the connection.')\n    });\n\n    connection.error((error) =\u003e {\n      const errorMessage = error.message;\n      let detailedError = '';\n      if (error.source \u0026\u0026 error.source._response) {\n        detailedError = error.source._response;\n      }\n      if (detailedError === 'An SSL error has occurred and a secure connection to the server cannot be made.') {\n        console.log('When using react-native-signalr on ios with http remember to enable http in App Transport Security https://github.com/olofd/react-native-signalr/issues/14')\n      }\n      console.debug('SignalR error: ' + errorMessage, detailedError)\n    });\n  }\n\n  render() {\n    return (\n      \u003cView style={styles.container}\u003e\n        \u003cText style={styles.welcome}\u003e\n          Welcome to React Native!\n        \u003c/Text\u003e\n        \u003cText style={styles.instructions}\u003e\n          To get started, edit index.ios.js\n        \u003c/Text\u003e\n        \u003cText style={styles.instructions}\u003e\n          Press Cmd+R to reload,{'\\n'}\n          Cmd+D or shake for dev menu\n        \u003c/Text\u003e\n      \u003c/View\u003e\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    justifyContent: 'center',\n    alignItems: 'center',\n    backgroundColor: '#F5FCFF',\n  },\n  welcome: {\n    fontSize: 20,\n    textAlign: 'center',\n    margin: 10,\n  },\n  instructions: {\n    textAlign: 'center',\n    color: '#333333',\n    marginBottom: 5,\n  },\n});\n\nAppRegistry.registerComponent('AwesomeProject', () =\u003e AwesomeProject);\n~~~\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Folofd%2Freact-native-signalr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Folofd%2Freact-native-signalr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Folofd%2Freact-native-signalr/lists"}