Webviewjavascriptbridge Android Side garbled problem (webview and page JS Interactive transmission Parameters Garbled)

<span id="Label3"></p><p><p>Scenario: Android Project WebView loads the remote HTML URL address and displays it. After clicking the HTML button, send the parameters to WebView via Js. In native Android code, parameters can be obtained and processed (depending on the business). A garbled problem was encountered in the Transmission.</p></p><p><p></p></p><p><p>Garbled mainly for the Chinese language.</p></p><p><p>Webviewjavascriptbridge Interactive use is not repeated, you can refer to http://www.cnblogs.com/whoislcj/p/6104015.html</p></p><p><p>Html-side JS Code:</p></p><pre class="brush:javascript;collapse:true;;gutter:true;">function Setupwebviewjavascriptbridge (callback) {if (window. Webviewjavascriptbridge) {return Callback (webviewjavascriptbridge);} If (WINDOW. Wvjbcallbacks) {return WINDOW. Wvjbcallbacks.push (callback); } window. Wvjbcallbacks = [callback]; var wvjbiframe = document.createelement (' iframe '); WVJBIframe.style.display = ' None '; WVJBIFRAME.SRC = ' wvjbscheme://__bridge_loaded__ '; Document.documentElement.appendChild (wvjbiframe); SetTimeout (function () {document.documentElement.removeChild (wvjbiframe)}, 0)} Setupwebviewjavascriptbridge ( function (bridge) {var uniqueId = 1 function log (message, data) {var log = document.getElementById (' log ') var el = document.createelement (' div ') el.classname = ' logline ' el.innerhtml = uniqueid++ + '. ' + message + ':<br/> ' + json.stringify (data) if (log.children.length) {log.insertbefore (el, log.children[0] )} else {log.appendchild (el)}} bridge.registerhandler (' TestjavAscripthandler ', function (data, responsecallback) {//log (' OBJC called Testjavascripthandler with ', Data) V Ar responsedata = {' Javascript Says ': ' right back atcha! '}　　　　 Log (' JS responding with ', responsedata) responsecallback (responsedata)})//custom Code only modifies this code so that no other changes are required　　　　Gets the button object var invest_back = document.getElementById (' back '); Determine if the page exists if (invest_back!= undefined && invest_back!= null) {//define Click event Invest_back.onclick = function (e) {e.preventdefault ();//default fixed//custom parameter json var data = {' Command ': ' Invest ',　　　　　　　　　　　　　　' Result ': 0}; TESTOBJCCALLBACK1 extracts data bridge.callhandler (' testObjcCallback1 ', data, function (response) in Android code based on this ID. {//here is the callback, according to their own needs is not to deal with, do not need to Write//log (' JS got response ', response)}); }}//custom Code End})</pre><p><p></p></p><p><p>The Webviewjavascriptbridge JS referenced in Android needs to be modified to find the code</p></p><p><p>Originally:</p></p><pre class="brush:javascript;collapse:true;;gutter:true;"><pre class="brush:javascript;collapse:true;;gutter:true;">function Callhandler (handlerName, data, responsecallback) {if (arguments.length = = 2 && typeof data = = ' function ') {responsecallback = Data;data = null;} _dosend ({handlername:handlername, data:data}, responsecallback);}</pre></pre><p><p>After modification:</p></p><p><p></p></p><pre class="brush:javascript;gutter:true;"><pre class="brush:javascript;gutter:true;">function Callhandler (handlerName, data, responsecallback) {if (arguments.length = = 2 && typeof data = = ' function ') {responsecallback = Data;data = null;}<br>　　　　　　　　　　<span style="color: #ff0000; background-color: #ffffff;"><strong>else{data = btoa (unescape (encodeuricomponent (data)));//red section for modified encryption}</strong></span>json.stringify ({_dosend: handlerName, data:data}, responsecallback);}</pre></pre><p><p></p></p><p><p>Get the data in Android code</p></p><p><p>First you need to refer to two</p></p><pre class="brush:java;gutter:true;"><pre class="brush:java;gutter:true;">Import Java.net.urldecoder;import android.util.Base64;</pre></pre><pre class="brush:java;collapse:true;;gutter:true;"><pre class="brush:java;collapse:true;;gutter:true;">TestObjcCallback1 is consistent with the definition in JS<br>Webview.registerhandler ("testObjcCallback1", New Wvjbwebview.wvjbhandler () { @Override public void Request ( Object data, wvjbwebview.wvjbresponsecallback callback) { callback.callback ("Response from testjavacallback!"); Data here can make a single parameter, if it is more than one parameter, can be written as JSON {"command": "invest", "result": 1} {' command ': ' choujiang ', ' result ': 1}; String str = data.tostring (); First Base64 decoding byte[] mmmm = base64.decode (str, base64.default); string s = new string (mmmm); In the URL decoding String ee = urldecoder.decode (s, "UTF-8");</pre></pre><p><p></p></p><p><p>JS in the encryption, after the removal of Android in the decryption, so there will be no garbled.</p></p><p><p>Test it.</p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p></p></p><p><p>Resolved as Follows:</p></p><p><p>Webviewjavascriptbridge Android Side garbled problem (webview and page JS Interactive transmission Parameters Garbled)</p></p></span>