функция массива javascript не работает

Question

Я использую laravel и vuejs для создания приложения чата.Я зашифровал свой ответ в laravel, выполнив подобное, поскольку я не хочу, чтобы кто-либо также видел мой ответ в консоли: -

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);
}

Теперь, когда я хочу получить доступ к этому значению для отображения данных в vue js,Я делаю что-то вроде этого: -

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;
            });

Здесь я получаю данные в переменную encryptData в виде массива объектов, но продолжаю дальше, каждый раз, когда я получаю эту ошибку: -

Uncaught (in promise) TypeError: encryptData.map is not a function

Пожалуйста, помогите мне найти решение, спасибо.

Answer 1

Вы, вероятно, пропускаете вызов 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-скрипт возвращает данные в кодировке base64,в формате JSON обратный вызов
• axios.get получает его в виде строки в кодировке base64,
• atob base64-декодирует строку (на данный момент это строка),
• JSON.parse преобразует его обратно в фактические данные.