ruby-on-rails - HTTP :No 'Access-Control-Allow-Origin' header is present on the requested resource-6ren

ruby-on-rails - HTTP :No 'Access-Control-Allow-Origin' header is present on the requested resource

转载作者：行者123 更新时间：2023-12-04 03:53:31

我有 2 个项目:

rails 项目。
angularjs 项目。

现在我想在 angularjs 项目中使用 rails 模型。我有一个由 scaffold 创建的 widget 模型。现在我想通过 http 和 post 方法从 angularjs 项目添加一个新的 widget 到 rails 项目。为此，我有以下代码:

angularproject/js/app.js:

var app = angular.module("app",[]);

app.controller("AppCtrl", function($http){
    app = this;
    $http.get("http://localhost:3000/widgets.json")
        .success(function(data){
            console.log(data)
            app.peaple = data;
        })
    app.addWidget = function (widget){
        $http.post("http://localhost:3000/widgets",widget)
    }
})

angularproject/index.html:

<!doctype html>
<html>
<head>
    <script src="js/angular.min.js"></script>
    <script src="js/app.js"></script>
</head>
<body ng-app="app" ng-controller="AppCtrl as app">
<!--add new widget by post method in http-->
<input type="text" ng-model="app.widget.name">
<input type="text" ng-model="app.widget.price">
<input type="button" ng-click="app.addWidget(app.widget)">
<!--display all widget-->
<ul>
    <li ng-repeat="widget in app.peaple">
        {{widget.name}}<br/>{{widget.price}}
    </li>
</ul>
</body>
</html>

我将以下代码添加到 Rails 项目中:application_controller.rb

#add this line for allow to get widget json
after_filter :cors_set_access_control_headers
  private
  def cors_set_access_control_headers
    headers['Access-Control-Allow-Origin'] = '*'
    headers['Access-Control-Allow-Methods'] = 'POST, GET, OPTIONS'
    headers['Access-Control-Allow-Headers'] = %w{Origin Accept Content-Type X-Requested-With X-CSRF-Token}.join(',')
    headers['Access-Control-Max-Age'] = "1728000"
  end

widgets_controller.rb:

# GET /widgets
# GET /widgets.json
  def index
    @widgets = Widget.all
  end
# POST /widgets
# POST /widgets.json
  def create
    @widget = Widget.new(widget_params)

    respond_to do |format|
      if @widget.save
        format.html { redirect_to @widget, notice: 'Widget was successfully created.' }
        format.json { render action: 'show', status: :created, location: @widget }
      else
        format.html { render action: 'new' }
        format.json { render json: @widget.errors, status: :unprocessable_entity }
      end
    end
  end

通过这段代码，我可以获得 widget json 并显示给用户，但是当我完成新的 widget 字段并发布到 Rails Controller 时，出现以下错误在控制台上:

XMLHttpRequest cannot load http://localhost:3000/widgets. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access.

以及 Rails 服务器日志中的以下错误:

Started OPTIONS "/widgets" for 127.0.0.1 at 2014-07-18 18:02:05 +0430

ActionController::RoutingError (No route matches [OPTIONS] "/widgets"):
  actionpack (4.0.3) lib/action_dispatch/middleware/debug_exceptions.rb:21:in `call'
  actionpack (4.0.3) lib/action_dispatch/middleware/show_exceptions.rb:30:in `call'
  railties (4.0.3) lib/rails/rack/logger.rb:38:in `call_app'
  railties (4.0.3) lib/rails/rack/logger.rb:20:in `block in call'
  activesupport (4.0.3) lib/active_support/tagged_logging.rb:67:in `block in tagged'
  activesupport (4.0.3) lib/active_support/tagged_logging.rb:25:in `tagged'
  activesupport (4.0.3) lib/active_support/tagged_logging.rb:67:in `tagged'
  railties (4.0.3) lib/rails/rack/logger.rb:20:in `call'
  actionpack (4.0.3) lib/action_dispatch/middleware/request_id.rb:21:in `call'
  rack (1.5.2) lib/rack/methodoverride.rb:21:in `call'
  rack (1.5.2) lib/rack/runtime.rb:17:in `call'
  activesupport (4.0.3) lib/active_support/cache/strategy/local_cache.rb:83:in `call'
  rack (1.5.2) lib/rack/lock.rb:17:in `call'
  actionpack (4.0.3) lib/action_dispatch/middleware/static.rb:64:in `call'
  rack (1.5.2) lib/rack/sendfile.rb:112:in `call'
  railties (4.0.3) lib/rails/engine.rb:511:in `call'
  railties (4.0.3) lib/rails/application.rb:97:in `call'
  rack (1.5.2) lib/rack/lock.rb:17:in `call'
  rack (1.5.2) lib/rack/content_length.rb:14:in `call'
  rack (1.5.2) lib/rack/handler/webrick.rb:60:in `service'
  C:/Ruby200-x64/lib/ruby/2.0.0/webrick/httpserver.rb:138:in `service'
  C:/Ruby200-x64/lib/ruby/2.0.0/webrick/httpserver.rb:94:in `run'
  C:/Ruby200-x64/lib/ruby/2.0.0/webrick/server.rb:295:in `block in start_thread'


  Rendered C:/Ruby200-x64/lib/ruby/gems/2.0.0/gems/actionpack-4.0.3/lib/action_dispatch/middleware/templates/rescues/_trace.erb (0.0ms)
  Rendered C:/Ruby200-x64/lib/ruby/gems/2.0.0/gems/actionpack-4.0.3/lib/action_dispatch/middleware/templates/routes/_route.html.erb (1.0ms)
  Rendered C:/Ruby200-x64/lib/ruby/gems/2.0.0/gems/actionpack-4.0.3/lib/action_dispatch/middleware/templates/routes/_table.html.erb (1.0ms)
  Rendered C:/Ruby200-x64/lib/ruby/gems/2.0.0/gems/actionpack-4.0.3/lib/action_dispatch/middleware/templates/rescues/routing_error.erb within rescues/layout (38.0ms)

问题出在哪里？如何向 angularjs 项目添加权限以在数据库中添加新的 widget？

最佳答案

您的 rails 应该允许 http“选项”方法(预检请求)。要了解有关预检请求的更多信息，请查看此 link

或者查看 rack-cors gem，它允许你像路由文件一样配置它

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

关于ruby-on-rails - HTTP :No 'Access-Control-Allow-Origin' header is present on the requested resource，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24826333/

文章推荐： wcf-data-services - OData、Atom、Json和WCF数据服务有什么关系

文章推荐： ruby-on-rails - 无法找到操作 'facebook' - devise/omniauth

文章推荐： ruby-on-rails - 多个模型的 Doorkeeper 资源所有者凭证流

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

ruby-on-rails - HTTP :No 'Access-Control-Allow-Origin' header is present on the requested resource

您的 rails 应该允许 http“选项”方法(预检请求)。要了解有关预检请求的更多信息，请查看此 link