Question

我正在尝试从简单的React.js应用删除用户。我收到302错误，我的控制台也显示此错误。

Fetch API无法加载http://localhost:3001/。对预检的反应   请求未通过访问控制检查：否   请求中存在“Access-Control-Allow-Origin”标头   资源。因此不允许原点'null'访问。如果是不透明的   响应满足您的需求，将请求的模式设置为'no-cors'   在禁用CORS的情况下获取资源。

未捕获（承诺）TypeError：无法获取

我在客户端的删除请求如下所示：

export function deleteUser(id){
  return fetch(`http://localhost:3000/api/v1/users/${id}`, {
    method: 'DELETE'
  }).then( res => res.json() )
}

顶级容器中的功能是：

handleDeleteUser(id){
    localStorage.clear('token')
    deleteUser(id)
    .then((data) => this.setState({
      current_user: data
    }))
  }

我遇到过很多关于CORS的答案。这是我在服务器端的application.rb文件：

module Our_gardenApi
  class Application < Rails::Application
    config.api_only = true

     config.middleware.insert_before 0, Rack::Cors do
      allow do
        origins '*'
        resource '*', :headers => :any, :methods => [:get, :post, :delete, :patch, :options]
      end
    end
  end
end

我的UsersController也试图像这样重定向：

def destroy
  user = User.find(params[:id])
  user.destroy
  redirect_to "http://localhost:3001"
end

gem'chair-cors'也安装在我的Gemfile中。

最后，用户被成功删除。我刚刚遇到重定向问题。 非常感谢任何有关解释的帮助！

Answer 1

将此gem添加到您的gem文件中：

https://github.com/cyu/rack-cors

运行捆绑安装

然后在application.rb文件中进行此配置

module YourApp
  class Application < Rails::Application

    # ...

    # Rails 5

    config.middleware.insert_before 0, Rack::Cors do
      allow do
        origins '*'
        resource '*', :headers => :any, :methods => [:get, :post, :options]
      end
    end

    # Rails 3/4

    config.middleware.insert_before 0, "Rack::Cors" do
      allow do
        origins '*'
        resource '*', :headers => :any, :methods => [:get, :post, :options]
      end
    end

  end
end

React.js应用程序没有'Access-Control-Allow-Origin'标头

1 个答案: