【发布时间】：2017-09-30 03:26:32
【问题描述】：
我不知道如何在 froala 编辑器中上传图片。我有carrierwave为我的应用程序的其他部分上传图片到谷歌云存储，现在我想在froala编辑器中上传图片。
这是我到目前为止所做的事情
上传图片
class PostImageUploader < CarrierWave::Uploader::Base
# Choose what kind of storage to use for this uploader:
storage :fog
# Override the directory where uploaded files will be stored.
# This is a sensible default for uploaders that are meant to be mounted:
def store_dir
"post-image"
end
# Add a white list of extensions which are allowed to be uploaded.
# For images you might use something like this:
def extension_white_list
%w(jpg jpeg gif png)
end
# Override the filename of the uploaded files:
# Avoid using model.id or version_name here, see uploader/store.rb for details.
def filename
"#{model.id}-#{original_filename}" if original_filename.present?
end
end
我做了一个帖子图片模型
class PostImage < ActiveRecord::Base
belongs_to :post
mount_uploader :image, PostImageUploader
validate :image_size
# Validates the size of an uploaded picture.
def image_size
if image.size > 5.megabytes
errors.add(:picture, "should be less than 5MB")
end
end
end
我在后置控制器中创建了 attach 和 detach 方法，但我不知道在其中放入什么。
def attach
end
def detach
end
def image_params
params.require(:post_image).permit(:image)
end
为附加和分离方法做了路由，但它们可能是错误的，因为我不确定我是否需要这些方法。
match '/guides/:guide_id/posts/attach' => 'posts#attach', :via => :create, as: :attach_guide_post_image
match '/guides/:guide_id/posts/detach'=> 'posts#detach', :via => :delete, as: :detach_guide_post_image
我的 carriwewave 初始化程序已设置并正在工作（因为我在网站上的其他地方使用它）所以我认为我不需要添加它。而且我认为我不需要添加我的后控制器 new 和create 方法，它们的标准标准。
从这里我去了froala docs for image uploads，但我不知道要输入什么值，我需要哪些值，哪些不需要。我的问题是用大写字母写的 cmets。
<script>
$(function() {
$('.editor')
.froalaeditor({
// Set the image upload parameter.
imageUploadParam: 'image',
// 1. I'M GUESSING THIS IS THE PARAM PASSED
// Set the image upload URL.
imageUploadURL: <%= attach_guide_post_image_path =%>,
// 2. MADE THIS PATH IN THE ROUTES
// Set request type.
imageUploadMethod: 'POST',
// Set max image size to 5MB.
imageMaxSize: 5 * 1024 * 1024,
// Allow to upload PNG and JPG.
imageAllowedTypes: ['jpeg', 'jpg', 'png', 'gif']
})
.on('froalaEditor.image.beforeUpload', function (e, editor, images) {
// Return false if you want to stop the image upload.
//3. SO I PUT ERROR MESSAGE IN THESE?? IF SO SHOULD IT BE A POPUP OR TEXT ON THE SCREEN AND HOW
})
.on('froalaEditor.image.uploaded', function (e, editor, response) {
// Image was uploaded to the server.
})
.on('froalaEditor.image.inserted', function (e, editor, $img, response) {
// Image was inserted in the editor.
})
.on('froalaEditor.image.replaced', function (e, editor, $img, response) {
// Image was replaced in the editor.
})
.on('froalaEditor.image.error', function (e, editor, error, response) {
// Bad link.
else if (error.code == 1) { ... }
// No link in upload response.
else if (error.code == 2) { ... }
// Error during image upload.
else if (error.code == 3) { ... }
// Parsing response failed.
else if (error.code == 4) { ... }
// Image too text-large.
else if (error.code == 5) { ... }
// Invalid image type.
else if (error.code == 6) { ... }
// Image can be uploaded only to same domain in IE 8 and IE 9.
else if (error.code == 7) { ... }
// Response contains the original server response to the request if available.
});
});
</script>
这就是我得到的。我知道基本的 JS，并且已经使用 Rails 大约 6 个月了，所以我对它相当陌生。我从来没有在 Rails 和 js 中做过这样的事情，也找不到可靠的指南。
以上是我得到的，我卡住了。希望从那里获得一些帮助以使图像上传正常工作。
【问题讨论】：
标签： ruby-on-rails ruby ruby-on-rails-4 carrierwave froala