Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flutter Port #4

Closed
ArneSaknussemm89 opened this issue Mar 2, 2018 · 42 comments
Closed

Flutter Port #4

ArneSaknussemm89 opened this issue Mar 2, 2018 · 42 comments

Comments

@ArneSaknussemm89
Copy link

ArneSaknussemm89 commented Mar 2, 2018

Is there any plan for a Flutter version of this?

@jumperchen
Copy link
Member

Yes, porting to Flutter version is in our roadmap.

@ArneSaknussemm89
Copy link
Author

Awesome! Glad to hear it :)

Do you guys have a roadmap posted anywhere? (Curious about timeline as I'm tempted on using Flutter for a personal project)

@jumperchen
Copy link
Member

No, we don't have a specific schedule yet at the moment.

@QoLTech
Copy link

QoLTech commented Apr 26, 2018

I would love a pure flutter port. Or even just pointing me in the right direction to being able to be used in flutter.

@ashasandeep
Copy link

Looking forward to this

@ghost
Copy link

ghost commented May 21, 2018

Can't wait for this as well

@irchriscott
Copy link

Still waiting for it...

@CircleCurve
Copy link

Please add support with flutter !! It must be really helpful of developing apps !

@heypoom
Copy link

heypoom commented Jun 18, 2018

This would be super helpful for all of us. Definitely looking forward to the flutter port!

@oujunhao
Copy link

Me too! I'm a highschool student, but I'm willing to learn and maybe help if there's something for me to do!

@CircleCurve
Copy link

and finally i have finished by using plugin.! Export both android and ios socket.io libs to flutter and then call it from dart side !

@QoLTech
Copy link

QoLTech commented Jun 20, 2018

@CircleCurve Can you explain or post your solution to this?

@CircleCurve
Copy link

CircleCurve commented Jun 20, 2018

@QoLTech First i need to say it does not a pure flutter port. I use native plugin and communicate with dart
(such like flutter plugin implementation)

  1. Take a look of android and ios socket.io libraries and import related package into gradle and pod file
    Android socket.io
    IOS socket.io

Let's say your package name is com.example.testplugin
2. open android/app/src/main/java/com/example/testplugin/MainActivity.java

public class MainActivity extends FlutterActivity {
  private static final String CALLBACK_CHANNEL = "com.example.testplugin/callback" ;
  
 private Socket mSocket ;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    GeneratedPluginRegistrant.registerWith(this);

    final MethodChannel channel = new MethodChannel(getFlutterView(), CALLBACK_CHANNEL) ;
    channel.setMethodCallHandler(
            new MethodChannel.MethodCallHandler() {
              @Override
              public void onMethodCall(MethodCall methodCall, MethodChannel.Result result) {
                if (methodCall.method.equals("addCallBack")) {
                  Log.d("DEBUG_MSG" , "go init socket") ;
                  connectSocket(channel);
                  /*
                  Map<String, String> params = new HashMap<String, String>() ;
                  params.put("success" , "wow") ;
                  channel.invokeMethod("onSuccess" , params);*/
                }else{
                  result.notImplemented();
                }
              }
            }
    );

//=========Socket=============
  private void connectSocket(final MethodChannel channel) {
    try {
      mSocket  = IO.socket("http://your_socket_io:8000") ;  //in nodejs you may say that is localhost:3000, 127.0.0.1:3000...etc

      mSocket.on("time_counter", new Emitter.Listener() {
        @Override
        public void call(Object... args) {
            channel.invokeMethod("onSuccess", args[0].toString());
        }
      }) ;
      mSocket.connect() ;
      Log.d("DEBUG_MSG" , "connect success") ;
    }catch (URISyntaxException e) {
      Log.d("DEBUG_MSG" , "connect fail : " + e.toString()) ;
    }
  }
}

Now, you have created a plugin of socket.io in android-side and listen on time counter event (you can write it your own event)

In dart-side, you need to make a listener to listen a call from java!

  1. open lib/main.dart
import 'dart:async' ; 
import 'dart:convert' ; 

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.


  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or press Run > Flutter Hot Reload in IntelliJ). Notice that the
        // counter didn't reset back to zero; the application is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Test plugin"),
        ),
        body: MyHomePage(), 
      ), 
    );
  }
}

class MyHomePage  extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
    static const platformCallback = const MethodChannel("com.example.testplugin/callback") ; 

Future<Null> _callBack() async {
    platformCallback.setMethodCallHandler((MethodCall call) {
      switch(call.method){
        case "onSuccess" : 
          print("onSuccess") ;
          Map<String, dynamic> rtn = JSON.decode(call.arguments);

          String title = rtn["message"][0]["title"].toString() ; 
          String basePrice = rtn["message"][0]["basePrice"].toString() ; 
          String currentPrice = rtn["message"][0]["currentPrice"].toString() ; 
          String perBid = rtn["message"][0]["perBid"].toString() ; 
          String bidder = rtn["message"][0]["bidder"].toString() ; 
          String expireTime = rtn["message"][0]["expireTime"].toString() ; 
          String deal = rtn["message"][0]["deal"].toString() ; 

          print(expireTime) ;            
        //print(call.arguments["message"]) ; 
        break ; 
        case  "onFail" :

          print("onFail") ; 
        break ; 

        case "onCancel" : 

          print("onCancel") ; 
        break ; 
      }
    }); 

    await platformCallback.invokeMethod('addCallBack', {"tag" : "tags"});
  }

