Cordova-plugin-firebase: Изменение значка push-уведомления - проблема с пустым значком Android в 2018 году

Созданный на 6 июл. 2018  ·  22Комментарии  ·  Источник: arnesson/cordova-plugin-firebase

Всем привет,

Для людей, использующих этот плагин с Cordova 8+, вы можете обнаружить, что изменение значка уведомления не работает, и вы нажимаете старую проблему «значок уведомления - пустой квадрат» на Android. Это происходит потому, что значки уведомлений Android должны быть простой одноцветной формы на прозрачном фоне, и если вы не указали такой значок, вместо этого Android будет использовать значок приложения. Скорее всего, это полные и красочные квадраты без прозрачного фона.

Это очень раздражает при установке нового проекта Ionic 3 и попытке использовать этот плагин.

Readme здесь atm не описывает процесс правильной смены значка. Вот шаги, которые необходимо предпринять, чтобы изменить значок:

0) Прекратите гуглить и выдергивать волосы. Следуйте этой инструкции шаг за шагом, и вы заставите ее работать, поверьте мне.
1) Подготовьте версию значка вашего приложения, которая представляет собой только одноцветную фигуру на прозрачном фоне.
2) Перейдите сюда: http://romannurik.github.io/AndroidAssetStudio/icons-notification.html#source.type=clipart&source.clipart=ac_unit&source.space.trim=1&source.space.pad=0&name=notification_icon нажмите "изображение" в верхнем левом углу загрузите свой значок, обрежьте его / добавьте отступы, если необходимо
3) Если все в порядке, нажмите стрелку в правом верхнем углу, чтобы загрузить «доступные» папки. Он предоставит вам zip-архив с папкой res внутри и 5 папками drawable-xxx каждая из которых имеет разный размер вашего значка.
4) Скопируйте эти доступные папки куда-нибудь в свой проект. Для себя я скопировал их рядом с ресурсами значка и заставки: project-root/resources/android/notification_icon
5) Настройте файл config.xml для копирования этих файлов в приложение Android с помощью директивы <resource-file /> . Обратите внимание, что начиная с Crodova 8.x правильный целевой путь - app/src/main/res . На cordova <8 это было просто res (поскольку раньше файлы ресурсов хранились в каталоге platforms/android/res а теперь они находятся в platforms/android/app/main/res ). В большинстве «решенных» проблем онлайн на пустом значке уведомления Android об этом не упоминается.

<platform name="android">
(...) 
  <resource-file src="resources/android/notification_icon/drawable-mdpi/notification_icon.png" target="app/src/main/res/drawable-mdpi/notification_icon.png" />
  <resource-file src="resources/android/notification_icon/drawable-hdpi/notification_icon.png" target="app/src/main/res/drawable-hdpi/notification_icon.png" />
  <resource-file src="resources/android/notification_icon/drawable-xhdpi/notification_icon.png" target="app/src/main/res/drawable-xhdpi/notification_icon.png" />
  <resource-file src="resources/android/notification_icon/drawable-xxhdpi/notification_icon.png" target="app/src/main/res/drawable-xxhdpi/notification_icon.png" />
  <resource-file src="resources/android/notification_icon/drawable-xxxhdpi/notification_icon.png" target="app/src/main/res/drawable-xxxhdpi/notification_icon.png" />
</platform>

6) Теперь, когда у вас есть значок в приложении как доступный ресурс, вам нужно заставить приложение его использовать. Независимо от того, что написано здесь в readme, автоматическое обнаружение доступного ресурса с именем «notification_icon» у меня не сработало. Я не совсем уверен, почему, потому что, похоже, здесь есть кодовая база: https://github.com/arnesson/cordova-plugin-firebase/blob/master/src/android/FirebasePluginMessagingService.java#L140, но я предполагая, что что-то изменилось с обнаружением ресурсов в последних версиях Android.
7) Из-за этого единственным другим решением, которое я мог использовать, была отправка параметра icon из бэкэнда при отправке push-уведомления в firebase. Обратите внимание, что их api, вероятно, претерпевает некоторые изменения, потому что у него есть проблемы с правильным объединением частей полезной нагрузки notification и android . По этой причине вам нужно добавить параметр значка в часть notification файла json. Использование специальных параметров Android не работает.

Таким образом, полезная нагрузка уведомления, которую вы отправляете в firebase из своего бэкэнда, должна выглядеть примерно так: ЭТО ЕДИНСТВЕННАЯ ВЕРСИЯ, КОТОРАЯ РАБОТАЕТ

