无法在phonegap中显示联系人数据图像

时间:2013-08-22 08:16:13

标签: android cordova

我正在尝试使用PhoneGapandroid的{​​{1}}中的以下代码来获取联系人资料图片,即联系人数据的头像 但我得到了以下网址作为回报,我不知道应该如何在img标记中显示它。

代码

  var defaultImagePath ='../resources/images/default_usr.png'

 var img = contacts[i].photos  != null ? 
     contacts[i].photos[0].value : defaultImagePath;

返回的网址是

  

内容://com.android.contacts/contacts/739/photo

现在最终在列表中我试图使用

显示它
<img src="content://com.android.contacts/contacts/739/photo"/>

但它没有显示任何东西?那么我将如何显示联系人图片?

我有最新的PhoneGap版本

我用过

  

window.resolveLocalFileSystemURI(contacts [i] .photos [0] .value,this.onResolveSuccess,this.fail);

但是我遇到了以下运行时错误

JNI ERROR (app bug): attempt to use stale local reference in phonegap

即使我在android

中指定了以下权限
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> 
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission android:name="android.permission.BROADCAST_STICKY" />

更新

loadContacts:function(){



    var arr = [];

    var filter = ["displayName", "name", "phoneNumbers","emails","addresses","photos"];
    var options = new ContactFindOptions();
    options.filter=""; 
    options.multiple=true;    

    navigator.contacts.find(filter,
              function(contacts) {

                for (var i = 0; i < contacts.length; i++) {
                  if (contacts[i].photos) {


                     for (var j = 0; j < contacts[i].photos.length; j++) {



                                returnValidPhoto(contacts[i].photos[j], function(answer) {

                                        console.log(answer);

                                        if(contacts[i].photos[j]!=null);
                                         contacts[i].photos[j].value=answer;


                                    });




                                 var contactData = new ContactData("Name" ,
                                                    "09090909",
                                                     contacts[i].photos[j].value);

                                arr.push(contactData);




                  }
                }

            }
            Ext.getStore('ContactStore').setData(arr);

               // document.getElementById("contactdata").innerHTML = data; 
            }, function(err) {
                alert(err);
              },options);



    }

这是图像功能

 function returnValidPhoto(url,callback){

    console.log("IMAGE CALLED");
    var img = new Image();
    img.onload = function() {
    //Image is ok

        console.log("IMAGE OK");

        callback(url.value);
    };
    img.onerror = function(err) {
        //Returning a default image for users without photo 

                console.log("IMAGE FAILED");

        url.value = "/resources/images/default_usr.png";
        callback("/resources/images/default_usr.png");
    }
    img.src = url.value;
};

3 个答案:

答案 0 :(得分:2)

我几天前遇到过这个问题,最后找到了解决方法。

var returnValidPhoto=function(url,callback){
    var img = new Image();
    img.onload = function() {
    //Image is ok
        callback(url);
    };
    img.onerror = function(err) {
        //Returning a default image for users without photo 
        callback("image_for_no_avatar.png");
    }
    img.src = url;
};

//Example usage
returnValidphoto(contact.photos[0].value, function(answer) {
    contact.photos[0].value=answer;
}

答案 1 :(得分:1)

请试一试。

     function onDeviceReady() {
            window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, fail);
            window.resolveLocalFileSystemURI("content://com.android.contacts/contacts/739/photo", onResolveSuccess, fail);
        }

        function onFileSystemSuccess(fileSystem) {
            console.log(fileSystem.name);
        }

        function onResolveSuccess(fileEntry) {
            console.log(fileEntry.name);
        }

        function fail(evt) {
            console.log(evt.target.error.code);
        }

答案 2 :(得分:0)

在AndroidManifest.xml旁边,project\res\xml\config.xml

有权限使用phonegap
 <plugins>
    <plugin name="App" value="org.apache.cordova.App"/>
    <plugin name="Device" value="org.apache.cordova.Device"/>
    <plugin name="Camera" value="org.apache.cordova.CameraLauncher"/>
    <plugin name="Contacts" value="org.apache.cordova.ContactManager"/>
    <plugin name="File" value="org.apache.cordova.FileUtils"/>
    <plugin name="Storage" value="org.apache.cordova.Storage"/>
    ...
  </plugins>

如果为JNI ERROR授予了所有权限,请检查该错误,该错误可能是权限错误。

对于图片,<img src="content://com.android.contacts/contacts/739/photo"/>确保联系人ID 739已设置图片,因为phonegap get_contact函数始终返回网址格式,如content://com.android.contacts/contacts/XXX/photo,其中XXX是联系人ID,无论是否设置了图片

当我在android 4上使用phonegap 2.5进行测试时,<img src="content://com.android.contacts/contacts/739/photo"/>正常工作,联系人图片或内部带有问号的小蓝色方块 - 如果uri不包含图片