Fetch:为什么我的内容类型在改变？

Question

这就像是两个问题合而为一。我在Rails方面相当扎实，但在react/redux上还是个新手，我正在努力在react/redux应用程序上实现身份验证。

我已经构建了一个Rails4API。它经过了良好的测试和可靠的测试。我的Rails API使用的是devise-token-auth gem。

fetch('http://localhost:8080/api/auth/sign_in', {
  method: 'POST',
  headers: {'Content-Type': 'application/json', 'Accept': "application/vnd.myproject.v1"},
  body: {email: email, password: password},
  ... // snip response handling
})

然而，当它发送一个请求时，我的应用程序接口返回一个401 Unauthorized，请求失败。

检查服务器日志，我发送的请求正文没有显示出来。

params: {"format"=>"json", "controller"=>"devise_token_auth/sessions", "action"=>"create"}

在我的浏览器的网络视图中查看该请求，我看到了包含以下内容的sign_in请求：

accept:application/vnd.myproject.v1
content-type:text/plain;charset=UTF-8

我看到content-type现在是text/plain。(有趣的是"accept“是小写的……我也想知道这一点。)

有人能给我解释一下发生了什么事吗？

Answer 1

您需要在post请求中发送X-CSRF-TOKEN，否则您应该跳过verify_authenticity_token

如果您想跳过authenticity_token验证，可以使用如下命令：

class ApplicationController < ActionController::Base
  protect_from_forgery
  skip_before_action :verify_authenticity_token, if: :json_request?

  protected

  def json_request?
    request.format.json?
  end
end

如果您想设置header，请参见示例jQuery Ajax请求：

              $.ajax({
                        type: 'POST',
                        dataType: 'script',
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader('X-CSRF-Token',
                                $('meta[name="csrf-token"]').attr('content'));
                        }, url: $(ui.item).closest('.sortable').data("sortable-link"),
                        success: function (data) {
                            ....
                        }
                    });