Исходный код кнопки «Закрепить» (pinterest.com) - PullRequest
Новая
       8

Исходный код кнопки «Закрепить» (pinterest.com)

5 голосов
/ 10 января 2012

Кто-нибудь имеет представление о том, как внедрить что-то вроде кнопки «PIN IT» в pinterest.com? С высокого уровня я понимаю, что он делает, но не в деталях. Вы нажимаете на закладку «закрепить», а затем очищаете исходный код сайта, чтобы найти изображения с шириной и высотой, превышающими некоторый порог. Очистка исходного кода страницы для поиска изображений может происходить на стороне клиента или на стороне сервера. Какой лучший способ добиться чего-то подобного?

Может ли кто-нибудь дать представление об их реализации?

Ответы [ 2 ]

1 голос
/ 13 января 2013

Я создаю функцию в javacript для совместного использования пользовательских изображений с интересом, передавая источник изображений, которыми вы хотели бы поделиться.

Код: https://github.com/mustaine/Pinmarklet

Я надеюсь, что это поможет.

1 голос
/ 10 января 2012

На самом деле этот тип закладок обычно делает это:

Когда вы нажимаете на закладку, он запускает код JavaScript, перенаправляя на следующий URL: 

javascript: void((function () { SOME_CODE })());

Затем выполняется SOME_CODE,В этом случае кнопка Pin it будет работать следующим образом: 

javascript: void((function () {
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('charset', 'UTF-8');
    e.setAttribute('src', 'http://assets.pinterest.com/js/pinmarklet.js?r=' + Math.random() * 99999999);
    document.body.appendChild(e)
})());

, что приведет к добавлению нового тега в тело документа.Pin Это добавит файл "pinmarklet.js".Обратите внимание, что часть "? R = '+ Math.random () * 99999999" предназначена только для получения путем передачи кеша со стороны клиента путем случайного генерирования нового числа случайным образом.

Если вы хотите точно узнать, что произошлозатем, вам нужно взглянуть на их исходный код JavaScript.Но легко заглянуть в DOM и захватить то, что вы хотите захватить (изображения, ссылки на видео, ...) и применить свою логику.

Надеюсь, это поможет: -)

...