{
  notification: {
    body: 'Imma push your notification if you know what i mean!',
    icon: 'notification_icon',
  },
  data: { someExtraData: 'goes_here' }
}

Позвольте мне повторить - ИСПОЛЬЗОВАНИЕ СПЕЦИАЛЬНЫХ ПАРАМЕТРОВ ANDROID НЕ РАБОТАЕТ С FIREBASE по состоянию на июль 2018 года - НИЖЕ НЕ РАБОТАЕТ, И СИМВОЛ УВЕДОМЛЕНИЯ НЕ ИЗМЕНЯЕТСЯ, НЕЗАВИСИМО ОТ ДОКУМЕНТАЦИИ :

{
  notification: {
    body: 'Imma push your notification if you know what i mean!'
  },
  data: { someExtraData: 'goes_here_if_you_need_it' },
  android: { 
    icon: 'notification_icon'
  } 
}

8) После того, как все шаги выполнены, вы готовы протестировать новый значок. Я настоятельно рекомендую протестировать его в эмуляторе Android - некоторые скины Android берут на себя панель уведомлений и используют значок приложения независимо от того, что вы установили (например, MIUI от xiaomi). Я также обнаружил, что иногда значки кешируются. По этой причине тестирование в симуляторе на только что созданном AVD - ваш самый безопасный выбор. Удалите приложение вручную между тестовыми запусками и перезапустите симулятор / устройство, чтобы избежать проблем с кешированием.

Я надеюсь, что эта длинная статья поможет другим в будущем, поскольку количество препятствий, которые нужно преодолеть, чтобы изменить маленький значок 10x10, просто чертовски велико ...

Самый полезный комментарий

Пожалуйста, проверьте, добавлен ли этот код в config.xml <platform name="android"> тег

<config-file parent="/manifest/application/" target="app/src/main/AndroidManifest.xml">
    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
</config-file>

Это работает для меня, отправляя через панель обмена сообщениями Firebase Cloud или серверную часть без значка на полезной нагрузке.
Пожалуйста, оставьте здесь свой отзыв.
Если это сработает, ваше руководство, добавленное к этому коду, поможет многим людям и должно открыть PR, чтобы добавить его в README.

Все 22 Комментарий

Пожалуйста, проверьте, добавлен ли этот код в config.xml <platform name="android"> тег

<config-file parent="/manifest/application/" target="app/src/main/AndroidManifest.xml">
    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
</config-file>

Это работает для меня, отправляя через панель обмена сообщениями Firebase Cloud или серверную часть без значка на полезной нагрузке.
Пожалуйста, оставьте здесь свой отзыв.
Если это сработает, ваше руководство, добавленное к этому коду, поможет многим людям и должно открыть PR, чтобы добавить его в README.

Спасибо @madsheep !! Вы спасли мою жизнь !!

Привет, спасибо за моральную поддержку и за то, что дало мне ощущение, что я не единственный, кто оказался в этой неразберихе. Однако, к сожалению, я снова вернулась к предыдущему шагу 0, по пути потеряв волосы.

Когда я пытаюсь отправить уведомление с помощью метода http / post, я получаю сообщение об ошибке api firebase, что json недействителен. Я пробовал оба способа:

Это то, что я получаю, когда включаю значок как message: { notification: { icon: 'notification_icon', ... }, ... }

Error code=400, message=Invalid JSON payload received. Unknown name "icon" at 'message.notification': Cannot find field., status=INVALID_ARGUMENT, details=[@type=type.googleapis.com/google.rpc.BadRequest, fieldViolations=[field=message.notification, description=Invalid JSON payload received. Unknown name "icon" at 'message.notification': Cannot find field.]]

Это сообщение, которое я получаю, когда включаю значок как message: { android: { icon: 'notification_icon' }, ... }

Error code=400, message=Invalid JSON payload received. Unknown name "icon" at 'message.android': Cannot find field., status=INVALID_ARGUMENT, details=[@type=type.googleapis.com/google.rpc.BadRequest, fieldViolations=[field=message.android, description=Invalid JSON payload received. Unknown name "icon" at 'message.android': Cannot find field.]]

но, возможно, я использую это в неправильном контексте (наш внутренний облачный код отправляет уведомление клиентским приложениям с помощью облачных сообщений firebase).

это сработало для меня (я отправляю уведомления с помощью функций firebase):
const payload = { notification: { title: ........, body: ........., icon: 'notification_icon' } };

Спасибо, это привело к первой из двух ошибок. Я использую службу REST через библиотеку javascript / request и отправляю в соответствии с форматом https://firebase.google.com/docs/cloud-messaging/js/first-message . Я полагаю, что формат сообщения / уведомления описан в https://firebase.google.com/docs/reference/fcm/rest/v1/projects.messages#Notification .

