标签: trix

我正在尝试在 Rails 6 上使用 ActionText 在 WYSIWYG Trix 和渲染内容中显示嵌入式视频。但是 ActionText 渲染器会过滤所有原始 html 代码并强制我使用 JS 来显示渲染内容中的 iframe，这在 Trix 中不起作用。

我按照 Basecamp 的开发人员之一给出的说明进行操作：https : //github.com/rails/actiontext/issues/37#issuecomment-451627370。第 1 步到第 3 步有效，但是当 ActionText 呈现我的部分时，它会过滤 iframe。

创建所见即所得的表格

= form_for(article, url: url, method: method) do |a|
  = a.label :content
  = a.rich_text_area :content, data: { controller: "articles", target: "articles.field", embeds_path: editorial_publication_embeds_path(@publication, format: :json) }
  = a.submit submit_text, class:"btn full"

添加嵌入功能的 Stimulus 控制器（急需重构）

= form_for(article, url: url, method: method) do |a|
  = a.label :content
  = a.rich_text_area :content, …

我想向我的应用程序添加操作文本。但它也设置了 Active Storage。我已经使用 CarrierWave，不需要 Active Storage。顺便说一句，我根本不需要在编辑器中上传文件。

我正在编辑资源 - @article- 每当我提交它时，我都会收到以下错误：

JSON::ParserError in ArticlesController#update
783: unexpected token at '#<ImageUploader::UploadedFile:0x00007fb154adb508>'

它突出显示了这一行：

  if @article.update(article_params)

这是我的Article#Update操作中的正常 Rails 样板代码：

  def update
    respond_to do |format|
      if @article.update(article_params)
        format.html { redirect_to @article, notice: 'Article was successfully updated.' }
        format.json { render :show, status: :ok, location: @article }
      else
        format.html { render :edit }
        format.json { render json: @article.errors, status: :unprocessable_entity }
      end
    end
  end

这是服务器日志的完整输出（包括参数）：

Started PATCH "/articles/welcome-to-ftja" for ::1 at 2020-05-04 02:11:43 -0500
Processing by ArticlesController#update as HTML
  Parameters: …

我试图在trix-editor中添加像id,类的属性,同时通过java脚本插入html但是当我检查DOM的那个标签时,编辑器从标签中删除添加的属性.

我的Java脚本代码用于插入带有属性的html:

element.editor.insertHTML("<span id='" + userId + "' class='mention-user'>" + userName + "</span >"); 

DOM:

 <div><!--block-->@<span style="font-size: 12px;">abc/span></div></trix-editor>

即使我尝试过:

element.editor.activateAttribute("href", "https://trix-editor.org/");

这工作正常,但无法添加id或类.任何人都可以在标签中添加id或类吗？

我向 Trix 编辑器添加了一个图像，生成了以下代码：

<figure 
    data-trix-attachment="{lots of data}" 
    data-trix-content-type="image/jpeg"
    data-trix-attributes="{'presentation':'gallery'}" 
    class="attachment attachment--preview attachment--jpg">
    <img src="http://myhost/myimage.jpg" width="5731" height="3821">
    <figcaption class="attachment__caption">
        <span class="attachment__name">cool.jpg</span> <span class="attachment__size">4.1 MB</span>
    </figcaption>
</figure>

当我在基于 Bootstrap 的页面上显示从编辑器生成的 HTML 时，图像显然扩展了屏幕（参见width和height），我想删除这些道具并将img-fluid类分配给它。

所以基本上我想使用配置：

Trix.config.css.attachment = 'img-fluid'

但这确实 a) 不会将attachment类更改为img-fluid，也不会将更改应用于图像，而是将figure.

我想避免每次显示内容时都使用 jQuery 并遍历所有内容figures，然后在运行时操作图像的属性。

添加附件时没有定义这些样式的解决方案吗？

我正在尝试编写一个 RSpec 系统测试，该测试涉及在页面上填写 ActionText / Trix 字段。

似乎此处ActionText::SystemTestHelper定义的可用于帮助完成此任务，但到目前为止我还没有成功实现它。

