title: React Native - how to create a background service
body: <p>I am looking forward to switch my app to rect-native from native. I have an app which track the user's GPS location even when the application is closed. How can I achieve this in react native.</p>
  
  <p>I had a look into Headless JS and tried with the following and it doesn't work</p>
  
  <p>in Manifest</p>
  
  <pre><code>&lt;application&gt;
  ...
  &lt;service android:name="com.BackgroundService" /&gt;
  ...
  &lt;/application&gt;
  </code></pre>
  
  <p>index.android.js</p>
  
  <pre><code>AppRegistry.registerComponent('geolocation', () =&gt; geolocation);
  AppRegistry.registerHeadlessTask('SomeTaskName', () =&gt; require('./SomeTaskName'));
  </code></pre>
  
  <p>SomeTaskName.js</p>
  
  <pre><code>import SocketIOClient from 'socket.io-client';
  module.exports = async (taskData) =&gt; {
      // do stuff
      var socket = SocketIOClient('http://xxx.xx.xx.xx:4000');
      socket.emit("test");
  }
  </code></pre>
  
  <p>BackgroundService.java</p>
  
  <pre><code>package com;
  
  import android.content.Intent;
  import android.os.Bundle;
  import android.support.annotation.Nullable;
  
  import com.facebook.react.HeadlessJsTaskService;
  import com.facebook.react.bridge.Arguments;
  import com.facebook.react.jstasks.HeadlessJsTaskConfig;
  public class BackgroundService extends HeadlessJsTaskService {
  
    @Override
    protected @Nullable
    HeadlessJsTaskConfig getTaskConfig(Intent intent) {
      Bundle extras = intent.getExtras();
      if (extras != null) {
        return new HeadlessJsTaskConfig(
            "SomeTaskName",
            Arguments.fromBundle(extras),
            5000);
      }
      return null;
    }
  }
  </code></pre>
  
  <p>MainActivity.java</p>
  
  <pre><code>package com.geolocation;
  
  import android.content.Intent;
  import android.os.Bundle;
  import android.os.PersistableBundle;
  import android.support.annotation.Nullable;
  
  import com.BackgroundService;
  import com.facebook.react.ReactActivity;
  
  public class MainActivity extends ReactActivity {
  
      @Override
      public void onCreate(@Nullable Bundle savedInstanceState, @Nullable PersistableBundle persistentState) {
          super.onCreate(savedInstanceState, persistentState);
          Intent service = new Intent(getApplicationContext(), BackgroundService.class);
          this.startService(service);
      }
  
      /**
       * Returns the name of the main component registered from JavaScript.
       * This is used to schedule rendering of the component.
       */
  
      @Override
      protected String getMainComponentName() {
          return "geolocation";
      }
  }
  </code></pre>