javascript - 有没有办法在 fetch 调用后渲染 js.erb ？

Question

在我的 Rails 应用程序中，我想在 fetch 调用后渲染 js.erb 部分，由于某些原因，我不明白它不起作用。如果你能帮助我，那就太好了。

在 View 中，事件触发此函数，该函数基本上执行获取请求:

function updateState(id, state){
      const csrfToken = document.querySelector('meta[name="csrf-token"]').attributes
          .content.value;
      fetch(window.location.origin + "/update_state", {
          method: "POST",
          headers: {
            'Accept': "JS",
            "Content-Type": "application/json",
            "X-CSRF-Token": csrfToken
          },
          body: JSON.stringify({'id': id, 'state': state}),
          credentials: "same-origin"
        })
}

然后在我的 Controller 中:

  def update_state
    @model = Model.find(params[:id])
    authorize @model
    @model.update(state: params[:state])

    respond_to do |format|
      format.html { redirect_to xxx }
      format.js
    end
  end

在我的 js.erb 文件中:

console.log('hello');

但是，在这种情况下，我从服务器收到错误:ActionController::未知格式在“respond_to do |format|”行我感觉服务器不理解获取的 header :“接受”:“JS”

当我查看服务器日志时:

Started POST "/update_state" for 127.0.0.1 at 2019-04-04 11:22:49 +0200
Processing by ModelsController#update_state as JS

但我认为 Rails 无法识别它。我该怎么办？

我也在 Controller 中尝试过这个:

  def update_state
    @model = Model.find(params[:id])
    authorize @model
    @model.update(state: params[:state])
    render 'update_state.js', layout: false
  end

这不会引发错误。我在客户端收到了 js.erb。但是，它没有被执行(console.log 没有执行)。

你有什么想法吗？非常感谢您的帮助。

Answer 1

我以相反的方式进行管理。我从未成功使用 js.erb。

因此，我使用带有文本响应的 fetch 调用:

function updateState(id, state){
  const csrfToken = document.querySelector('meta[name="csrf-token"]').attributes
      .content.value;
  fetch(window.location.origin + "/update_state", {
      method: "POST",
      headers: {
        'Accept': "JS",
        "Content-Type": "application/json",
        "X-CSRF-Token": csrfToken
      },
      body: JSON.stringify({'id': id, 'state': state}),
      credentials: "same-origin"
    }).then(response => response.text())
      .then(data => {
       div.inserAdjacentHTML('XXX', data);
    });
}

然后在 Controller /操作中:

  def update_state
    @model = Model.find(params[:id])
    authorize @model
    @model.update(state: params[:state])
    render 'update_state.js', layout: false, content_type: "text/plain"
  end

这样，它就有效了。希望对您有所帮助。