我的 RSpec 测试如下所示：

# spec/system/add_job_posting_spec.rb

require 'rails_helper'

RSpec.describe 'adding a job posting', type: :system do
  let(:user) { FactoryBot.create :user }

  before do
    login_as(user)
    visit new_job_posting_path
  end

  context 'with valid information' do
    let(:valid_job_posting) { FactoryBot.create :job_posting }

    scenario 'creates a job posting', js: true do
      fill_in 'Title', with: valid_job_posting.title
      fill_in_rich_text_area 'Description', with: 'Job Info'

      click_button 'Submit'
      expect(page).to have_content 'Job was successfully created.'
    end
  end
end

我还尝试创建一个 RSpec 支持文件

# spec/support/action_text.rb …

我找不到实现嵌入 youtube/vimeo 视频的功能的方法是 actiontext/trix。

这就是我想要实现的目标：

GIF 来源：https : //github.com/basecamp/trix/issues/206#issuecomment-198479999

我查看了所有类似的问题/解决方案，但似乎没有任何答案：

• https://github.com/basecamp/trix#inserting-a-content-attachment
• 无法使用 rails 6 actiontext 渲染 youtube 嵌入 iframe
• 如何使用 ActionText 显示嵌入视频

我们如何使用 Ruby on Rails 使用 actiontext/trix 正确嵌入 iframe？

根据我添加action_text/trix到我的 Rails 应用程序的文档。当我更新内容时。它向我显示以下错误。任何想法？

Showing /home/dell/code/tm/app/views/active_storage/blobs/_blob.html.erb where line #3 raised:

Can't resolve image into URL: undefined method `to_model' for #<ActiveStorage::VariantWithRecord:0x0000559255e1be40 @blob=#<ActiveStorage::Blob id: 12, key: "n48e43looijem16cdq5d48sqhu4d", filename: "Screenshot from 2021-08-28 17-10-25.png", content_type: "image/png", metadata: {}, service_name: "local", byte_size: 93757, checksum: "up8PwkoYwf+Y6NTRJvbAUA==", created_at: "2021-08-29 12:13:04.912555000 +0800">, @variation=#<ActiveStorage::Variation:0x0000559255e248d8 @transformations={:format=>"png", :resize_to_limit=>[1024, 768]}>>
Did you mean?  to_yaml

ActionView::Template::Error (Can't resolve image into URL: undefined method `to_model' for #<ActiveStorage::VariantWithRecord:0x0000559255e1be40 @blob=#<ActiveStorage::Blob id: 12, key: "n48e43looijem16cdq5d48sqhu4d", filename: "Screenshot from 2021-08-28 17-10-25.png", content_type: "image/png", metadata: {}, service_name: "local", …

我用Paper Trail Gem很好地设置了我的基本模型 Article，其中有一个text名为 的专栏body。但是，在我向应用程序实施操作文本body并从文章模型中删除该列后，我无法让 Paper Trail 跟踪关联body列中的更改。我怎样才能让它发挥作用？

免责声明：我是 Rails 的新手。

文章.rb

...
  has_rich_text :body
  has_paper_trail
...

文章架构（删除 :body 列后）

  create_table "articles", force: :cascade do |t|
    t.string "title"
    t.string "slug"
    t.datetime "archived_at"
    t.datetime "published_at"
    ...
  end

动作文本模式

create_table "action_text_rich_texts", force: :cascade do |t|
    t.string "name", null: false
    t.text "body"
    t.string "record_type", null: false
    t.bigint "record_id", null: false
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.index ["record_type", …

有没有办法禁止从 ActionText/Trix 编辑器直接上传图像和附件，并将其替换为对 Rails 后端的 POST 请求以上传到 S3？

我试图这样做是为了从 Rails 应用程序的角度审核任何用户上传操作。

更新：我想我可以扩展ActiveStorage::DirectUploadsController来做这个审计。我仍然对原始问题感到好奇。

我也在考虑编写 javascript 来更改html 表单元素的数据属性 ( data-direct-upload-url) <trix-editor>。