javascript array.map函数不起作用

时间:2018-10-07 12:02:28

标签: javascript laravel vue.js

我正在使用laravel和vuejs创建聊天应用程序。我已经通过laravel加密了我的回复,因为我不希望任何人也在控制台中看到我的回复:-

$ curl -u "username:password" "https://api.bitbucket.org/2.0/users/alik-takipi/search/code?search_query=bitbucket-search-test"
{"query_substituted": false, "pagelen": 10, "values": [], "page": 1, "size": 0}

现在,当我希望访问该值以在vue js中显示数据时,我正在执行以下操作:-

public function get()
{
    $contacts = User::where('id', '!=', auth()->id())->get();

    $unreadIds = Message::select(\DB::raw('`from` as sender_id,count(`from`) as messages_count'))
        ->where('to', auth()->id())
        ->where('read', false)
        ->groupBy('from')
        ->get();

    $contacts = $contacts->map(function($contact) use ($unreadIds) {
        $contactUnread = $unreadIds->where('sender_id', $contact->id)->first();

        $contact->unread = $contactUnread ? $contactUnread->messages_count : 0;

        return $contact;
    });

    $contacts = base64_encode($contacts);
    return response()->json($contacts);
}

在这里,我以对象数组的形式获取cryptoData变量中的数据,但是每次遇到此错误时,都会继续进行操作:-

axios.get(this.globalUrl+'/contacts')
            .then((response) => {
                let encryptData = atob(response.data);
                console.log(encryptData);

                //data received after de-converting
               /*[{"id":2,"phone":null,"name":"Casimir Morar MD","email":"clint.haag@hartmann.info","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":3,"phone":null,"name":"Lina Prosacco","email":"okeefe.camila@gmail.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":4,"phone":null,"name":"Miss Aglae Emard DDS","email":"qcarter@yahoo.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":5,"phone":null,"name":"Demarco Kilback","email":"kessler.coy@swift.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":6,"phone":null,"name":"Tyrell Ziemann Sr.","email":"clementina.kautzer@price.org","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":7,"phone":null,"name":"Ella Hand","email":"areichel@watsica.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":8,"phone":null,"name":"Dr. Maxie O'Hara DDS","email":"wallace31@yahoo.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":9,"phone":null,"name":"Mrs. Mattie Monahan IV","email":"ernser.pasquale@hotmail.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":10,"phone":null,"name":"Bradly Crona","email":"lehner.cordie@pagac.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0},{"id":11,"phone":null,"name":"Orland Kihn","email":"jacobs.wyman@yahoo.com","profile_image":null,"created_at":null,"updated_at":null,"unread":0}]*/

                let finalArray = encryptData.map(function (obj) {
                    return obj;
                    //this.contacts.push(obj);

                });
                console.log(finalArray);
                this.contacts = finalArray;
            });

请帮助我找到解决方案,谢谢。

1 个答案:

答案 0 :(得分:3)

您可能错过了一个JSON.parse通话:

axios.get(this.globalUrl + '/contacts')
  .then((response) => {
    let encryptData = JSON.parse(atob(response.data));
    let finalArray = encryptData.map(function(obj) {
      // ...
    });
    this.contacts = finalArray;
  });

基本上:

  • 您的PHP脚本以JSON格式返回base64编码的数据,
  • axios.get的回调将其作为base64编码的字符串接收,
  • atob base64解码字符串(目前仍为字符串),
  • JSON.parse将其转换回实际数据。