【问题标题】:Rails 5/Ruby - Pull og:data from external URL to populate form fields when link is pastedRails 5/Ruby - 从外部 URL 拉取 og:data 以在粘贴链接时填充表单字段
【发布时间】:2018-02-18 21:12:16
【问题描述】:

我有一个允许用户创建新帖子的表单。第一个字段是 url 字段。我希望用户能够粘贴外部 url,然后使用外部 url 的打开图形/元数据中的图像/标题/描述预填充下面的表单。基本上与将 URL 发布到 facebook 时生成“共享卡”的方式相同。

我基本上复制了这个答案中所述的内容,但它不起作用: How to pull data from URL into form with Ruby on Rails 5

我正在努力弄清楚如何解决它以及如何添加图像(我正在使用回形针 gem)。这是我到目前为止所得到的

url_grabber_controller.erb

require 'mechanize'
class UrlGrabberController < ApplicationController
    def grab
        pasted_url = params.fetch("pasted_url")
        page = agent.get(pasted_url)
        title = page.title
        node = page.at("head meta[name='description']")
        description = node["content"]
        render json: {title: title, description: description}
    end
end

_form.html.erb

// Form Fields

<script>
$("#link_url").on("paste", function(e) {
 $.ajax({
  url: "/url-grabber/grab",
  data: $("#link_url").val(),
  success: function(result) {
    $("#title").val(result["title"]);
    $("#description").val(result["description"]);
  }
 });
});
</script>

routes.rb

Rails.application.routes.draw do
  get "url-grabber/grab" => "url_grabber#grab"
end

非常感谢您的帮助!

【问题讨论】:

  • 您复制了一个未被接受且没有点赞的答案。是什么让您认为它有效:-)。你甚至复制了一个明显的错误(在同一个地方设置标题和描述)。无论如何,它可能会起作用。你确认ajax被执行了吗?粘贴 url 时是否验证了控制器中收到的参数?控制器中的agent 是什么?
  • 嘿@Pablo 我复制了,因为我在其他任何地方都找不到答案,所以这是我唯一的起点。正在执行 ajax 脚本,但我在 URL 处遇到错误。我不确定代理是什么。我对 Rails(以及一般后端)非常陌生,所以不确定上面到底发生了什么
  • 请在浏览器控制台和rails日志中发布您看到的任何错误,如果执行了grab方法,请包含收到的参数。
  • 粘贴 URL 时出现此错误:GET http://localhost:3000/url-grabber/grab 400 (Bad Request)

标签: jquery ruby-on-rails ruby-on-rails-5


【解决方案1】:

我最终使用 Nokogiri gem 解决了这个问题。这提供了一个可行的解决方案,但对于一个完整的解决方案,它需要针对没有 og 属性的站点的后备方法。

fetch_url_controller.erb

require 'open-uri'
require 'nokogiri'

class FetchUrlController < ApplicationController
  def grab
    url = params.fetch("url")
    doc = Nokogiri::HTML(open(url))

    title = doc.at('meta[property="og:title"]')['content']
    description = doc.at('meta[property="og:description"]')['content']
    img_url = doc.at('meta[property="og:image"]')['content']

    render json: {title: title, description: description, image: img_url}
  end
end

jQuery

$('#link_url').on('input', function(e) {
  var url = $('#link_url').val();
    $.ajax({
      url: "/fetch-url/grab?url="+url,
      success: function(result) {
      $('.js-share-data').html('<h1>'+result["title"]+'</h1><p>'+result["description"]+'</p><img src="'+result["image"]+'">');
  }
  });
});

routes.rb

get "fetch-url/grab" => "fetch_url#grab"

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-11-25
    • 2011-02-18
    • 1970-01-01
    • 1970-01-01
    • 2022-01-12
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多