Ruby on rails 如何解决重定向到github omniauth路由时的CORS错误？

我正在尝试构建一个简单的应用程序，目前只使用GitHub登录进行身份验证。我在后端使用RailsV5.2.3，在前端使用React。目前，我的根组件中有一个按钮，用于向后端发送ajax请求。该请求将命中my

SessionController

中的一个操作，该操作将重定向到

/auth/github

路由并开始github验证周期

我相信这一步就是我出错的地方

我的浏览器控制台显示以下错误消息：

Access to XMLHttpRequest at 'https://github.com/login/oauth/authorize?
client_id=db494fb7eadbc0c6129d&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fauth%2Fgithub%2Fcallback&resp
onse_type=code&state=79557eda02a2340f9c02b5254f053528314ea750704690ae' (redirected from 
'http://localhost:3000/authenticate/github') from origin 'http://localhost:3000' has been blocked by CORS
 policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

以下是一些我认为相关的文件：

Gemfile

源代码'https://rubygems.org'
git|u源（：github）{| repo |“https://github.com/#{repo}.git}
ruby“2.5.1”
#捆绑边缘Rails：gem'Rails'，github'Rails/Rails'
gem'rails'，“~>5.2.3”
#使用postgresql作为活动记录的数据库
宝石'pg'，'>=0.18'，'<2.0'
#使用Puma作为应用程序服务器
宝石“彪马”，“大于3.11”
#将SCS用于样式表
gem'sass-rails'，“~>5.0”
#使用Uglifier作为JavaScript资产的压缩器
gem'uglifier'，'>=1.3.0'
#看https://github.com/rails/execjs#readme 获取更多受支持的运行时
#宝石“迷你赛车手”，平台：：ruby
#将CoffeeScript用于.coffee资产和视图
gem“咖啡轨”，“~>4.2”
#轻松构建JSON API。阅读更多：https://github.com/rails/jbuilder
gem'jbuilder'，“~>2.5”
#使用Redis适配器在生产中运行操作电缆
#gem'redis'，“~>4.0”
#使用ActiveModel具有\u安全\u密码
#gem'bcrypt'，“~>3.1.7”
gem'omniauth github'，github:'omniauth/omniauth github'，分支：'master'
宝石“费加罗”
宝石“机架cors”
#使用ActiveStorage变量
#宝石“迷你魔法”，“~>4.8”
#使用Capistrano进行部署
#gem“capistrano rails”，集团：：开发
#通过缓存减少启动时间；config/boot.rb中需要
gem'bootsnap'，'>=1.1.0'，require:false
小组：开发，：测试
#在代码中的任意位置调用“byebug”以停止执行并获得调试器控制台
gem'byebug'，平台：[：mri，：mingw，：x64_mingw]
结束
小组：发展怎么办
#在异常页面上或通过调用代码中的任意位置的“控制台”访问交互式控制台。
gem“web控制台”，“>=3.3.0”
gem'listen'，'>=3.0.5'，'<3.2'
#Spring通过让应用程序在后台运行来加速开发。阅读更多：https://github.com/rails/spring
宝石“春天”
gem‘SpringWatcherListen’，“~>2.0.0”
gem“更好的错误”
gem“绑定\u调用方的\u”
宝石“撬轨”
结束
组：测试do
#增加了对Capybara系统测试和selenium驱动程序的支持
gem‘水豚’，“>=2.15”
gem“selenium webdriver”
#轻松安装和使用chromedriver，使用Chrome运行系统测试
宝石“chromedriver助手”
结束
#Windows不包括zoneinfo文件，因此捆绑tzinfo数据
gem'tzinfo data'，平台：[:mingw，:mswin，:x64_mingw，:jruby]

routes.rb

Rails.application.routes.draw do
获取“/authenticate/：type”到：“sessions#authenticate”
获取“/auth/：provider/callback”到：“会话#创建”
root to:'静态页面#root'
结束

initializers/github.rb

Rails.application.config.middleware.use OmniAuth:：Builder do
提供者：github，ENV['github\u KEY'，ENV['github\u SECRET']
结束

sessions\u controller.rb

class sessioncontroller

root.jsx

import React，{useState}来自“React”；
从“axios”导入axios；
常量根=（）=>{
const[name，setName]=useState（'还没有名字'）；
常量githubLogin=（）=>{
get（'authenticate/github'）
.then（user=>setName（user.name））；
}
返回(
Github登录
名称：{Name}
)
}
导出默认根目录；

经过一点研究，我看到了一些添加

rackcors

gem的建议。我试着这样做，并添加了这个初始值设定项

initializers/cors.rb

Rails.application.config.middleware.insert_在0之前，Rack:：Cors do
放置“设置cors”
允许做
起源“*”
资源“*”，头：：any，方法：[：get，：post，：patch，：put]
结束
结束

在建立oauth方面，我是一个新手，我正在努力解决这个问题，但这让我很困惑。我不确定我的重定向是否得到了不需要阻止的标题，我确定从这里开始该怎么做

---

任何帮助都将不胜感激。请让我知道，如果有任何其他信息，我可以提供。谢谢。

由于重定向是在XHR上下文中发生的，所以您会收到错误

一种解决方案是将XHR设置为您的控制器，并返回客户端必须遵循的URL

另一种方法是不创建XHR，而是使用指向您的操作的简单链接

---

无论哪种方式，您都应该确保不从JS请求GitHub URL。它必须是一个平面HTTP（s）请求。

您可以打开

http://localhost:3000/authenticate/github

在您的浏览器中？我认为你不应该用xhr来做oauth。是的，如果我只是访问那个url，我就可以登录了。这一点以及公认的答案帮助了我。非常感谢。非常感谢。这是有道理的。我将按钮更改为只是一个指向操作的普通链接，并且没有再次收到错误，看起来我也收到了来自GitHub的回调。