Breaking News

Firebase Push notiication with Image

In this, we will send Firebase push Notification with an image to our Android Application.



To send Notification with an Image to our Android Application.

  • Open Android Studio and create a new Project
  • Then open Tools -> Firebase
  • Open Firebase through Android Studio. Tools -> Firebase
    Tools -> Firebase
  • From Firebase Menu, click on cloud Messaging

  • Then connect your app to firebase
Connect your Android App to firebase
Connect your app to firebase


  • Then Add Fcm To Your App
Add FCM to your App
Add FCM to your App


  • Then Create a new Service called MyService and extends the Firebase Messaging Service in it.
  • Code for Myservice.java written below.
Create a Service in Android Studio
Create a Service Class

  • Then Copy Intent-Filter code from 3rd step of FCM Tutorial and copy in the manifest.
AndroidManifest.xml
 <service  
       android:name=".MyService"  
       android:enabled="true"  
       android:exported="true">  
       <intent-filter>  
         <action android:name="com.google.firebase.MESSAGING_EVENT" />  
       </intent-filter>  
     </service>  


  • Then Create a new service called MyFirebaseInstanceId Service
MyfirebaseInstanceIdService.java
 package studio.harpreet.myfirstnotification;  
 import android.app.Service;  
 import android.content.Intent;  
 import android.os.IBinder;  
 import android.util.Log;  
 import com.google.firebase.messaging.FirebaseMessagingService;  
 public class MyfirebaseInstanceIdService extends FirebaseMessagingService {  
   public MyfirebaseInstanceIdService() {  
   }  
   @Override  
   public void onNewToken(String token) {  
     Log.d("Fcm Token", "Refreshed token: " + token);  
     // If you want to send messages to this application instance or  
     // manage this apps subscriptions on the server side, send the  
     // Instance ID token to your app server.  
     sendRegistrationToServer(token);  
   }  
   private void sendRegistrationToServer(String token) {  
   }  
 }  


Then we have to handle messages that we received from Firebase Cloud Messaging.

Write notification code in your MyService class that you have created during step-3 of the FCM tutorial.

MyService.java
 package studio.harpreet.myfirstnotification;  
 import android.app.NotificationChannel;  
 import android.app.NotificationManager;  
 import android.app.PendingIntent;  
 import android.app.Service;  
 import android.content.Intent;  
 import android.net.Uri;  
 import android.os.Build;  
 import android.os.IBinder;  
 import android.util.Log;  
 import androidx.core.app.NotificationCompat;  
 import com.google.firebase.messaging.FirebaseMessagingService;  
 import com.google.firebase.messaging.RemoteMessage;  
 import static android.content.ContentValues.TAG;  
 public class MyService extends FirebaseMessagingService {  
   public MyService() {  
   }  
   @Override  
   public void onMessageReceived(RemoteMessage remoteMessage) {  
     String key = remoteMessage.getData().get("Key");  
     Intent intent = new Intent(this,MainActivity.class);  
     intent.setData(Uri.parse(key));  
     intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);  
     PendingIntent pi = PendingIntent.  
         getActivity(this,0,intent,PendingIntent.FLAG_ONE_SHOT);  
     String Channel_Id = "Default";  
     NotificationCompat.Builder builder = new NotificationCompat.Builder(this,Channel_Id);  
     builder.setSmallIcon(R.drawable.ic_launcher_background)  
         .setContentTitle(remoteMessage.getNotification().getTitle())  
         .setContentText(remoteMessage.getNotification().getBody())  
         .setAutoCancel(true)  
         .setContentIntent(pi);  
     NotificationManager manager = (NotificationManager)getSystemService(NOTIFICATION_SERVICE);  
     if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.O)  
     {  
       NotificationChannel channel = new NotificationChannel(Channel_Id,"Default channel",NotificationManager.IMPORTANCE_DEFAULT);  
       manager.createNotificationChannel(channel);  
     }  
     manager.notify(0,builder.build());  
   }  
 }  

Here, We handle notification received from Firebase Cloud Messaging.

Now, we will see how to send notification from the firebase console.


  • For that, Go to Firebase console and sign in with your same account which you have used during FCM setup to your app.
  • Then open your project from there.
Open a project from Firebase console
Open Project from Firebase console


  • Then click on cloud Messaging from Left menu
Click on cloud messaging to send notification
Click on cloud Messaging



  • Then click on Send Your First Message on right side
Send your First message to your Android Application
Send your First Message



  • Then Fill your required fields. For image, upload your image somewhere online and copy the image address from there.
Fill notification Title, Text  and Image URL
Fill your Required Fields


  • Then Target users.
Target your Users
Target users


  • Then Schedule your notification. You can schedule your notification, daily send notification and also send it on custom time.
Schedule your notification
Schedule your Notification


  • Then In Advanced settings, you can use a key pair. If you have implemented a web view in your app and want to open a URL by clicking on FCM notification then enter Key value as same as you specify in your MyService.java file and then fill your Url in value field next to key filed and then Review your notification and Send.
use of key value in Firebase cloud messaging Notification
Review and Send Notification

After click on review and send notification, you have recieved your notification, but if your app is running then you didn't received image with your notification, But, if your app is in background then you successfully recieved your Firebase notification with Image as well.


Follow us for more posts like this, 
Subscribe Harpreet studio on Youtube  
Like Harpreet Studio on Facebook  
Follow me on Instagram 

1 comment: