2016-11-16 4 views
2

우리는 Instagram의 oEmbed-API를 사용하여 소스 코드를 가져 왔습니다. 그러나 우리는 그 API에만 의존하고 임베드 코드를 생성하기를 원하지 않습니다. API (또는 웹 사이트)에서 제공하는 소스 코드에는 HTML, CSS 이미지 데이터 및 텍스트 콘텐츠가 많이 포함되어 있습니다.이 모든 내용은 소스 코드에 포함 된 js를 처리하기 전에 이미 있어야합니다. 이것은 일반적인 삽입 코드를 구현할 수 없기 때문에 문제이지만 사전에 각 사진이나 비디오의 인스 타 그램 내용을 알아야하기 때문입니다.자바 스크립트를 통한 Instagram 삽입

제 질문은 : 거기에 일반적인 소스 코드 인 instagram에 대해 이와 비슷한 코드가 있습니까?

<script async defer=\"defer\" src=\"//platform.instagram.com/en_US/embeds.js\"></script> 
<script>instgrm.Embeds.genenerate('some instragram ID for instance')<script/> 

답변

3

이 같이 포함 할 iframe를 사용할 수 있습니다

<iframe src="https://www.instagram.com/p/BFKjVxkBsCC/embed" width="400" height="480" frameborder="0" scrolling="no" allowtransparency="true"></iframe> 

당신에게

이미지

에 캡션을 추가합니다 /embed/captioned를 추가 포함 할 수 있습니다 이미지를 줄 것이다 포스트 URL을 인스 타 그램에 /embed 추가

다음은 쉽게 임베드 코드를 생성하는 링크입니다. https://www.picodash.com/instagram/embed#https://www.instagram.com/p/BFKjVxkBsCC/

+0

감사하지만 iFrames는 우리에게 옵션이 아닙니다.로드 및 렌더링 성능이 느리고 esp를 사용하는 데 종종 어려움이 있습니다. 모바일을 통해 콘텐츠를 스 와이프 할 때 – Lukas

+0

스크립트에서 가져온 스크립트는 나중에 iframe에서 가져옵니다. 다른 옵션은 Instagram API를 사용하고 이미지 링크를 가져 와서 으로로드하지만, 인증하고 access_token을 가져 와서 호출해야합니다 : https : //www.instagram.com/developer/endpoints/media/#get_media_by_shortcode – krisrak

관련 문제