Finally, i hope that can help someone!! haha

Reference
Learn how to make platform-specific code
Learn how to make a listener in dart

@boeledi
Copy link

boeledi commented Jun 28, 2018

I would definitely prefer a "normal" flutter package. Therefore I am also waiting for the Flutter version

@marianoarga
Copy link

+1

@dinhha
Copy link

dinhha commented Jul 7, 2018

Can't wait to try this features!!!

@mligeziak
Copy link

Any updates?

@CHOMNANP
Copy link

CHOMNANP commented Aug 3, 2018

I'm still waiting for this as well :D
Any tips?

@iampawan
Copy link

iampawan commented Aug 3, 2018

+1

@aravind-ig
Copy link

Flutter Socket.io
Try this

@ahmadudin
Copy link

@aravind-ig does the package really works? i got infinity resolving dependencies stage when using it.

@marianoarga
Copy link

@ahmadudin yes, I'm currently using it in not production apps

@ahmadudin
Copy link

@marianoarga i don't know why, but everytime i'm using it, my build would always stuck at resolving dependencies with abnormal cpu usage increase. Does it has any dependencies?

@ahmadudin
Copy link

Or did i do it wrong?

@marianoarga
Copy link

It's hard to know, try in another location, maybe you are behind a proxy, try "flutter packages get -v" and take a look at the output

@ahmadudin
Copy link

ahmadudin commented Sep 4, 2018

@marianoarga I just try to use it again and now somehow it can compile just right. But still, i can't figure how to use it yet. Do yo have any example on how to use it?

@ahmadudin
Copy link

@marianoarga for example, how can i do this in flutter?

socket.emit('find', 'messages', { status: 'read', user: 10 }, (error, data) => {
  console.log('Found all messages', data);
});

i've tried like

socketIO.sendMessage("find", "messages", (dynamic data) {print(data);});

but the second argument("messages") is causing error org.json.JSONException: Value thread of type java.lang.String cannot be converted to JSONObject.

@marianoarga
Copy link

@ahmadudin
In your code "messages" is not a Json object as error message describes, you have to send a valid json object like string:

String jsonData = "{'entity':'messages', 'status':'read', 'user':10}";
socketIO.sendMessage("find", jsonData, ...);

Note: I would use just method (find), and move the entity type (messages) to the Json request.

@ahmadudin
Copy link

@marianoarga does it means that i have to change socket.io configuration in my server? my node server is throwing error because the second arguments should be string, not json.

@marianoarga
Copy link

@ahmadudin For sure, that will be simpler than modify flutter_socket_io plugin I think...

@ahmadudin
Copy link

@marianoarga i don't think so, the socket.io configuration on my server is handled by feathersjs

@ahmadudin
Copy link

ahmadudin commented Sep 10, 2018

For anyone who have the same problem as me, try this pugin
Flutter socket.io Feathersjs
Its basically is a modified version of flutter_socket_io plugin

@kazrulit
Copy link

Flutter Socket.io
Try this

Hi, does anyone know how to set the path parameter on creating socket io connection, like here:
var socket = io('http://www.example.com/my-namespace', { path: '/some-test-path'});

@vinicioslc
Copy link

vinicioslc commented Oct 13, 2018

Flutter Socket.io
Try this

I has searched a bit, but i doesn't find the repository of creator :( i want improve the library him...

@vinicioslc
Copy link

vinicioslc commented Oct 13, 2018

Flutter Socket.io
Try this

I cloned the code in my repo and left the code open to improvements and I hope someone contributed improvements to motivate put it in DartPackages again.

I updated adding the namespace optional parameter.

https://github.com/vinicioslc/socket_io_flutter

@marianoarga
Copy link

@vinicioslc please contact the author at the plugin contact email:
[email protected]

He is very active and you can have a nice talk.

@mliitfall
Copy link

mliitfall commented Oct 19, 2018

Flutter Socket.io
Try this

How to use custom path?
like this : http://10.0.2.2:3000/test
On server side:
var socket = io({path: '/test'});
client side:
var io = require('socket.io')(server,{path: '/test'});
Flutter :
I'm able to connect with no custom path. But with custom path, i got an error. Where should i put path?

