oEmbed - hassle-free embedding of third party media content

talk at Linuxtag Berlin 2013

Transcript

1. oEmbed hassle-free embedding of third party media content Kerstin Puschke XING AG Linuxtag Berlin, May 2013 Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 0 / 21
2. Who am I http://www.kpuschke.eu twitter: @titanoboa42 https://www.xing.com/profile/Kerstin_Puschke software engineer at XING Hamburg working on xing.com, the social network for business professionals about 13 million users debian, perl, javascript, ruby on rails, mysql, redis, riak, . . . We’re hiring! http://corporate.xing.com/english/company/ careers-at-xing/ Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 1 / 21
3. Third-party media embedding boring links? https://www.youtube.com/watch?v=B3iCRinSCx0 Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 2 / 21
4. Automated embedding turns a url Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 3 / 21
5. Automated embedding turns a url into an embedded representation Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 3 / 21
6. Automated embedding Implementation screenscraping provider specific APIs Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 4 / 21
7. Automated embedding Wishlist easy to implement low maintenance effort supports many providers Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 5 / 21
8. oEmbed open embed format oEmbed open web standard for third-party media embedding Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 6 / 21
9. oEmbed providers youtube, vimeo flickr, instagram, yfrog, photobucket, imgur twitter slideshare, speakerdeck soundcloud drupal, wordpress github gist . . . Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 7 / 21
10. oEmbed intermediaries embed.ly oohembed now part of embed.ly reEmbed.me noembed.com open source software . . . Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 8 / 21
11. oEmbed consumers drupal wordpress serendipity dokuwiki statusnet diaspora friendica xing . . . Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 9 / 21
12. oEmbed request http://www.youtube.com/oembed? url=http%3A//youtube.com/watch%3Fv%3Dzwk1KvnZxGw &format=json &maxwidth=400&maxheight=200 Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 10 / 21
13. oEmbed API endpoint discovery <link rel="alternate" type="application/json+oembed" href="http://flickr.com/services/oembed ?url=http%3A%2F%2Fflickr.com%... &format=json" title="XING Prototyping Days" /> Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 11 / 21
14. Example response: video { "author_name": "XINGcom", "html": "<iframe width=\"480\" height=... "version": "1.0", "author_url": "http://www.youtube.com/user/XING... "thumbnail_width": 480, "height": 270, "provider_url": "http://www.youtube.com/", "type": "video", "width": 480, "thumbnail_height": 360, "thumbnail_url": "http://i3.ytimg.com/vi/... "provider_name": "YouTube", "title": "Was ist XING?" } Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 12 / 21
15. Example response: photo { "type": "photo", "title": "XING Protoyping Days", "author_name": "XING AG", "author_url": "http://www.flickr.com/photos/op... "width": "1024", "height": "680", "url": "http://farm7.staticflickr.com/6082/6146... "web_page": "http://www.flickr.com/photos/openb... "thumbnail_url": "http://farm7.staticflickr.com... "thumbnail_width": 75, "thumbnail_height": 75, "web_page_short_url": "http://flic.kr/p/an9oux", "license": "All Rights Reserved", "license_id": 0, "version": "1.0", "cache_age": 3600, Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 13 / 21
16. Implementing a consumer Illustration: Nidoki http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 14 / 21
17. XSS Illustration: ZeNDaMs http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 15 / 21
18. SSL Illustration: ZeNDaMs http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 16 / 21
19. Different sizes Illustration: pusio http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 17 / 21
20. Different types Illustration: louloudu57 http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 18 / 21
21. Implementing a provider Illustration: judipich http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 19 / 21
22. Criticism different user agents (e.g. mobile) oEmbed is not RESTful Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 20 / 21
23. Conclusion pragmatic approach - widely adopted - easy to implement Illustration: kami23 http://tux.crystalxp.net/ Creative Commons BY-NC-SA Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 21 / 21
24. Who am I http://www.kpuschke.eu twitter: @titanoboa42 https://www.xing.com/profile/Kerstin_Puschke software engineer at XING Hamburg working on xing.com, the social network for business professionals about 13 million users debian, perl, javascript, ruby on rails, mysql, redis, riak, . . . We’re hiring! http://corporate.xing.com/english/company/ careers-at-xing/ Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 21 / 21
25. License Unless otherwise indicated, the text of this presentation is licensed under Creative Commons Attribution-ShareAlike 3.0 http://creativecommons.org/licenses/by-sa/3.0/ The XING logo and the screenshots on slide 3 as well as everything depicted therein are NOT covered under a Creative Commons license. The illustrations from http://tux.crystalxp.net/ are licensed under Creative Commons Attribution-NonCommercial-ShareAlike 3.0 http://creativecommons.org/licenses/by-nc-sa/3.0/. The respective authors are attributed along with each illustration. Kerstin Puschke (XING AG) oEmbed Linuxtag Berlin, May 2013 21 / 21