Фактически, когда я это читал, это наводило на мысль, что значок должен быть в message.android.notification.icon , то есть на один уровень глубже.

Я только что попробовал, и у меня это действительно работает! Итак, я полагаю, это зависит от протокола сервера, как должна быть структурирована полезная нагрузка ...

Спасибо всем за это обсуждение. В конце концов, это привело к тому, что я перестала выдергивать волосы ...

закрытие как решено

@madsheep Это не работает. После добавления значка под уведомлением в облачной функции появляется следующая ошибка:

{ Error: Invalid JSON payload received. Unknown name "icon" at 'message.notification': Cannot find field

errorInfo:
{код: 'сообщение / недопустимый-аргумент',
message: 'Получены недопустимые данные JSON. Неизвестное имя "icon" в 'message.notification': Поле не найдено. ' },
codePrefix: 'messaging'}

попробуйте message.android.notification.icon вместо message.notification.icon .

@madsheep @guilhermehtk У меня сработало! Спасибо.

Пожалуйста, проверьте, добавлен ли этот код в config.xml <platform name="android"> тег

<config-file parent="/manifest/application/" target="app/src/main/AndroidManifest.xml">
    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
</config-file>

Это работает для меня, отправляя через панель обмена сообщениями Firebase Cloud или серверную часть без значка на полезной нагрузке.
Пожалуйста, оставьте здесь свой отзыв.
Если это сработает, ваше руководство, добавленное к этому коду, поможет многим людям и должно открыть PR, чтобы добавить его в README.

Ты сделал мой день,

если какая-либо проблема в сборке, например

AAPT: ошибка: несвязанный префикс.

затем попробуйте добавить

xmlns: android = " http://schemas.android.com/apk/res/android "

атрибут должен быть добавлен в кореньтег внутри config.xml

ты спас мне день!

Для всех, кто столкнулся с этой проблемой в 2019 году с версией Android 7.1.1, папка ресурсов, похоже, изменилась !!

Проверив студию Android и сгенерированные файлы, вот что сработало для меня:

<resource-file src="resources/android/notification/notification_icon.png" target="app/src/main/res/drawable/notification_icon.png" />
<config-file parent="/manifest/application/" target="app/src/main/AndroidManifest.xml">
            <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
</config-file>

1-я строка - важная часть, так как для меня это было неправильно.

@alarv Значок не отображается для некоторых телефонов Android, пожалуйста, помогите.

Привет @bioyeneye какие модели? На какой версии Android они работают? Сток или другое?

@bioyeneye У меня есть другое решение для Ionic 4, чтобы значки работали на всех устройствах Android.
Я использую не png для значка, а XML. Я использую ловушку, чтобы включить это в следующие каталоги:

'res/drawable-hdpi',
'res/drawable-mdpi',
'res/drawable-xhdpi',
'res/drawable-xxhdpi',
'res/drawable-xxxhdpi',
'res/mipmap-hdpi',
'res/mipmap-mdpi',
'res/mipmap-xhdpi',
'res/mipmap-xxhdpi',
'res/mipmap-xxxhdpi'

создать пример файла:
android_notification_resources.js

В этом новом файле ловушек добавьте:


// НАЧИНАТЬ
const fs = require ("fs");
const path = require ("путь");
const Q = require ("q");

var sourceDir = 'ресурсы / android / notification_icon'; // здесь находится ваш значок
var platformDir = 'платформы / android / app / src / main /';
var resourceDirs = [
'res / drawable-hdpi',
'res / drawable-mdpi',
'res / drawable-xhdpi',
'res / drawable-xxhdpi',
'res / drawable-xxxhdpi',
'res / mipmap-hdpi',
'res / mipmap-mdpi',
'res / mipmap-xhdpi',
'res / mipmap-xxhdpi',
'res / mipmap-xxxhdpi'
];

