¿Es posible obtener datos de formularios HTML en android mientras se usa webView?
Estoy haciendo una forma muy simple en HTML que se ve en android usando la webview que toma su nombre usando un cuadro de texto y al hacer clic en el botón, lo muestra en un párrafo y se ha hecho utilizando html y javascript. Este es mi código html:
<!DOCTYPE html> <html> <body> <p> Write your name and win your favorite game console name and win it! The winners will be announced in 4 days.</p> Type your name here: <input id="thebox" type="text" name="value" value=""><br> <button onclick="myFunction()">Try it</button> <p id="demo"></p> <script> function myFunction() { var x = document.getElementById("thebox").value; document.getElementById("demo").innerHTML = x; } </script> </body> </html>
NUEVO FORMULARIO EDITADO
- Android WebViewClient onReceivedError no se llama para un error 404
- Flash no se muestra en WebView para Android 3.0.1
- No se reproduce el video de YouTube en WebView
- Enlaces internos básicos no funcionan en la aplicación de nido de abeja?
- Tamaño de fuente de Android WebView en píxeles
<form name="albert" action="" method="POST"> <label for="firstname"> First Name </label> <br /><br /> <input type="text" name="firstname" id="firstname" /> <input type="submit" name="sbumit" value="Submit" /> </form>
Quiero obtener el valor de la caja de entrada llamada "thebox" en una variable en android en el botón de clic y he intentado muchas cosas antes y seguí un método en el que se inyecta un archivo JS, pero como no sé nada de JS, así que No lo intenté y aquí está el archivo que pongo en mi proyecto y el archivo se llama inject.js:
document.getElementsByTagName('form')[0].onsubmit = function () { var objPWD, objAccount, objSave; var str = ''; var inputs = document.getElementsByTagName('thebox'); for (var i = 0; i < inputs.length; i++) { if (inputs[i].name.toLowerCase() === 'thebox') { objAccount = inputs[i]; } } if(objAccount != null) { str += objAccount.value; } if(objPWD != null) { str += ' , ' + objPWD.value; } if(objSave != null) { str += ' , ' + objSave.value; } window.AndroidInterface.processHTML(str); return true; };
Y más tarde, cuando seguí ese artículo, dijo que tengo que poner algunas cosas en mi MainActivity, pero como estoy usando webview por primera vez, no pude entender mucho y heres el código que puse en mi MainActivity:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); WebView webView = new WebView(this); this.setContentView(webView); // enable javascript WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true); webView.addJavascriptInterface(new JavaScriptInterface(), "AndroidInterface"); // catch events webView.setWebViewClient(new WebViewClient(){ @Override public void onPageFinished(WebView view, String url) { try { view.loadUrl("javascript:" + buildInjection()); } catch (IOException e) { e.printStackTrace(); } } }); webView.loadUrl("http://someurl.com"); }
Una clase anidada que hice en mi MainActivity:
class JavaScriptInterface { @JavascriptInterface public void processHTML(String formData) { Log.d("AWESOME_TAG", "form data: " + formData); } }
Y finalmente el método que inyecta el código:
private String buildInjection() throws IOException { StringBuilder buf = new StringBuilder(); InputStream inject = getAssets().open("inject.js");// file from assets BufferedReader in = new BufferedReader(new InputStreamReader(inject, "UTF-8")); String str; while ((str = in.readLine()) != null) { buf.append(str); } in.close(); return buf.toString(); }
Quiero obtener valor del formulario html (el cuadro de entrada) que muestro en una vista web en Android y es realmente posible hacerlo y si es así, ¿cómo y por favor explique? Gracias y también por favor decir en qué variable voy a obtener el valor.
- ¿Cómo puedo panoramizar una webview en google glass
- ¿Es -webkit-column-break-before compatible con Android 2.3 WebView?
- ¿Cómo mantengo mi aplicación Córdova a pantalla completa al abrir el teclado de Android?
- Flash en un WebView de Android - problema de capas
- SwipeRefreshLayout + WebView cuando la posición de desplazamiento está en la parte superior
- ¿Cómo implementar múltiples webviews cordova en una actividad utilizando fragmentos?
- La vista web de Android no tratará los eventos correctamente cuando el iframe esté presente
- xamarin android webview ya no recupera la página servida localmente con httplistener
Webview browser=(WebView)view.findViewById(R.id.webChart); browser.getSettings().setJavaScriptEnabled(true); browser.addJavascriptInterface(new WebAppInterface(getActivity()), "Android"); browser.loadUrl("file:///android_asset/yourHtmlFileName.html");
Su clase WebAppInterface
public class WebAppInterface { Context mContext; String data; WebAppInterface(Context ctx){ this.mContext=ctx; } @JavascriptInterface public void sendData(String data) { //Get the string value to process this.data=data; } }
Sus datos de código HTML
function loadChartData() { var x = document.getElementById("thebox").value; Android.sendData(x); }
Llame a esta función cuando el botón html haga clic en android webview
ACTUALIZAR
1) Por defecto javascript está deshabilitado en webview. Para habilitarlo, obtenga la configuración de la webview y llame al setJavaScriptEnabled (true); A la verdad.
2) para crear la interfaz entre su código Javascript y su código androide, necesita crear la clase de interfaz Javacript.
3) enlazar la interfaz entre su código javascript a código android, necesita pasar la referencia de la clase de interfaz y un nombre de interfaz que su javaScript puede llamar para acceder a la clase.
4) pasar la ruta del archivo html para cargar en la webview (navegador).
5) crear la clase de interfaz como a continuación (WebAppInterface).
Vea este enlace para más detalles https://developer.android.com/guide/webapps/webview.html
6) en el archivo HTML, crear el botón y agregar el oyente de clic a ese botón y llamar a la función sendData ("su valor") con el nombre de la interfaz (aquí Android).
Eso es todo. Usted puede pasar el valor de html a su código androide.
Sí se puede, puede utilizar javascript para obtener el contenido de la página web. A continuación, utilice la vista web jsInterface para devolver el contenido a su código java.
Refiérase a este proyecto github . Y esta respuesta y este artículo .
final Context myApp = this; /* An instance of this class will be registered as a JavaScript interface */ class MyJavaScriptInterface { @JavascriptInterface @SuppressWarnings("unused") public void processHTML(String html) { // process the html as needed by the app } } final WebView browser = (WebView)findViewById(R.id.browser); /* JavaScript must be enabled if you want it to work, obviously */ browser.getSettings().setJavaScriptEnabled(true); /* Register a new JavaScript interface called HTMLOUT */ browser.addJavascriptInterface(new MyJavaScriptInterface(), "HTMLOUT"); /* WebViewClient must be set BEFORE calling loadUrl! */ browser.setWebViewClient(new WebViewClient() { @Override public void onPageFinished(WebView view, String url) { /* This call inject JavaScript into the page which just finished loading. */ browser.loadUrl("javascript:window.HTMLOUT.processHTML('<head>'+document.getElementsByTagName('html')[0].innerHTML+'</head>');"); } }); /* load a web page */ browser.loadUrl("http://lexandera.com/files/jsexamples/gethtml.html");
Espero que esto ayude.
Sí, es posible. Intente usar el código abajo
> @Override > public void onCreate(Bundle savedInstanceState) { > super.onCreate(savedInstanceState); > setContentView(R.layout.web_view_layout); > WebView webView = (WebView) findViewById(R.id.webView); > webView.getSettings().setPluginState(WebSettings.PluginState.ON); > WebSettings webSettings = webView.getSettings(); > webSettings.setJavaScriptEnabled(true); > try { > progressDialog = new ProgressDialog(ActivityName); > progressDialog.setMessage("Loading.."); progressDialog.setCancelable(false); > webView.setWebViewClient(new MyWebViewClient()); > webView.loadUrl(YOUR_URL); > } catch (Exception e) { > e.toString(); > } > } > > private class MyWebViewClient extends WebViewClient { > > @Override > public boolean shouldOverrideUrlLoading(WebView view, String url) { > view.loadUrl(url); > progressDialog.dismissProgress(); > return true; > } > > @Override > public void onPageFinished(WebView view, String url) { > progressDialog.dismissProgress(); > } > }
Puede obtener datos de WebView capturando mensajes de alerta.
Utilice WebChromeClient.
mWebview = (WebView)findViewById(R.id.yourwebviewlayout); final class YourWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { Toast.makeText(getApplicationContext(), "alert message = " + message, Toast.LENGTH_SHORT).show(); result.confirm(); return true; } } mWebview.setWebChromeClient(new YourWebChromeClient());
Para los formularios con el método "GET" se puede lograr este bastante simple con el método shouldOverrideUrlLoading
. La siguiente solución funciona sólo si se ha cargado URL a través del método webview.loadUrl()
.
private class MWebViewClient extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { // submit will end-up with url like "data:,?firstname=SomeInput&sbumit=Submit" if (URLUtil.isDataUrl(url)) { url = url.replace(":,?", ":/?"); //to be able to properly parse Uri Uri uri = Uri.parse(url); //here you can get params by field name String firstname = uri.getQueryParameter("firstname"); //we handle this URL ourselves return true; } return super.shouldOverrideUrlLoading(view, url); } }
Para comunicar un webView con android nativo, esta es una forma sencilla: en su js onClick en el botón debe llamar a url que contiene su texto, algo así como myPrefix: // myData y en android
webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(final WebView view, final String url) { if(url.startsWith("myPrefix://")) { //get your data by split url return true; } return false; });
@Shariq Como muchos ya han respondido a esta pregunta de una buena manera, pero creo que además necesita clarificación sobre cómo exactamente los datos está fluyendo en los códigos de webview a andorid por lo que no perderá bytes en la escritura que todos los códigos redundantes:
(Estoy tomando la referencia de sus códigos para una mejor comprensión) Siga estos pasos en estos códigos para hacer una mejor comprensión:
Paso 1:
Tenemos que definir algún método en Android lado que puede aceptar algunos datos de webview
@JavascriptInterface //this 'formData' variable is going to accept the data from webview public void processHTML(String formData) { Log.d("AWESOME_TAG", "form data: " + formData); }
Ahora, su valor estará disponible para el contexto de Java android side.
Paso 2:
Aquí están sus códigos laterales HTML (webview). Si la URL que está accediendo en webview es suya, entonces usted puede escribir fácilmente estos códigos a la página html, pero si está accediendo a alguna URL de terceros todavía se puede inyectar este código js en webview simplemente siguiendo la línea de código:
... //partial code webView.load("javascript:function myFunction() { var x = document.getElementById('thebox').value; Android.processHTML(x); } myFunction();"; ...
Así que lo que está sucediendo exactamente aquí:
'X' es la variable en js que contiene el valor requerido y luego estamos enviando esta variable 'x' al contexto android a través de la llamada al método Android.processHTML (x)
Espero que te ayude de una manera mejor
- ¿Cómo puedo usar layout_weight en RecyclerView o Vista de elemento ListView para que los elementos de igual altura llenen el espacio disponible en la pantalla?
- Fragmento de Android encreateview llamado en el cambio de ficha