integrado - ApprtcDemo con servidor local funciona entre navegadores, pero no Android nativo al navegador

vpn chrome

Question

Estoy desarrollando una aplicación de chat y terminé con ella. Ahora quiero implementar video chat también. Después de investigar mucho decidí ir con la biblioteca "WebRTC".

¿Que he hecho?

1) Capaz de ejecutar AppRtcDemo en el servidor local y funciona bien entre los navegadores.

Referencia: http://www.webrtc.org/reference/getting-started

2) Capaz de construir Android AppRtcDemo. Pero cuando lo ejecuto, diga "El origen cruzado no es compatible".

Después de la investigación, en la discusión de webrtc, encontré que para resolver este problema, debo configurar mi propio servidor de turnos.

3) Entonces instalo la última versión de rfc5766TurnServer recomendada por webrtc. Tengo éxito para ejecutar el servidor a su vez.

Referencia: http://code.google.com/p/rfc5766-turn-server/

Realizo los siguientes cambios en ApprtcDemo (web) y (Android) para trabajar con mi servidor Turn

1) apprtc.py

Reemplazar:

turn_url = ''https://computeengineondemand.appspot.com/''
turn_url = turn_url + ''turn?'' + ''username='' + user + ''&key=4080218913''

Con apuntar a mi servidor de turno:

turn_url = ''http://192.168.5.85:3478/?service=turn&username=biraj''

2) index.html

Reemplazar:

var pcConfig = {{ pc_config|safe }};

Con:

var pcConfig = {"iceServers": [{"url": "stun:stun.l.google.com:19302"},            {"url":"turn:[email protected]:3479", "credential":"0x5b04123c3eec4cf0be64ab909bb2ff5b"}]};

Androide

1) AppRTCDemoActivity.java

Reemplazar:

roomInput.setText("https://apprtc.appspot.com/?r=");

Con mi servidor de apprtc local:

roomInput.setText("http://192.168.5.86:8080/?r=");

2) AppRTCClient.java

En private PeerConnection.IceServer requestTurnServer(String url){}

Reemplazar:

connection.addRequestProperty("origin", "https://apprtc.appspot.com");

Con:

connection.addRequestProperty("origin", "http://192.168.5.86:8080");

3) /assets/channel.html

Reemplazar:

<script src="https://apprtc.appspot.com/_ah/channel/jsapi"></script>

Con:

<script src="http://192.168.5.86:8080/_ah/channel/jsapi"></script>

Ahora mi pregunta es por qué esto funciona entre los navegadores, pero no entre el AppRtcDemo de Android y el navegador.

Cuando ejecuto AppRtcDemo en Android después de hacer los cambios anteriores, la vista previa de la cámara local se inicia en la esquina superior derecha y aparece el mensaje "a la espera de ICEcandidates", entonces no sucede nada.

Gracias por adelantado.

Gracias a todos por apoyar mi pregunta. Después de un largo viaje rocoso con ApprtcDemo obtuve el éxito y funciona bien. Estoy publicando la solución.

Busque el archivo java " GAEChannelClient.java ".

y cambiar de la siguiente manera.

/*
 * libjingle
 * Copyright 2013, Google Inc.
 *
 * Redistribution and use in source and binary forms, with or without
 * modification, are permitted provided that the following conditions are met:
 *
 *  1. Redistributions of source code must retain the above copyright notice,
 *     this list of conditions and the following disclaimer.
 *  2. Redistributions in binary form must reproduce the above copyright notice,
 *     this list of conditions and the following disclaimer in the documentation
 *     and/or other materials provided with the distribution.
 *  3. The name of the author may not be used to endorse or promote products
 *     derived from this software without specific prior written permission.
 *
 * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'''' AND ANY EXPRESS OR IMPLIED
 * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
 * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO
 * EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
 * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
 * OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
 * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
 * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
 * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */

package org.appspot.apprtc;

import java.io.InputStream;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.util.Log;
import android.webkit.ConsoleMessage;
import android.webkit.JavascriptInterface;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;

/**
 * Java-land version of Google AppEngine''s JavaScript Channel API:
 * https://developers.google.com/appengine/docs/python/channel/javascript
 * 
 * Requires a hosted HTML page that opens the desired channel and dispatches JS
 * on{Open,Message,Close,Error}() events to a global object named
 * "androidMessageHandler".
 */
public class GAEChannelClient {
    private static final String TAG = "GAEChannelClient";
    private WebView webView;
    private final ProxyingMessageHandler proxyingMessageHandler;

    /**
     * Callback interface for messages delivered on the Google AppEngine
     * channel.
     * 
     * Methods are guaranteed to be invoked on the UI thread of |activity|
     * passed to GAEChannelClient''s constructor.
     */
    public interface MessageHandler {
        public void onOpen();

        public void onMessage(String data);

        public void onClose();

        public void onError(int code, String description);
    }

    /** Asynchronously open an AppEngine channel. */
    @SuppressLint("SetJavaScriptEnabled")
    public GAEChannelClient(Activity activity, String token, MessageHandler handler) {
        webView = new WebView(activity);

        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setAllowFileAccessFromFileURLs(true); // Maybe you
                                                                    // don''t
                                                                    // need this
                                                                    // rule
        webView.getSettings().setAllowUniversalAccessFromFileURLs(true);

        webView.setWebChromeClient(new WebChromeClient() { // Purely for
                                                            // debugging.
            public boolean onConsoleMessage(ConsoleMessage msg) {
                Log.d(TAG, "console: " + msg.message() + " at " + msg.sourceId() + ":" + msg.lineNumber());
                return false;
            }
        });
        webView.setWebViewClient(new WebViewClient() { // Purely for debugging.
            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                Log.e(TAG, "JS error: " + errorCode + " in " + failingUrl + ", desc: " + description);
            }

            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                System.out.println("HI");
                return super.shouldOverrideUrlLoading(view, url);
            }
        });

        proxyingMessageHandler = new ProxyingMessageHandler(activity, handler, token);
        webView.addJavascriptInterface(proxyingMessageHandler, "androidMessageHandler");
