Add sample image in template header in whatsapp cloud API

user_18278632 0
Viewed 594

I am doing a project using WhatsApp cloud API. I need to create a template with a media header. I have created a template with a media header without a sample image and it gets rejected. So I want to create a template with a sample image in Node JS.

Template with a media header

Add sample image for a template

curl -X POST "https://graph.facebook.com/v14.0/{whatsapp-business-account-ID}/message_templates
  ?name={template-name}
  &language=en_US
  &category=TRANSACTIONAL,
  &components=[{
       type:BODY, 
       text:{message-text}
     }, 
     {
       type:HEADER, 
       format:IMAGE, 
       example:{header_handle:[{uploaded-image-file-url}]}
     }],
  &access_token={system-user-access-token}"

I want to add a sample image using Node JS (Not manually like the second picture).

whatsapp node.js cloud api
3 Answers

header_handle requires a encrypted file upload provided by facebook.

This can be done by calling 2 apis.

First, We have to create a session for the file to be uploaded. For creating session refer this

After creating session, we will get session id to upload the original file to it.Response will look something like this:

{"id":"upload:MTphdHRhY2htZW50Ojlk2mJiZxUwLWV6MDUtNDIwMy05yTA3LWQ4ZDPmZGFkNTM0NT8=?sig=ARZqkGCA_uQMxC8nHKI"}

Second,We have to upload the file to https://graph.facebook.com/v14.0/{above_id}

This will give a response something similar to

{"h":"2:c2FtcGxlLm1wNA==:image/jpeg:GKAj0gAUCZmJ1voFADip2iIAAAAAbugbAAAA:e:1472075513:ARZ_3ybzrQqEaluMUdI"}

Finally,

{header_handle:["2:c2FtcGxlLm1wNA==:image/jpeg:GKAj0gAUCZmJ1voFADip2iIAAAAAbugbAAAA:e:1472075513:ARZ_3ybzrQqEaluMUdI"]}

Should be added during the request to create template.

It worked for me.

See this for better understanding on how to do it.

user_198287840

I have exact error with the steps described and error

{
  "error": {
    "message": "Invalid parameter",
    "type": "OAuthException",
    "code": 100,
    "error_subcode": 2388084,
    "is_transient": false,
    "error_user_title": "File Type Not Supported",
    "error_user_msg": "The type of file is not supported.",
    "fbtrace_id": "A4w-mA2KfNjio8CoJpNRuN2"
  }
}

The media is a png file.

user_197208960

I'm experiencing a similar problem. I am performing the steps described in the documentation. I can successfully execute both steps and I have the id:

{
  "h": "4:::ARa8yY1rYXPzA97hXz76qkSRXmEpygqFdLY5X7BtG24ZFxjQpv1JrP057Ub5dzOyZYi2pcZhKZqaReJmW0n25GWYrMKPmDUen4sOltUFayEKzQ:e:1663533690:727242995025717:100043883327420:ARa6WgjF9o1puhqJlt4"
}

However when submitting to the Whatsapp API returns the message of "File Type Not Supported"

{
  "type":"HEADER",
  "format":"IMAGE",
  "example": {
    "header_handle": [
      "4:::ARa8yY1rYXPzA97hXz76qkSRXmEpygqFdLY5X7BtG24ZFxjQpv1JrP057Ub5dzOyZYi2pcZhKZqaReJmW0n25GWYrMKPmDUen4sOltUFayEKzQ:e:1663533690:727242995025717:100043883327420:ARa6WgjF9o1puhqJlt4"
    ]
  }
}
user_197208960
Related