Est-il possible d'obtenir des données à partir de formulaires HTML dans android tout en utilisant webView?
je fais une forme très simple en HTML qui est vu dans android en utilisant le webview qui prend dans votre nom en utilisant une boîte de texte et quand vous cliquez sur le bouton, il l'affiche dans un paragraphe et il est fait en utilisant à la fois html et javascript. C'est mon code 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>
NEW EDITED FORM
<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>
je veux obtenir la valeur de la boîte de saisie appelée "thebox" dans une variable dans android sur le clic de bouton et j'ai essayé beaucoup de choses avant et je j'ai suivi une méthode où vous injectez un fichier JS, mais comme je ne sais rien sur JS, j'ai échoué en essayant cela et voici le fichier que j'ai mis dans mon projet et le fichier s'appelle injecter.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;
};
et plus tard quand j'ai suivi cet article il a dit que j'avais besoin de mettre quelques trucs dans mon activité principale mais puisque j'utilise webview pour la première fois, je ne pouvais pas comprendre grand chose Et voici le code que j'ai mis dans mon activité principale:
@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");
}
un cours imbriqué que j'ai fait dans mon MainActivity:
class JavaScriptInterface {
@JavascriptInterface
public void processHTML(String formData) {
Log.d("AWESOME_TAG", "form data: " + formData);
}
}
et enfin la méthode qui injecte le code:
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();
}
je veux obtenir de la valeur à partir du formulaire html (le-input-box) que je montre dans un webview sous Android et est - il vraiment possible de le faire et si oui comment et s'il vous plaît expliquer? Merci et aussi s'il vous plaît dire dans quelle variable vais-je obtenir la valeur.
8 réponses
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");
ajouter cette classe d'interface, 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;
}
}
vos données de code HTML
function loadChartData() {
var x = document.getElementById("thebox").value;
Android.sendData(x);
}
appeler cette fonction lorsque le bouton html clique sur android webview
UPDATE
1) Par défaut, javascript est désactivé dans webview . pour l'activer, récupérez les paramètres du webview et appelez le setJavaScriptEnabled(true); to true.
2) pour créer l'interface entre votre code Javascript et votre code android, vous devez créer la classe d'interface JavaScript.
3) relier l'interface entre votre code javascript au code android, vous devez passer la référence de la classe d'interface et un nom d'interface que votre javaScript peut appeler pour accéder à la classe.
4) passer le chemin du fichier html à charger dans le webview(navigateur).
5) créer la classe interface comme ci-dessous (WebAppInterface).
voir ce lien pour plus de détails https://developer.android.com/guide/webapps/webview.html
6) dans le fichier HTML, créer le bouton et ajouter l'auditeur de clic à ce bouton et appeler la fonction sendData("votre valeur") avec le nom de l'interface(ici Android).
c'est tout. vous pouvez passer la valeur de html à votre code android.
Oui vous pouvez, vous pouvez utiliser javascript pour obtenir le contenu de la page web. Ensuite, utilisez le jinterface de webview pour retourner le contenu à votre code java.
saisir projet github. et ce réponse et article.
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");
Espérons que cette aide.
pour les formulaires avec la méthode "GET" vous pouvez obtenir ce assez simple juste en écrasant shouldOverrideUrlLoading méthode. La solution suivante ne fonctionne que si l'url a été chargée par webview.loadUrl() méthode.
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);
}
}
Oui c'est possible. S'il vous plaît essayer d'utiliser le code ci-dessous
> @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();
> }
> }
Vous pouvez obtenir des données de WebView en attrapant des messages d'alerte.
Utilisez 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());
pour communiquer un webView avec android natif, c'est une manière simple : dans votre clic de souris sur le bouton, vous devez appeler l'url qui contient votre texte, quelque chose comme myPrefix: / / myData et dans 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 Comme beaucoup ont déjà répondu à cette question d'une bonne manière, mais je pense que d'ailleurs vous avez besoin de clarification sur la façon dont exactement les données circulent dans les codes de webview à andorid donc je ne vais pas gaspiller des octets par écrit que tous les codes redondants:
(je me réfère à vos codes pour une meilleure compréhension ) Suivez ces étapes dans ces codes pour faire mieux comprendre:
Etape 1:
Nous avons besoin de définir une méthode sur Android qui peut accepter certaines données 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);
}
Maintenant, la valeur sera disponible à java android contexte côté.
Etape 2:
voici vos codes HTML (webview). si L'URL à laquelle vous accédez dans webview est la vôtre, alors vous pouvez facilement écrire ces codes à la page html, mais si vous accédez à une URL tierce, vous pouvez quand même injecter ce code js dans webview simplement en suivant la ligne de code:
...
//partial code
webView.load("javascript:function myFunction() { var x = document.getElementById('thebox').value; Android.processHTML(x); } myFunction();";
...
alors, que se passe-t-il exactement? ici:
'x' est la variable dans js contenant la valeur requise et ensuite nous envoyons cette variable 'x' au contexte android via appel de méthode Android.processHTML (x)
j'espère que ça peut vous aider dans une meilleure façon
Meilleur js pour injecter avons utilisée jusqu'à présent, il recueille des données à partir de toutes les formes sur submit
document.getElementsByTagName("form")[0].addEventListener("submit", myFunction);
function myFunction()
{
var data="";
var inputs = document.forms[0].getElementsByTagName('input');
for (var i = 0; i < inputs.length; i++) {
var field = inputs[i];
if (field.type != 'submit' && field.type != 'reset' && field.type != 'button')
data += '' + field.name + '=' + field.value+'\n';
}
window.AndroidInterface.processHTML(data);
return true;
}