//       webView.loadUrl("file:///android_asset/channel.html");
        try {
            InputStream is = activity.getAssets().open("channel.html");
            StringBuilder builder = new StringBuilder();
            byte[] buffer = new byte[1024];
            while (is.read(buffer) != -1) {
                builder.append(new String(buffer));
            }
            is.close();
            String str = builder.toString();
            webView.loadDataWithBaseURL("http://192.168.5.86:8080", str, "text/html", "utf-8", null);
        } catch (Exception e) {
            e.printStackTrace();
        }

    }

    /** Close the connection to the AppEngine channel. */
    public void close() {
        if (webView == null) {
            return;
        }
        proxyingMessageHandler.disconnect();
        webView.removeJavascriptInterface("androidMessageHandler");
        webView.loadUrl("about:blank");
        webView = null;
    }

    // Helper class for proxying callbacks from the Java<->JS interaction
    // (private, background) thread to the Activity''s UI thread.
    private static class ProxyingMessageHandler {
        private final Activity activity;
        private final MessageHandler handler;
        private final boolean[] disconnected = { false };
        private final String token;

        public ProxyingMessageHandler(Activity activity, MessageHandler handler, String token) {
            this.activity = activity;
            this.handler = handler;
            this.token = token;
        }

        public void disconnect() {
            disconnected[0] = true;
        }

        private boolean disconnected() {
            return disconnected[0];
        }

        @JavascriptInterface
        public String getToken() {
            return token;
        }

        @JavascriptInterface
        public void onOpen() {

            System.out.println("GAEClient : Open" );
            activity.runOnUiThread(new Runnable() {
                public void run() {
                    if (!disconnected()) {
                        handler.onOpen();
                    }
                }
            });
        }

        @JavascriptInterface
        public void onMessage(final String data) {
            System.out.println("GAEClient : Message : " +data );
            activity.runOnUiThread(new Runnable() {
                public void run() {
                    if (!disconnected()) {
                        handler.onMessage(data);
                    }
                }
            });
        }

        @JavascriptInterface
        public void onClose() {
            System.out.println("GAEClient : Close" );
            activity.runOnUiThread(new Runnable() {
                public void run() {
                    if (!disconnected()) {
                        handler.onClose();
                    }
                }
            });
        }

        @JavascriptInterface
        public void onError(final int code, final String description) {
            System.out.println("GAEClient : Erroe : " + description);
            activity.runOnUiThread(new Runnable() {
                public void run() {
                    if (!disconnected()) {
                        handler.onError(code, description);
                    }
                }
            });
        }
    }
}

Channel.html en la carpeta de activos

<html>
  <head>
    <script src="http://192.168.5.86:8080/_ah/channel/jsapi"></script>
  </head>
  <!--
  Helper HTML that redirects Google AppEngine''s Channel API to a JS object named
  |androidMessageHandler|, which is expected to be injected into the WebView
  rendering this page by an Android app''s class such as AppRTCClient.
  -->
  <body onbeforeunload="closeSocket()" onload="openSocket()">
    <script type="text/javascript">
      var token = androidMessageHandler.getToken();
      if (!token)
        throw "Missing/malformed token parameter: [" + token + "]";

      var channel = null;
      var socket = null;

      function openSocket() {
        channel = new goog.appengine.Channel(token);
        socket = channel.open({
          ''onopen'': function() { androidMessageHandler.onOpen(); },
          ''onmessage'': function(msg) { androidMessageHandler.onMessage(msg.data); },
          ''onclose'': function() { androidMessageHandler.onClose(); },
          ''onerror'': function(err) { androidMessageHandler.onError(err.code, err.description); }
        });
      }

      function closeSocket() {
        socket.close();
      }
    </script>
  </body>
</html>

Answer 1

Lamentablemente no sé si has hecho estas cosas:

1. Utilice el mismo aturdidor y active el servidor en cada aplicación (ya sea PC o móvil).
2. ¿Incluso está enviando a los candidatos de ICE entre las aplicaciones (creo que sí, pero solo para verificar)?
3. ¿Estás seguro de que el url STUN / TURN es el que da el error, ya que no puedo creer que estas cosas tengan que ver con los orígenes cruzados (no deberían, ya que simplemente te estás conectando de un cliente a un servidor). El origen se utiliza principalmente en las páginas web que cargan datos de una fuente externa. No se le permite hacerlo desde un XHR. Realmente creo que tiene algo que ver con https://apprtc.appspot.com/_ah/channel/jsapi , ya que este es un buen ejemplo de cosas de origen cruzado.

¿Qué sucede si abres la página web que funciona en tu navegador chrome en el móvil? ¿Qué hace entonces? (Ten en cuenta que puedes conectar tu teléfono a tu PC para tener todas las herramientas de desarrollador que tiene Chrome. Chrome se ejecuta en tu dispositivo Android, pero puedes ver los devtools en tu PC).

Si me puede proporcionar estas respuestas, podría ayudarlo. Intente revertir todos esos cambios y solo use el servidor TURN de Google, pero solo haga que el archivo https://apprtc.appspot.com/_ah/channel/jsapi local.

EDIT: Veo que has encontrado tu respuesta . ¿Te importaría compartirlo?