Как можно динамически вставлять GitHub Gist на страницу?

У меня есть текст, содержащий URL-адреса для GitHub Gists. Я бы хотел найти эти URL-адреса и поместить Gist inline в клиентскую часть содержимого. Некоторые вещи, которые я пробовал:

Прямой поиск API GitHub OEmbed.

Для https://gist.github.com/733951 это означает, что я выполняю поиск JSON-P для https://github.com/api/oembed?format=json&url=https%3A%2F%2Fgist.github.com%2F733951 извлеките свойство html объекта и добавьте добавление этого на мою страницу. Проблема  вот что API GitHub OEmbed возвращает только первые три строки Gist.

Используя плагин jQuery-embedly.

Вызов

jQuery('a.something').embedly({allowscripts: true})

работает, но Embedly удаляет форматирование из Gist. Обертка его в теге <pre> не помогает, потому что нет разрывов строк.

Использование версии gitHub .js версии.

https://gist.github.com/733951.js использует document.write, поэтому я не могу контролировать, где на странице, когда я требую его динамически. (Если бы я мог записать его в источник HTML, он появился бы в нужном месте, но все это делается на стороне клиента.)

ОТВЕТЫ

Ответ 1

Я был вдохновлен внедрением gist на стороне клиента и создал для него библиотеку html script.js (я также использую ее, чтобы удалить встроенный стиль ссылок и использовать свой собственный стиль, который лучше подходит для моей страницы)...

Это более общий, чем просто встраивание gists и pasties - на самом деле я использую его для динамической загрузки некоторых сторонних виджетов /google maps/twitter posts)...

https://github.com/kares/script.js

Здесь пример внедрения:

https://github.com/kares/script.js/blob/master/examples/gistsAndPasties.html

UPDATE: gist API с тех пор поддерживает JSONP, образец jQuery:

var printGist = function(gist) {
    console.log(gist.repo, ' (' + gist.description + ') :');
    console.log(gist.div);
};
$.ajax({ 
    url: 'https://gist.github.com/1641153.json', 
    dataType: 'jsonp', success: printGist 
});

Ответ 2

Я только что начал проект под названием UrlSpoiler (в github). Это поможет вам внедрить gists динамически. Он размещал на Heroku на бесплатной/общей платформе, поэтому вы можете играть с ней, но я бы рекомендовал скопировать код, который вам нужен, в ваше собственное приложение для использования в целях производства.