如果要做网站封装APP的话，其实非常简单的，网上很多开发者服务平台都有这个功能，操作非常简单，基本上一分钟不到就可以封装好。
在亥著开发者中心找到【产品概览】-【封装APP】
输入APP名称，网站网址，选择图标，也可以自己上传自己的图片。
然后根据自己的需要选择选择功能插件，像扫一扫、微信分享、下拉刷新这些功能都是免费添加的。
//app.js
App({
onLaunch: function () {
let App = this
// 设置api地址
App.setApiRoot()
},
globalData: {
userInfo: null
},
api_root: '', // api地址
appid:'',
/**
* 显示失败提示框
*/
showError(msg, callback) {
wx.showModal({
title: '友情提示',
content: msg,
showCancel: false,
success(res) {
callback && callback()
}
})
},
/**
* 设置api地址
*/
setApiRoot() {
let App = this
// App.api_root = config.config.host
let extConfig = wx.getExtConfigSync? wx.getExtConfigSync(): {}
console.log(extConfig)
App.appid = extConfig.attr.appid
App.api_root = extConfig.attr.host
},
/**
* get请求
*/
_get(url, data, success, fail, complete, check_login) {
let App = this
wx.showNavigationBarLoading()
// 构造请求参数
data = Object.assign({
token: wx.getStorageSync('token'),
appid:App.appid
}, data)
// if (typeof check_login === 'undefined')
// check_login = true
console.log(App.api_root)
// 构造get请求
let request = () => {
data.token = wx.getStorageSync('token')
wx.request({
url: App.api_root + url,
header: {
'content-type': 'application/json'
},
data,
success(res) {
if (res.statusCode !== 200 || typeof res.data !== 'object') {
console.log(res)
App.showError('网络请求出错')
return false
}
if (res.data.code === -1) {
// 登录态失效, 重新登录
wx.hideNavigationBarLoading()
App.doLogin(() => {
App._get(url, data, success, fail)
})
} else if (res.data.code === 0) {
App.showError(res.data.msg)
return false
} else {
success && success(res.data)
}
},
fail(res) {
// console.log(res)
App.showError(res.errMsg, () => {
fail && fail(res)
})
},
complete(res) {
wx.hideNavigationBarLoading()
complete && complete(res)
},
})
}
// 判断是否需要验证登录
check_login ? App.doLogin(request) : request()
},
/**
* post提交
*/
_post_form(url, data, success, fail, complete) {
wx.showNavigationBarLoading()
let App = this
// 构造请求参数
data = Object.assign({
token: wx.getStorageSync('token'),
appid:App.appid
}, data)
data.token = wx.getStorageSync('token')
wx.request({
url: App.api_root + url,
header: {
'content-type': 'application/x-www-form-urlencoded',
},
method: 'POST',
data,
success(res) {
if (res.statusCode !== 200 || typeof res.data !== 'object') {
App.showError('网络请求出错')
return false
}
if (res.data.code === -1) {
// 登录态失效, 重新登录
App.doLogin(() => {
App._post_form(url, data, success, fail)
})
return false
} else if (res.data.code === 0) {
App.showError(res.data.msg, () => {
fail && fail(res)
})
return false
}
success && success(res.data)
},
fail(res) {
// console.log(res)
App.showError(res.errMsg, () => {
fail && fail(res)
})
},
complete(res) {
wx.hideLoading()
wx.hideNavigationBarLoading()
complete && complete(res)
}
})
},
/**
* 验证登录
*/
checkIsLogin() {
return wx.getStorageSync('token') != ''
},
/**
* 授权登录
*/
doLogin(callback) {
let App = this
// if (e.detail.errMsg !== 'getUserInfo:ok') {
// return false
// }
wx.showLoading({
title: "加载数据中...",
mask: true
})
// 执行微信登录
wx.login({
success(res) {
// 发送用户信息
App._post_form('login', {
code: res.code,
}, result => {
// 记录token user_id
wx.setStorageSync('token', result.data.token,)
// 执行回调函数
callback && callback()
}, false, () => {
wx.hideLoading()
})
}
})
}
})
用webview打开网页，然后通过webview与app的本地java代码进行交互。1、设置webview支持Javascript
mWebview.getSettings().setJavaScriptEnabled(true)
2、加进一个回调的代理类JavaScriptInterface，并给它一个调用的名称：ncp
mWebView.addJavascriptInterface(new JavaScriptInterface(), "ncp")
final class JavaScriptInterface {
public int callOnJs() {
return 1000
}
public void callOnJs2(String mode) {
//TODO
}
}
3、JS页面调用android方法
<script type="text/javascript">
window.onload = function(){
var _int_value = window.ncp.callOnJs() //通过ncp代理调用android方法
}
</script>
