项目中Android与Js交互
Posted 静待花开*^_^*
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了项目中Android与Js交互相关的知识，希望对你有一定的参考价值。
一、项目涉及的类：
DetailCourseMainActivity,htmlCountMainFragment,HtmlCountFragment,HtmlCountJSInterface,AnswerWebView
二、逐步分析：
1.MainActivity:
1）点击：打开页面
showFragment(HtmlCountMainFragment.class);
2）针对返回键的处理：
onBackPressed()：
一般的：super.onBackPressed();return;
对于Html的Fragment要交给HtmlCountMainFragment处理：（针对统计页面返回的回调，不是初始页面，关闭当前页面）
HtmlCountMainFragment htmlCountMainFragment = (HtmlCountMainFragment) fragmentMap.get(HtmlCountMainFragment.class);
if (htmlCountMainFragment.handleBack()) {//关闭内部页面
return;
}
2.HtmlMainFragment：外部主框架View，主要用来包含container:webView,处理JS回调我们的方法执行任务
1）html_main_fragment.xml:
<title-><Refresh->主要部分container
<FrameLayout
android:id="@+id/html_count_content_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFFFF" />
2）加载书籍数据，BookInfo,设置title,可以传给js调用
3）加入接口：ICallMainFragment,给js调用咱们的方法，做相应处理，以达到效果
ICallMainFragment iCallMainFragment = new ICallMainFragment() {
@Override
public void setContentView(AnswerWebView webView) {//refreshLayout设置刷新的控件，滑到最顶部的时候才刷新
refreshLayout.setContentView(webView);
}
@Override
public void dismissProgressDialog() {//调用去掉进度转圈
HtmlCountMainFragment.this.dismissProgressDialog();
}
@Override
public void openNewPage(String urlStr_) {//打开新页面
stackFragment.push(curHtmlCountFragment);//把新页面的HtmlCountFragment放到stack
FragmentTransaction ft = getActivity().getSupportFragmentManager().beginTransaction();
ft.addToBackStack("fragmentname");
ft.hide(curHtmlCountFragment);
HtmlCountJSInterface jsInterface = curHtmlCountFragment.jsInterface;
if (jsInterface != null) {
jsInterface.callJSMethod("onPause()");
}
//new 新的HtmlCountFragment加载新界面
curHtmlCountFragment = new HtmlCountFragment();
curHtmlCountFragment.setCallMainFragment(iCallMainFragment);
ft.add(R.id.html_count_content_layout, curHtmlCountFragment).commitAllowingStateLoss();
curHtmlCountFragment.loadPage(urlStr_);
}
@Override
public boolean closePage() {//关闭页面
if (stackFragment.size() > 0) {
getActivity().getSupportFragmentManager().popBackStack();
curHtmlCountFragment = stackFragment.pop();//回到上一个fragment
curHtmlCountFragment.onResumeBack();//显示
refreshLayout.setContentView(curHtmlCountFragment.webView);
FragmentTransaction ft = getActivity().getSupportFragmentManager().beginTransaction();
ft.show(curHtmlCountFragment).commitAllowingStateLoss();
return true;
} else {
getActivity().finish();
}
return false;
}
@Override
public HtmlCountFragment getCurHtmlFragment() {//获取当前页面的fragment
return curHtmlCountFragment;
}
@Override
public void updateTitle(final String titleTxt) {//更新title
TaskUtils.postMainTask(new Task() {
@Override
public void run() throws Exception {
title.setText(titleTxt);
}
});
}
@Override
public BookInfo getBookInfo() {//获取书的信息
return bookInfo;
}
@Override
public void setEnable(boolean enable) {//设置是否启用下拉刷新
refreshLayout.setEnable(enable);
}
};
将这个接口传递给下一个，内部的HtmlFragment:
curHtmlCountFragment = new HtmlCountFragment();
getActivity().getSupportFragmentManager().beginTransaction().replace(R.id.html_count_content_layout, curHtmlCountFragment).commitAllowingStateLoss();
curHtmlCountFragment.setCallMainFragment(iCallMainFragment);//重点
注：StackFragment用于打开新页面，关闭页面使用
private Stack<HtmlCountFragment> stackFragment = new Stack<>();//要打开新页面
3.HtmlFragment:内部webView的Framgent,用于显示页面，调用js接口
1）html_fragment.xml:FrameLayout是new WebView()的容器
<FrameLayout
android:id="@+id/html_count_web_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
2）WebView初始化
webView = new AnswerWebView(Up366Application.getGlobalContext());
webView.setHasAnim(false);
callMainFragment.setContentView(webView);
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT,
FrameLayout.LayoutParams.MATCH_PARENT);
webView.setLayoutParams(params);
webviewLayout.removeAllViews();
webviewLayout.addView(webView);
//webView显示出来
webView.setOnFinishedInterface(new AnswerWebView.IOnFinishedInterface() {
@Override
public void onFinish() {
visible(webView);
iCallFragment.dissmissProgressDialog();
jsInterface.callJSMethod("onEnterPage()");//调用Js的onEnterPage方法
}
});
jsInterface = new HtmlCountJSInterface(webView, iCallFragment);
webView.addjavascriptInterface(jsInterface, "jsCountObj");//用于得到网页端的源码
2）加载数据：
if (!StringUtil.isEmptyOrNull(loadUrl)) {
webView.loadUrl(loadUrl);
}else{
loadHtmlCountPage();
}
public void loadHtmlCountPage() {
webView.setBackgroundColor(0xFFF0F0F0);
invisible(webView);
String fileUrl = "file:///" + FileHelper.getAppRootPath() + "/src/count.html";
webView.loadUrl(fileUrl);
}
3）调用Js内部的方法实现显示、隐藏
@Override
public void onResume() {
if (jsInterface != null && resumeCount++ > 0 && callMainFragment.getCurHtmlFragment() == this) {
jsInterface.callJSMethod("onResume()");
}
}
@Override
public void onPause() {
if (callMainFragment.getCurHtmlFragment() == this) {
jsInterface.callJSMethod("onPause()");
}
}
@Override
public void onDestroy() {
jsInterface.callJSMethod("onPageExchange()");
super.onDestroy();
}
4）过渡接口
public interface ICallFragment {
void dissmissProgressDialog();
void setContentView(AnswerWebView webView);
void openNewPage(String url);
void closePage();
void updateTitle(String title);
BookInfo getBookInfo();
void disableRefresh(boolean b);
}
都调用外部Fragment的：callMainFragment.openNewPage(url);
4.HtmlJSInterface：Js调用android接口
1）初始化：
private final HtmlCountFragment.ICallFragment callFragment;
private AnswerWebView webView;
public HtmlCountJSInterface(AnswerWebView webView, HtmlCountFragment.ICallFragment callFragment) {
this.webView = webView;
this.callFragment = callFragment;
}
2）接口：
*1、js用来传递数据
// 保存页面数据接口
@JavascriptInterface
public int saveData(String data, String dataId) {
// 获取页面数据接口
@JavascriptInterface
public String loadData(String dataId) {
*2、js用来传递数据
/**
* 打开新页面
* <p>
* 2016/10/10
*
* @param url [页面路径，相对路径或者绝对路径（以 http:// 开头）]
* @param mode [0 当前webview加载新页面 1 弹出新页面]
*/
@JavascriptInterface
public String open(String url, final int mode) {
*3、js关闭页面
/**
* 关闭当前 webview
*/
@JavascriptInterface
public String closePage() {
*4、js调用android的网络请求
/**
* 通用网络请求GET方法
*/
@JavascriptInterface
public void requestDataFromServer(final int sessionId, String url) {
*5、js获取用户信息
/**
* 判断用户是否登录
*/
@JavascriptInterface
public boolean isAuthed() {//
return AuthInfo.isAuth();
}
*6、获取客户端的书籍信息
/**
* 获取客户端bookId,courseId
*
* @return getCourseBookInfo
*/
@JavascriptInterface
public String getCourseBookInfo() {
BookInfo bookInfo = callFragment.getBookInfo();
CallFragment.get一般般一直回调到能获取到数据的界面，获取到值给他。
5.AnswerWebView
initWebView
loadNextWebViewUrl：ViewPager中，预防多加载页面空白
onScrollChanged：ViewPager中的滑动出现一半的问题
setOnFinishedInterface：webView加载完成后再显示数据的回调
6.Js：Report.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content="width=device-width,initial-scale=1.0" name="viewport">
<title>Test Report</title>
<script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bodymovin/4.5.8/bodymovin.js"></script>
<link href="https://cdn.bootcss.com/tether/1.4.0/css/tether.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/tether/1.4.0/js/tether.min.js"></script>
<link href="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
<script src="https://cdn.wilddog.com/sdk/js/2.3.10/wilddog.js"></script>
<link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.structure.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.theme.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/string-format/0.5.0/string-format.min.js"></script>
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/csshake/1.5.1/csshake.min.css" rel="stylesheet">
<script src="https://yuanliwei.github.io/src/js/utils/wlog.js" charset="utf-8"></script>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
<div class="container">
<div class="row mt-4 text-center">
<div class="col-12">
<h1><i class="fa fa-users fa-lg text-warning"></i> 人口总数 <span class="badge badge-danger population">999+</span></h1>
</div>
<div id="app" class="col-12">
<h1><i class="fa fa-users fa-lg text-warning"></i> 人口总数 <span class="badge badge-danger populationVue">{{populationVue}}</span></h1>
</div>
</div>
<div class="row mt-4">
<div class="col-12">
<button type="button" class="btn btn-primary m-1" onclick="saveData()">saveData</button>
<button type="button" class="btn btn-primary m-1" onclick="loadData()">loadData</button>
<button type="button" class="btn btn-primary m-1" onclick="clearLog()">clearLog</button>
<button type="button" class="btn btn-primary m-1" onclick="showToast()">showToast</button>
<button type="button" class="btn btn-primary m-1" onclick="getHttp()">getHttp</button>
<button type="button" class="btn btn-primary m-1" onclick="openNewHtml()">openNewHtml</button>
<button type="button" class="btn btn-primary m-1" onclick="getCourseBookInfo()">getCourseBookInfo</button>
<button type="button" class="btn btn-primary m-1" onclick="getClientInfo()">getClientInfo</button>
<button type="button" class="btn btn-primary m-1" onclick="isAuthed()">isAuthed</button>
<button type="button" class="btn btn-primary m-1" onclick="getUserType()">getUserType</button>
<button type="button" class="btn btn-primary m-1" onclick="getUid()">getUid</button>
<button type="button" class="btn btn-primary m-1" onclick="updateTitle()">updateTitle</button>
<button type="button" class="btn btn-primary m-1" onclick="getChapterTasksScore()">getChapterTasksScore</button>
<button type="button" class="btn btn-primary m-1" onclick="disableRefresh()">disableRefresh</button>
<button type="button" class="btn btn-primary m-1" onclick="enableRefresh()">enableRefresh</button>
<button type="button" class="btn btn-primary m-1" onclick="judgeJsCss()">判断Http是js还是CSS</button>
<button type="button" class="btn btn-primary m-1" onclick="jumpStuStudyList()">教师端：按学生查看报告</button>
<button type="button" class="btn btn-primary m-1" onclick="jumpChapterTaskList()">教师端：按章节查看报告</button>
<button type="button" class="btn btn-primary m-1" onclick="jumpChapterTaskListByStu()">学生端：按章节查看报告</button>
</div>
</div>
<div class="row mt-2">
<div class="col-12">
<pre id="message"></pre>
</div>
</div>
<div class="col-12 text-center">
<i class="fa fa-refresh fa-spinner fa-pulse fa-5x text-info"></i>
</div>
</div>
<script type="text/javascript">
format.extend(String.prototype, {});
function saveData() {
ilog(‘saveData‘);
var data = "aaaaaaaaaaaaaa";
var dataId = "123";
jsCountObj.saveData(data,dataId);
}
function loadData() {
ilog(‘loadData‘);
var dataId = "123";
var data = jsCountObj.loadData(dataId);
ilog("data "+data);
}
function showToast() {
jsCountObj.toast(‘11111111111111111111111111111‘);
}
function disableRefresh() {
ilog(‘disableRefresh ‘)
jsCountObj.disableRefresh(1);
}
function enableRefresh() {
ilog(‘enableRefresh ‘)
jsCountObj.disableRefresh(0);
}
function ilog(msg) {
console.log(msg);
$(‘#message‘).append("\n"+msg);
wlog(msg);
}
function clearLog() {
$(‘#message‘).text(‘‘);
}
function getCourseBookInfo() {
ilog(‘getCourseBookInfo －－ ‘+jsCountObj.getCourseBookInfo());
}
function getClientInfo() {
ilog(‘getClientInfo －－ ‘+jsCountObj.getClientInfo());
}
function isAuthed() {
ilog(‘isAuthed －－ ‘+jsCountObj.isAuthed());
}
function getUserType() {
ilog(‘getUserType －－ ‘+jsCountObj.getUserType());
}
function getUid() {
ilog(‘getUid －－ ‘+jsCountObj.getUid());
}
function updateTitle() {
ilog(‘updateTitle －－ ‘+‘新标题‘);
jsCountObj.updateTitle(‘新标题‘)
}
window.onerror = function (errorMsg, url, lineNumber, colNumber, errorObj) {
ilog(‘Error: ‘ + errorMsg + ‘\n\tScript: ‘ + url + ‘\n\tLine: ‘ + lineNumber + ‘\n\tCol: ‘ + colNumber + ‘\n\tStackTrace: ‘ + errorObj);
}
function getChapterTasksScore() {
ilog(‘getChapterTasksScore -- ‘);
var courseBookInfo = JSON.parse(jsCountObj.getCourseBookInfo());
var url = ‘http://www.wj.cn/chapter-task-score/list?courseId={courseId}&bookId={bookId}‘.format(courseBookInfo);
HttpClient.GET(url, function(code, message, _data){
ilog(‘code {0}\nmessage {1} \nda ta {2}‘.format(code, message,_data));
});
}
function getHttp() {
HttpClient.GET(‘http://www.wj.cn/getAllFlipBookTypeV20.action‘,function(code, message, _data){
ilog(‘code {0}\nmessage {1} \ndata {2}‘.format(code, message,_data));
});
}
function loadPopulation() {
var data = JSON.parse(jsCountObj.getCourseBookInfo());
var url = ‘http://www.wj.cn/student-num?courseId={courseId}‘.format(data);
ilog(url);
HttpClient.GET(url,function(code, message, _data){
$(".population").text(_data);
new Vue({
el: ‘#app‘,
data: {
populationVue: _data
}
})
});
}
function onResume() {
ilog(‘onResume 做操作...‘ + document.title)
}
function onPause() {
ilog(‘onPause 做操作...‘ + document.title)
}
function onEnterPage() {
ilog(‘首次进入页面 做操作...‘ + document.title);
loadPopulation();
}
function onPageExchange() {
ilog(‘退出页面 做操作...‘ + document.title)
}
function openNewHtml() {
ilog(‘打开新页面...‘ + document.title);
jsCountObj.open("page1.html",1);
}
function jumpChapterTaskListByStu() {
var jumpData = JSON.parse(jsCountObj.getCourseBookInfo());
jumpData.uid = jsCountObj.getUid();
ilog(‘jumpChapterTaskListByStu...‘);
jsCountObj.saveData(JSON.stringify(jumpData), "jumpData");
jsCountObj.open("stu/chapter-task-tree-list-stu.html",1);
}
function jumpChapterTaskList() {
ilog(‘jumpChapterTaskList...‘);
jsCountObj.open("chapter/chapter-task-tree-list.html",1);
}
function jumpStuStudyList() {
ilog(‘jumpStuStudyList...‘);
jsCountObj.open("stu/study-list.html",1);
}
function judgeJsCss() {
var url = "https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js";
var urlArr = url.split(‘?‘);
var urls = urlArr[0].split(‘.‘);
var end = urls[urls.length-1];
return end.toLowerCase();
}
function back() {
ilog(‘返回原页面...‘ + document.title);
jsCountObj.closePage();
}
</script>
<script type="text/javascript">
var HttpClient = {
callBackMap: {},
sessionId: 1,
getClient: function () {
return jsCountObj;
},
getSessionId: function(callback) {
this.sessionId++;
this.callBackMap[this.sessionId] = callback;
return this.sessionId;
},
GET: function(url, callback) {
var sessionId = this.getSessionId(callback);
this.getClient().requestDataFromServer(sessionId, url);
},
POST: function(url, data, callback) {
var sessionId = this.getSessionId(callback);
this.getClient().submitDataForServer(sessionId, url, JSON.stringify(data));
},
onResponse: function(sessionId, data) {
var callback = this.callBackMap[sessionId];
if(callback && typeof callback == ‘function‘) {
callback(data.code, data.info, data.data);
delete this.callBackMap[sessionId];
} else {
console.error("sessionId = " + sessionId + " callback == " + callback);
return;
}
}
}
</script>
</body>
</html>
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta content="width=device-width,initial-scale=1.0" name="viewport"> <title>Test Report</title> <script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/bodymovin/4.5.8/bodymovin.js"></script> <link href="https://cdn.bootcss.com/tether/1.4.0/css/tether.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/tether/1.4.0/js/tether.min.js"></script> <link href="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script> <script src="https://cdn.wilddog.com/sdk/js/2.3.10/wilddog.js"></script> <link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.structure.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.theme.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script> <link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/string-format/0.5.0/string-format.min.js"></script> <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/csshake/1.5.1/csshake.min.css" rel="stylesheet"> <script src="https://yuanliwei.github.io/src/js/utils/wlog.js" charset="utf-8"></script> <script src="https://unpkg.com/vue/dist/vue.js"></script> </head> <body> <div class="container"> <div class="row mt-4 text-center"> <div class="col-12"> <h1><i class="fa fa-users fa-lg text-warning"></i> 人口总数 <span class="badge badge-danger population">999+</span></h1> </div> <div id="app" class="col-12"> <h1><i class="fa fa-users fa-lg text-warning"></i> 人口总数 <span class="badge badge-danger populationVue">{{populationVue}}</span></h1> </div> </div> <div class="row mt-4"> <div class="col-12"> <button type="button" class="btn btn-primary m-1" onclick="saveData()">saveData</button> <button type="button" class="btn btn-primary m-1" onclick="loadData()">loadData</button> <button type="button" class="btn btn-primary m-1" onclick="clearLog()">clearLog</button> <button type="button" class="btn btn-primary m-1" onclick="showToast()">showToast</button> <button type="button" class="btn btn-primary m-1" onclick="getHttp()">getHttp</button> <button type="button" class="btn btn-primary m-1" onclick="openNewHtml()">openNewHtml</button> <button type="button" class="btn btn-primary m-1" onclick="getCourseBookInfo()">getCourseBookInfo</button> <button type="button" class="btn btn-primary m-1" onclick="getClientInfo()">getClientInfo</button> <button type="button" class="btn btn-primary m-1" onclick="isAuthed()">isAuthed</button> <button type="button" class="btn btn-primary m-1" onclick="getUserType()">getUserType</button> <button type="button" class="btn btn-primary m-1" onclick="getUid()">getUid</button> <button type="button" class="btn btn-primary m-1" onclick="updateTitle()">updateTitle</button> <button type="button" class="btn btn-primary m-1" onclick="getChapterTasksScore()">getChapterTasksScore</button> <button type="button" class="btn btn-primary m-1" onclick="disableRefresh()">disableRefresh</button> <button type="button" class="btn btn-primary m-1" onclick="enableRefresh()">enableRefresh</button> <button type="button" class="btn btn-primary m-1" onclick="judgeJsCss()">判断Http是js还是CSS</button> <button type="button" class="btn btn-primary m-1" onclick="jumpStuStudyList()">教师端：按学生查看报告</button> <button type="button" class="btn btn-primary m-1" onclick="jumpChapterTaskList()">教师端：按章节查看报告</button> <button type="button" class="btn btn-primary m-1" onclick="jumpChapterTaskListByStu()">学生端：按章节查看报告</button> </div> </div> <div class="row mt-2"> <div class="col-12"> <pre id="message"></pre> </div> </div> <div class="col-12 text-center"> <i class="fa fa-refresh fa-spinner fa-pulse fa-5x text-info"></i> </div> </div> <script type="text/javascript"> format.extend(String.prototype, {}); function saveData() { ilog(‘saveData‘); var data = "aaaaaaaaaaaaaa"; var dataId = "123"; jsCountObj.saveData(data,dataId); } function loadData() { ilog(‘loadData‘); var dataId = "123"; var data = jsCountObj.loadData(dataId); ilog("data "+data); } function showToast() { jsCountObj.toast(‘11111111111111111111111111111‘); } function disableRefresh() { ilog(‘disableRefresh ‘) jsCountObj.disableRefresh(1); } function enableRefresh() { ilog(‘enableRefresh ‘) jsCountObj.disableRefresh(0); } function ilog(msg) { console.log(msg); $(‘#message‘).append("\n"+msg); wlog(msg); } function clearLog() { $(‘#message‘).text(‘‘); } function getCourseBookInfo() { ilog(‘getCourseBookInfo －－ ‘+jsCountObj.getCourseBookInfo()); } function getClientInfo() { ilog(‘getClientInfo －－ ‘+jsCountObj.getClientInfo()); } function isAuthed() { ilog(‘isAuthed －－ ‘+jsCountObj.isAuthed()); } function getUserType() { ilog(‘getUserType －－ ‘+jsCountObj.getUserType()); } function getUid() { ilog(‘getUid －－ ‘+jsCountObj.getUid()); } function updateTitle() { ilog(‘updateTitle －－ ‘+‘新标题‘); jsCountObj.updateTitle(‘新标题‘) } window.onerror = function (errorMsg, url, lineNumber, colNumber, errorObj) { ilog(‘Error: ‘ + errorMsg + ‘\n\tScript: ‘ + url + ‘\n\tLine: ‘ + lineNumber + ‘\n\tCol: ‘ + colNumber + ‘\n\tStackTrace: ‘ + errorObj); } function getChapterTasksScore() { ilog(‘getChapterTasksScore -- ‘); var courseBookInfo = JSON.parse(jsCountObj.getCourseBookInfo()); var url = ‘http://school.up366.cn/client/dashboard-v2/teacher/chapter-task-score/list?courseId={courseId}&bookId={bookId}‘.format(courseBookInfo); HttpClient.GET(url, function(code, message, _data){ ilog(‘code {0}\nmessage {1} \nda ta {2}‘.format(code, message,_data)); }); } function getHttp() { HttpClient.GET(‘http://feishu.up366.cn/mobile/flipbook/getAllFlipBookTypeV20.action‘,function(code, message, _data){ ilog(‘code {0}\nmessage {1} \ndata {2}‘.format(code, message,_data)); }); }
function loadPopulation() { var data = JSON.parse(jsCountObj.getCourseBookInfo()); var url = ‘http://school.up366.cn/client/dashboard-v2/teacher/course/student-num?courseId={courseId}‘.format(data); ilog(url); HttpClient.GET(url,function(code, message, _data){ $(".population").text(_data); new Vue({ el: ‘#app‘, data: { populationVue: _data } }) });
} function onResume() { ilog(‘onResume 做操作...‘ + document.title) } function onPause() { ilog(‘onPause 做操作...‘ + document.title) } function onEnterPage() { ilog(‘首次进入页面 做操作...‘ + document.title); loadPopulation(); }
function onPageExchange() { ilog(‘退出页面 做操作...‘ + document.title) } function openNewHtml() { ilog(‘打开新页面...‘ + document.title); jsCountObj.open("page1.html",1); } function jumpChapterTaskListByStu() { var jumpData = JSON.parse(jsCountObj.getCourseBookInfo()); jumpData.uid = jsCountObj.getUid(); ilog(‘jumpChapterTaskListByStu...‘); jsCountObj.saveData(JSON.stringify(jumpData), "jumpData"); jsCountObj.open("stu/chapter-task-tree-list-stu.html",1); } function jumpChapterTaskList() { ilog(‘jumpChapterTaskList...‘); jsCountObj.open("chapter/chapter-task-tree-list.html",1); } function jumpStuStudyList() { ilog(‘jumpStuStudyList...‘); jsCountObj.open("stu/study-list.html",1); } function judgeJsCss() { var url = "https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"; var urlArr = url.split(‘?‘); var urls = urlArr[0].split(‘.‘); var end = urls[urls.length-1]; return end.toLowerCase(); } function back() { ilog(‘返回原页面...‘ + document.title); jsCountObj.closePage(); }
</script> <script type="text/javascript"> var HttpClient = { callBackMap: {}, sessionId: 1, getClient: function () { return jsCountObj; }, getSessionId: function(callback) { this.sessionId++; this.callBackMap[this.sessionId] = callback; return this.sessionId; }, GET: function(url, callback) { var sessionId = this.getSessionId(callback); this.getClient().requestDataFromServer(sessionId, url); }, POST: function(url, data, callback) { var sessionId = this.getSessionId(callback); this.getClient().submitDataForServer(sessionId, url, JSON.stringify(data)); }, onResponse: function(sessionId, data) {
var callback = this.callBackMap[sessionId]; if(callback && typeof callback == ‘function‘) { callback(data.code, data.info, data.data); delete this.callBackMap[sessionId]; } else { console.error("sessionId = " + sessionId + " callback == " + callback); return; } } }
</script> </body></html>
以上是关于项目中Android与Js交互的主要内容，如果未能解决你的问题，请参考以下文章
WebViewJavascriptBridge Android端 乱码问题（webview与页面js交互 传输参数乱码）