Использование JQuery и Rails для предварительного просмотра ссылки

Question

Что меня интересует, так это реализация базовой версии инструмента предварительного просмотра ссылок в JQuery и RoR (аналогично тому, что есть в Facebook). Пользователь вводит URL в поле ввода. Функция jquery следит за тем, что набирается (используя keyup), и когда набирается действительный URL-адрес (без отправки пользователем чего-либо), функция jquery вызывает функцию rails, которая использует гем Nokogiri для поиска и возврата содержимого предварительного просмотра (например, заголовка)., любые изображения и т. д.). Затем этот контент возвращается в функцию jquery и отображается под полем ввода.

Во всем этом мне неясно, как данные передаются из функции jquery на рельсы один и обратно.

Для конкретизации, скажем, я просто хочу получить заголовок набираемого URL.

В моей функции JQuery я использую keyup для отслеживания таких вещей, как пробелы, возвраты и т. Д. На данный момент я не проверяю введенный URL (я могу сделать это позже)

var text; 

$("#text").keyup(function(e) {

    if(e.which == 13 || e.which == 32 || e.which == 17 || ) {

        text = $("text").val();
        $.get('/linkPreview', {text: text}, function(answer) {

            $("previewTitle").html(answer);
        }           
            )
    }

Это где я не уверен, как поступить. Я использую метод.get Jquery (это правильный?) Для вызова функции rails и передачи текста в виде напечатанного URL.

Затем я сопоставляю '/linkPreview' с действием linkPreview в моем контроллере страниц в моем файле маршрутов:

match '/linkPreview', :to => 'pages#linkPreview'

Я также не уверен насчет чтения и передачи данных JSON в функции rails. Я пытаюсь использовать функции response_to и response_with, но не уверен, что это правильно (я использую драгоценный камень Nokogiri для извлечения заголовка из HTML-адреса URL):

def linkPreview
    respond_to :json
@url = params[:text]
doc = Nokogiri::HTML(open(@url))
@title = doc.css(title)
respond_with(@title)
end

Поскольку я новичок в RoR и JQuery, я был бы очень признателен за любую помощь в отношении правильного способа вызова функции rails из JQuery, передачи данных JSON от одного к другому и любых других ресурсов, посвященных этим темам! Мне также было интересно, есть ли рекомендуемый способ отладки некорректного скрипта (мой код явно не работает, но я не уверен, с чего начать при поиске ошибок).

Благодаря тонну!

Answer 1

Я знаю, что это старый вопрос, однако мне удалось заставить работать следующий код:

controller.rb

def linkpreview
    url = params[:url]
    preview = LinkPreviewParser.parse(url) # returns a Hash
    respond_to do |format|
        format.json { render :json => preview }
    end
end

приложение / модели / link_preview_parser.rb

class LinkPreviewParser
  def self.parse(url)
    doc = Nokogiri::HTML(open(url))
    page_info = {}
    page_info[:title] = doc.css('title').text
    return page_info
  end
end

routes.rb

match '/linkpreview', to: 'items#linkpreview'

linkpreview.js

$(document).ready(function() {
  $("#url-submit").on('click', function() {
    var link = $("#url");
    setTimeout(function() {
      var text = $(link).val();
      // send url to service for parsing
      $.ajax('/linkpreview', {
        type: 'POST',
        dataType:'json',
        data: { url: text },
        success: function(data, textStatus, jqXHR) {
          $("#item_title").val(data['title']);
        },
        error: function() { alert("error"); }
      }); 
    }, 100);
  });
});

Answer 2

Возможно, вы захотите ознакомиться с гемом link_preview, который мы разработали на Socialcast: https://github.com/socialcast/link_preview он обрабатывает большую часть серверной обработки для вас.

Answer 3

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

def link_preview
  url = params[:url]
  preview = LinkPreviewParser.parse(url) # returns a Hash
  respond_with(preview) #respond_with converts a hash to JSON
end

Затем, для более чистой организации и тестирования кода, переместите код синтаксического анализа в отдельный класс.

приложение / модели /link_preview_parser.rb

class LinkPreviewParser
  def self.parse(url)
    doc = Nokogiri::HTML(open(@url))
    page_info = {}
    page_info[:title] = doc.css(title) # assuming this is right - I didn't check
    # ... more parsing logic if needed ...
    return page_info
  end
end

Это вернет объект json, который выглядит следующим образом: {'title': 'Some Webpage'}, который должен быть довольно легко обрабатывать в вашем JavaScript. И вы можете добавить другой атрибут по мере необходимости.

Я не проверял это, но я верю, что это должно сработать. Это самый простой подход, но если вы ожидаете много трафика, у этого есть серьезный недостаток. Поскольку запрос от браузера должен был бы ждать другого запроса от сервера на внешний веб-сайт, у вас будет много запросов, просто ожидающих бездействия. Так что в идеале вы бы хотели сделать это асинхронно. Это немного больше работы, так что выбирайте то, что подходит вам лучше всего в данный момент.