module.exports = function (ctx) {

if (ctx.opts.platforms.indexOf ('android') <0) {
возвращение;
}

var deferred = Q.defer ();
var androidPlatformDir = path.join (ctx.opts.projectRoot, platformDir);
var customResourcesDir = path.join (ctx.opts.projectRoot, sourceDir);

функция copy (src, dest) {
var deferred = Q.defer ();

fs.stat(src, function(err, stats) {
  if (err || !stats.isFile()) {
    return deferred.reject(err);
  }

  fs.stat(path.dirname(dest), function(err, stats) {
    if (err || !stats.isDirectory()) {
      return deferred.reject(err);
    }

    var rs = fs.createReadStream(src);

    rs.on('error', function(err) {
      console.error(err.stack);
      deferred.reject(err);
    });

    var ws = fs.createWriteStream(dest);

    ws.on('error', function(err) {
      console.error(err.stack);
      deferred.reject(err);
    });

    ws.on('close', function() {
      deferred.resolve();
    });

    rs.pipe(ws);
  });
});

return deferred.promise;

}

fs.stat (customResourcesDir, function (err, stats) {
if (err ||! stats.isDirectory ()) {
вернуть deferred.resolve ();
}

fs.readdir(customResourcesDir, function(err, files) {
  var copies = [];

  for (var i in files) {
    for (var j in resourceDirs) {
      var filePath = path.join(ctx.opts.projectRoot, sourceDir, files[i]);
      var destPath = path.join(androidPlatformDir, resourceDirs[j], files[i]);

      copies.push([filePath, destPath]);
    }
  }

  copies.map(function(args) {
    return copy.apply(copy, args);
  });

  Q.all(copies).then(function(r) {
    deferred.resolve();
  }, function(err) {
    console.error(err.stack);
    deferred.reject(err);
  });
});

});

вернуть deferred.promise;
}
// КОНЕЦ


в вашем config.xml добавьте эту строку, чтобы включить ваш хук:

Хук будет копировать ваш значок из папки ресурсов и добавлять его в разные папки с чертежами. Я сделал это, чтобы убедиться, что он работает на всех устройствах. Все идет нормально.

Сообщите мне, сработало ли это для вас! ваше здоровье

@RobinGiel Спасибо, я использую ionic 3, это сработает?

Привет @Flucadetena
Android 9
Платформы Cordova: android 7.1.1

@bioyeneye Я тоже использую ionic 3. Я все проверю и дам знать. ;)

@bioyeneye Да, вам придется изменить несколько строк из крючка.

var sourceDir = 'ресурсы / android / notification_icon';
var platformDir = 'платформы / android';

и, возможно, вместо использования const Q = require ("q"); удалите эту строку и используйте ее здесь .. пример:

module.exports = function (ctx) {

if (ctx.opts.platforms.indexOf ('android') <0) {
возвращение;
}

var Q = ctx.requireCordovaModule ('q'); // используйте это здесь
var deferred = Q.defer ();
var androidPlatformDir = path.join (ctx.opts.projectRoot, platformDir);
var customResourcesDir = path.join (ctx.opts.projectRoot, sourceDir);


Добавьте в config.xml один и тот же пример хука before_build и before_run:

<hook type="before_run"         src="hooks/android_notification_resources.js" />
<hook type="before_build"       src="hooks/android_notification_resources.js" />

Пожалуйста, проверьте, добавлен ли этот код в config.xml <platform name="android"> тег

<config-file parent="/manifest/application/" target="app/src/main/AndroidManifest.xml">
    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon" />
</config-file>

Это работает для меня, отправляя через панель обмена сообщениями Firebase Cloud или серверную часть без значка на полезной нагрузке.
Пожалуйста, оставьте здесь свой отзыв.
Если это сработает, ваше руководство, добавленное к этому коду, поможет многим людям и должно открыть PR, чтобы добавить его в README.

Ты сделал мой день,

если какая-либо проблема в сборке, например

AAPT: ошибка: несвязанный префикс.

затем попробуйте добавить

xmlns: android = " http://schemas.android.com/apk/res/android "

атрибут должен быть добавлен к корневому тегу внутри config.xml

У меня это работает, но значок кажется невероятно маленьким. Какой правильный размер файла мы должны использовать?

Изменить: я добавил 256x256, но все еще показывает крошечную точку в строке состояния. перетаскивание строки состояния вниз показывает строку чуть большего размера

ЭТО

Ты мой спасатель !! Спасибо!!!
Примечания:
Я добавляю цвет: '# e50012' в раздел уведомлений, чтобы изменить цвет значка (измените его на любой ваш цвет).
бывший:
{
"name": "my_notification",
"уведомление": {
"body": "Уведомление",
"title": "Название уведомления",
"цвет": "# e50012"
},
"данные":{ ... }
}

Была ли эта страница полезной?
0 / 5 - 0 рейтинги

Смежные вопросы

Zrnik picture Zrnik  ·  3Комментарии

arunkatariaoodles picture arunkatariaoodles  ·  4Комментарии

danielpalen picture danielpalen  ·  5Комментарии

matthitachi picture matthitachi  ·  5Комментарии

stephan-nordnes-eriksen picture stephan-nordnes-eriksen  ·  5Комментарии