2

我正在开发一个使用 Angular 5 前端和 Rails 5 后端的应用程序。两者都是通过 JSON 进行通信的 API。此外，为了上传，我将 Shrine gem 与 Uppy 一起使用。为了开始上传和运行，我遵循了这两个教程： https://github.com/shrinerb/shrine-tus-demo， https://github.com/shrinerb/shrine/wiki/Adding-Resumable-Uploads

我遇到的问题是要将数据发送到 rails，从 Temple 上传的 name 属性和 rails 附件必须匹配才能将数据传递给 rails 应用程序。因此，从教程中，这是：

# models/movie.rb

class Movie < Sequel::Model
  include VideoUploader::Attachment.new(:video)
end

必须与 name 属性相匹配：

<div class="form-group">
  <input type="hidden" name="movie[video]" value="<%= @movie.cached_video_data %>" class="upload-hidden">
  <input type="file" name="movie[video]" class="upload-file">
</div>

由于我没有使用 Rails 前端，因此数据不太容易传递。有什么办法可以调和两者。我尝试将以下内容作为名称属性值传递给 Rails API：

name="movie[video]"
name="video"

我什至尝试过发送 JSON 值，例如：

name="{
  "id":"http://endpoint.com/files/226eed1388bbd1b7f029897ad2b86f16",
  "storage":"cache",
  "metadata":{
    "filename":"SampleVideo_720x480_1mb.mp4",
    "size":1057149,
    "mime_type":"video/mp4"
  }
}"

因为这与我可以在 rails 控制台中使用 movie.video 时相同的 JSON 格式相匹配。

有什么办法可以使这项工作？

编辑：

好吧，我问错问题了。抱歉，这是我第一个没有遵循教程的项目。我花了很多时间试图完成这项工作：

name="{
  "movie": {
    "video": {
      "id":"http://endpoint.com/files/226eed1388bbd1b7f029897ad2b86f16",
      "storage":"cache",
      "metadata":{
        "filename":"SampleVideo_720x480_1mb.mp4",
        "size":1057149,
        "mime_type":"video/mp4"
      }
    }
  }
}"

在我意识到数据是通过 tus-js-client 和 tus-server 发送之前。因此，正确的问题应该是如何将正确的 name 属性发送到 tus-js-client 以便可以将其发送到 tus-server 并最终传递给 Rails 应用程序。有关后端的更多信息，这里是创建动作和电影参数：

def create
    movie = Movie.new(movie_params)

                if movie.save
                        render json: movie, status: 201
                else
                        render json: { errors: movie.errors }, status: 422
                end
        end

private

                def movie_params
                #       params.permit(:title, :year, :plot, :video_data)
                       params.require(:movie).permit(video: [metadata: [:title, :year, :plot]])
                #       params.require(:movie).permit!
                end

另外，对于我如何发送这些信息，我使用的是 Uppy 的内置提交。这放弃了 Angular 通常的提交方法，因此通过 tus-js-client（我认为）提交。如果信息意味着什么，我花了很长时间尝试各种方式尝试提交名称属性，使其与附件属性匹配。

4

0 回答 0