Puedes consultar el extremo oEmbed de Instagram para obtener el código HTML de inserción y los metadatos básicos de una publicación de Instagram a fin de mostrarla en otro sitio web u otra aplicación. Admite la publicaciones de guías, Reels, vídeos y fotos.
Extremo | Descripción |
---|---|
Obtiene el código HTML de inserción y los metadatos básicos de una publicación de Instagram. |
Para utilizar oEmbed, tu aplicación debe someterse a la revisión de la aplicación para la función oEmbed Read.
En el campo del formulario Proporciona una URL en la que podamos probar oEmbed Read, usa el extremo oEmbed de Instagram para obtener el código HTML de inserción de cualquier publicación pública en nuestra página de Facebook o de Instagram oficial (u obtén el código HTML de inserción de cualquiera de las páginas). Añade el código HTML de inserción devuelto a la página en la que mostrarás el contenido de oEmbed e introduce la URL de dicha página en el campo del formulario.
Una vez que hayas recibido aprobación para la función oEmbed Read, podrás insertar tus páginas, publicaciones o vídeos con sus URL correspondientes.
El extremo oEmbed de Instagram requiere un identificador de acceso a la aplicación (recomendado) o un identificador de acceso del cliente.
Si tu aplicación depende de un servidor de back-end, te recomendamos utilizar un identificador de acceso a la aplicación al acceder al extremo oEmbed. Las limitaciones de frecuencia dependen del tipo de identificador incluido en la solicitud y las del identificador de la aplicación permiten un máximo de 5 millones de solicitudes al día.
Puedes encontrar instrucciones sobre cómo generar identificadores de acceso a la aplicación en la sección Identificadores de la aplicación de nuestra documentación Identificadores de acceso.
Ten en cuenta que los identificadores de acceso a la aplicación nunca deben usarse en el lado del cliente. Siempre deben mantenerse protegidos y almacenados en el servidor. Si la aplicación necesita usar un identificador en el lado del cliente, utiliza un identificador de acceso del cliente en su lugar.
Si tu aplicación debe acceder al extremo oEmbed desde un agente de usuario, como un dispositivo móvil o navegador web, deberá utilizar un identificador de acceso del cliente y estar sujeto a las limitaciones de frecuencia del identificador del cliente.
Para obtener un identificador de acceso del cliente, inicia sesión en el panel de aplicaciones y ve a Configuración > Opciones avanzadas > Seguridad > Identificador de cliente.
A diferencia de los identificadores de acceso a la aplicación, los identificadores de acceso del cliente no se pueden utilizar en solicitudes del extremo oEmbed solos, sino que deben combinarse con el identificador de la aplicación. Para ello, anexa el identificador al final del identificador de la aplicación, separado por una barra vertical (|
):
{app-id}|{client-token}
Por ejemplo:
access_token=1234|5678
Las limitaciones de frecuencia dependen del tipo de identificador de acceso que la aplicación incluye en cada solicitud.
Las aplicaciones que dependen de identificadores de acceso a la aplicación pueden realizar hasta 5 millones de solicitudes cada 24 horas.
Las limitaciones de frecuencia del identificador del cliente son considerablemente menores que las del identificador de la aplicación. No revelamos la limitación real, ya que cambiará en función de la actividad de la aplicación. No obstante, puedes suponer con seguridad que tu aplicación no alcanzará la limitación, a menos que muestre un comportamiento similar al de un bot; por ejemplo, si procesa por lotes miles de solicitudes o envía miles de solicitudes por agente o usuario de la aplicación.
Para obtener el código HTML de inserción de una publicación de Instagram, envía una solicitud:
GET /instagram_oembed?url={url}&access_token={access-token}
Reemplaza {url}
por la URL de la publicación de Instagram que quieras consultar y {access-token}
por el identificador de acceso del cliente o a la aplicación (o bien pásanoslo en un encabezado HTTP). Si utilizas un identificador de acceso del cliente, recuerda que debes combinarlo con tu identificador de la aplicación con una barra vertical, ya que, de lo contrario, se producirá un error en la solicitud.
Si la operación se realiza correctamente, la API responderá con un objeto JSON que contendrá el código HTML de inserción de la publicación, junto con datos adicionales. El código HTML de inserción se asignará a la propiedad html
.
Consulta la referencia de oEmbed de Instagram para obtener una lista de los parámetros de cadena de consulta que puedes incluir para aumentar la solicitud. También puedes incluir el parámetro de cadena de consulta fields
para especificar los campos que quieres que se te devuelvan. Si se omite, todos los campos predeterminados se incluirán en la respuesta.
curl -X GET \
"https://graph.facebook.com/v20.0
/instagram_oembed?url=https://www.instagram.com/p/fA9uwTtkSN/&access_token=IGQVJ..."
Algunos valores se truncan con puntos suspensivos (...
) por motivos de legibilidad.
{ "version": "1.0", "author_name": "diegoquinteiro", "provider_name": "Instagram", "provider_url": "https://www.instagram.com/", "type": "rich", "width": 658, "html": "<blockquote class=\"instagram-media\" data-instgrm-ca...", "thumbnail_width": 640, "thumbnail_height": 640 }
El parámetro de la cadena de consulta url
acepta los formatos de URL siguientes:
https://www.instagram.com/p/{media-shortcode}/
https://www.instagram.com/tv/{media-shortcode}/
https://www.instagram.com/{username}/guide/{slug}/{guide_id}
El código HTML de inserción contiene una referencia a la biblioteca de JavaScript embed.js de Instagram. Cuando la biblioteca se carga, examina la página para obtener el código HTML de la publicación y genera la publicación completamente representada. Si quieres que la biblioteca se cargue por separado, incluye el parámetro de cadena de consulta omitscript=true
en la solicitud. Para inicializar manualmente el código HTML de inserción, llama a la función instgrm.Embeds.process()
después de cargar la biblioteca.
La publicación insertada tiene capacidad de respuesta y se adaptará al tamaño del contenedor. Esto significa que la altura variará en función de la anchura del contenedor y la longitud del texto. Para establecer la anchura máxima, incluye el parámetro de cadena de consulta maxwidth
en la solicitud.
Se recomienda representar todo el código HTML de inserción de la publicación siempre que sea posible. Si no puedes hacerlo, puedes obtener la URL de la imagen en miniatura de una publicación y representarla. Sin embargo, si lo haces, debes proporcionar una atribución clara junto a la imagen, que incluya la atribución al autor original y a Instagram, así como un enlace a la publicación de Instagram que estás consultando.
Para obtener la URL de la miniatura y la información de atribución de una publicación, envía una solicitud:
GET /instagram_oembed ?url={url} &maxwidth={maxwidth} &fields=thumbnail_url,author_name,provider_name,provider_url &access_token={access-token}
Reemplaza {url}
por la URL de la publicación de Instagram que quieres consultar, {maxwidth}
por el tamaño máximo de la miniatura que quieres representar y {access-token}
por el identificador de acceso del cliente o a la aplicación.
curl -i -X GET \
"https://graph.facebook.com/v20.0
/instagram_oembed?url=https%3A%2F%2Fwww.instagram.com%2Fp%2FfA9uwTtkSN&maxwidth=320&fields=thumbnail_url%2Cauthor_name%2Cprovider_name%2Cprovider_url&access_token=96481..."
Algunos valores se truncan con puntos suspensivos (...
) por motivos de legibilidad.
{ "thumbnail_url": "https://scontent.cdninstagram.com/v/t51.288...", "author_name": "diegoquinteiro", "provider_name": "Instagram", "provider_url": "https://www.instagram.com/" }
Si no quieres incluir el identificador de acceso en la cadena de consulta de la solicitud, puedes pasárnoslo a través de un encabezado HTTP Authorization
.
Authorization: Bearer {access-token}
Por ejemplo:
curl -i -X GET \
"https://graph.facebook.com/v20.0
/instagram_oembed?url=https%3A%2F%2Fwww.instagram.com%2Fp%2FfA9uwTtkSN" \
--header "Authorization: Bearer 96481..."