socketIO = SocketIOManager().createSocketIO("http://10.0.2.2:3000/test", "", socketStatusCallback: _socketStatus);`

@mliitfall
Copy link

mliitfall commented Oct 23, 2018

Flutter Socket.io
Try this

Hi, does anyone know how to set the path parameter on creating socket io connection, like here:
var socket = io('http://www.example.com/my-namespace', { path: '/some-test-path'});

@kazrulit @marianoarga @ahmadudin did you find the way to set path parameter?

@dspoonia7
Copy link

Any updates on this? @jumperchen @felangel

jumperchen added a commit that referenced this issue Jan 21, 2019
…ibrary.html and dart.library.io on #4 Flutter Port
@jumperchen
Copy link
Member

closed by this commit - 88a2a09

@harshaIOT
Copy link

harshaIOT commented May 31, 2019

I am trying to implement this socket io package in IOS platform, but its throwing error, I have followed the suggestions and implementation part like in the document ( Instructions they gave ), still not working.

Error msg:

CocoaPods' output:
↳
      Preparing
    Analyzing dependencies
    Inspecting targets to integrate
      Using `ARCHS` setting to build architectures of target `Pods-Runner`: (``)
    Finding Podfile changes
      A Socket.IO-Client-Swift
      A flutter_socket_io
      - Flutter
      - fluttertoast
      - map_view
      - path_provider
      - share
      - sqflite
      - url_launcher
    Fetching external sources
    -> Fetching podspec for `Flutter` from `.symlinks/flutter/ios`
    -> Fetching podspec for `flutter_socket_io` from `.symlinks/plugins/flutter_socket_io/ios`
    -> Fetching podspec for `fluttertoast` from `.symlinks/plugins/fluttertoast/ios`
    -> Fetching podspec for `map_view` from `.symlinks/plugins/map_view/ios`
    -> Fetching podspec for `path_provider` from `.symlinks/plugins/path_provider/ios`
    -> Fetching podspec for `share` from `.symlinks/plugins/share/ios`
    -> Fetching podspec for `sqflite` from `.symlinks/plugins/sqflite/ios`
    -> Fetching podspec for `url_launcher` from `.symlinks/plugins/url_launcher/ios`
    Resolving dependencies of `Podfile`
    Comparing resolved specification to the sandbox manifest
      A FMDB
      A Flutter
      A GoogleMaps
      A Socket.IO-Client-Swift
      A Starscream
      A flutter_socket_io
      A fluttertoast
      A map_view
      A path_provider
      A share
      A sqflite
      A url_launcher
    Downloading dependencies
    -> Installing FMDB (2.7.5)
      > Copying FMDB from `/Users/harshavardhan/Library/Caches/CocoaPods/Pods/Release/FMDB/2.7.5-2ce00` to `Pods/FMDB`
    -> Installing Flutter (1.0.0)
    -> Installing GoogleMaps (2.7.0)
      > Copying GoogleMaps from `/Users/harshavardhan/Library/Caches/CocoaPods/Pods/Release/GoogleMaps/2.7.0-f79af` to `Pods/GoogleMaps`
    -> Installing Socket.IO-Client-Swift (13.3.1)
      > Copying Socket.IO-Client-Swift from `/Users/harshavardhan/Library/Caches/CocoaPods/Pods/Release/Socket.IO-Client-Swift/13.3.1-79f8f` to `Pods/Socket.IO-Client-Swift`
    -> Installing Starscream (3.0.6)
      > Copying Starscream from `/Users/harshavardhan/Library/Caches/CocoaPods/Pods/Release/Starscream/3.0.6-ef3ec` to `Pods/Starscream`
    -> Installing flutter_socket_io (0.0.1)
    -> Installing fluttertoast (0.0.2)
    -> Installing map_view (0.0.12)
    -> Installing path_provider (0.0.1)
    -> Installing share (0.5.2)
    -> Installing sqflite (0.0.1)
    -> Installing url_launcher (0.0.1)
      - Running pre install hooks
    [!] Unable to determine Swift version for the following pods:
    - `Socket.IO-Client-Swift` does not specify a Swift version and none of the targets (`Runner`) integrating it have the `SWIFT_VERSION` attribute set. Please contact the author or set the `SWIFT_VERSION` attribute in at least one of the targets that integrate this pod.
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/installer/xcode/target_validator.rb:115:in `verify_swift_pods_swift_version'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/installer/xcode/target_validator.rb:37:in `validate!'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/installer.rb:459:in `validate_targets'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/installer.rb:138:in `install!'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/command/install.rb:48:in `run'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/claide-1.0.2/lib/claide/command.rb:334:in `run'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/lib/cocoapods/command.rb:52:in `run'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/gems/cocoapods-1.6.1/bin/pod:55:in `<top (required)>'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/bin/pod:22:in `load'
    /usr/local/Cellar/cocoapods/1.6.1/libexec/bin/pod:22:in `<main>'
Error output from CocoaPods:
↳
    [!] Automatically assigning platform `ios` with version `8.0` on target `Runner` because no platform was specified. Please specify a platform for this target in your Podfile. See `https://guides.cocoapods.org/syntax/podfile.html#platform`.
Error running pod install
Error launching application on iPhone Xʀ.
Exited (sigterm)
```

@katastreet
Copy link

Flutter Socket.io
Try this

Hi, does anyone know how to set the path parameter on creating socket io connection, like here:
var socket = io('http://www.example.com/my-namespace', { path: '/some-test-path'});

@kazrulit @marianoarga @ahmadudin did you find the way to set path parameter?

For all having issues with custom path parameter, I got around this by using adhara_socket_io package. Implementation is similar to this one.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests