Code Monkey home page Code Monkey logo

react-native-nearby-api's Introduction

react-native-nearby-api npm version

Getting started

$ yarn add @adrianso/react-native-nearby-api or $ npm install @adrianso/react-native-nearby-api --save

Installation

This package supports Autolinking for React Native 0.60 and above.

iOS

  • cd ios/
    pod install
    
  • Build and run project

Android

There are no additional steps required for Android

Usage

See the example app for more detail and code examples.

  • Retrieve your API Keys from the Google Console iOS | Android

  • Add the correct permissions to the AndroidManifest.

    <!-- Include if wish to use BLE -->
    <uses-permission android:name="android.permission.BLUETOOTH"/>
    <uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
    <!-- Include if wish to use audio -->
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
  • Add the Android API Key in the AndroidManifest .

    <meta-data
      android:name="com.google.android.nearby.messages.API_KEY"
      android:value="MY_API_KEY" />
  • The iOS API key will be supplied through the connect() method.

  • Add NSBluetoothPeripheralUsageDescription to the Info.plist

  • Add NSMicrophoneUsageDescription to the iOS project's Info.plist if using audio

import NearbyApi from 'react-native-nearby-api';

const nearbyAPI = new NearbyAPI(true); // Use BLE only, no audio.
nearbyAPI.onConnected(message => {
  console.log(message);
});
nearbyAPI.onDisconnected(message => {
  console.log(message);
});
nearbyAPI.onFound(message => {
  console.log('Message Found!');
  console.log(message);
});
nearbyAPI.onLost(message => {
  console.log('Message Lost!');
  console.log(message);
});
// Android Only
nearbyAPI.onDistanceChanged((message, value) => {
  console.log('Distance Changed!');
  console.log(message, value);
});
// Android Only
nearbyAPI.onBLESignalChanged((message, value) => {
  console.log('BLE Signal Changed!');
  console.log(message, value);
});
nearbyAPI.onPublishSuccess(message => {
  console.log(message);
});
nearbyAPI.onPublishFailed(message => {
  console.log(message);
});
nearbyAPI.onSubscribeSuccess(() => {});
nearbyAPI.onSubscribeFailed(() => {});

// To connect from Google API Client
nearbyAPI.connect(API_KEY);

// To check if the nearby API is connected.
nearbyAPI.isConnected((connected, error) => {
  console.log(connected);
});

// To disconnect later
nearbyAPI.disconnect();

// To publish to nearby devices
nearbyAPI.publish('Hello World!');

// To check if the nearby API is publishing.
nearbyAPI.isPublishing((publishing, error) => {
  console.log(publishing);
});

// To subscribe to nearby devices broadcasting
nearbyAPI.subscribe();

// To check if the nearby API is subscribing.
nearbyAPI.isSubscribing((subscribing, error) => {
  console.log(subscribing);
});

// To unpublish
nearbyAPI.unpublish();

// To unsubscribe
nearbyAPI.unsubscribe();

Running the Example

  • Install the dependencies in the root folder

    yarn

Generate an API Key from the Google Developer Console

  1. Go to the Google Developers Console.
  2. Create or select a project to register your application with.
  3. Click Continue to Enable the API.
  4. On the Credentials page, create a new API Key. (No key restrictions are needed for this example)
  5. Copy/Paste your key in example/index.js and in the example AndroidManifest.xml

Android

  • To run the example app, the packager must have the projectRoots reordered for the example/ directory. In another terminal window:

yarn start --projectRoots <FULL-PATH-TO-REPO>/react-native-nearby-api/example,<FULL-PATH-TO-REPO>/react-native-nearby-api

yarn run:android

adb reverse tcp:8081 tcp:8081

iOS

  • cd example ios/
  • bundle exec pod install
  • Open example.xcworkspace
  • Add your IP to AppDelegate.m
  jsCodeLocation = [NSURL URLWithString:@"http://<IP-ADDRESS>:8081/index.bundle?platform=ios&dev=true"];
  • In another terminal window: yarn start

  • Run on device

    NOTE: If you receive a duplicate symbols for architecture error through Xcode, this is a known issue. A work around is to run ./renameLogger.sh after node_modules have been installed and you've attempted to run in Xcode.

react-native-nearby-api's People

Contributors

jacks205 avatar adrianso avatar owlvark avatar 0x0ece avatar

Stargazers

Marc Rousavy avatar

Watchers

James Cloos avatar

Forkers

mrousavy

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.