Symfony React Cors问题
是指在使用Symfony框架结合React开发时，出现的跨域资源共享（Cross-Origin Resource Sharing，CORS）问题。CORS是浏览器的一种安全机制，用于限制不同源之间的跨域HTTP请求。解决该问题的方法通常是通过设置服务器端的响应头来允许跨域请求。
在Symfony框架中，可以通过安装并配置NelmioCorsBundle来解决React与Symfony之间的CORS问题。NelmioCorsBundle是一个提供了CORS处理功能的Symfony扩展包。以下是解决该问题的步骤：
- 安装NelmioCorsBundle: 在Symfony项目的根目录下执行以下命令：
- 安装NelmioCorsBundle: 在Symfony项目的根目录下执行以下命令：
- 配置NelmioCorsBundle:
在Symfony项目的
config/bundles.php文件中添加以下代码： - 配置NelmioCorsBundle:
在Symfony项目的
config/bundles.php文件中添加以下代码： - 然后，在Symfony项目的
config/packages/nelmio_cors.yaml文件中进行CORS的配置，例如： - 然后，在Symfony项目的
config/packages/nelmio_cors.yaml文件中进行CORS的配置，例如： - 上述配置中，
allow_origin指定允许跨域请求的源，这里设置为['*']表示允许所有源，但也可以根据实际需求设置特定的源。allow_methods指定允许的HTTP方法，allow_headers指定允许的请求头。 - 启用NelmioCorsBundle:
在Symfony项目的
config/packages/framework.yaml文件中启用NelmioCorsBundle，添加以下代码： - 启用NelmioCorsBundle:
在Symfony项目的
config/packages/framework.yaml文件中启用NelmioCorsBundle，添加以下代码： - 以上配置会启用NelmioCorsBundle，并将CORS的处理集成到Symfony框架中。
通过以上步骤配置完NelmioCorsBundle后，就可以解决Symfony React应用中的CORS问题了。该解决方案允许设置允许跨域的源、请求方法和请求头，以满足实际需求。
关于腾讯云的相关产品，推荐腾讯云COS（对象存储）和腾讯云API网关。腾讯云COS提供了可扩展的、低成本的对象存储服务，适用于存储和处理各种类型的媒体文件。腾讯云API网关是一种全托管的API网关服务，可用于管理和发布API，同时提供了CORS配置等功能。以下是它们的产品介绍链接地址：
通过使用腾讯云的COS和API网关，可以进一步完善Symfony React应用中的文件存储和API管理功能。
相关·内容
我有个问题..。使用APIPlatform和React，我想用Symfony mailer发送邮件，我使用自定义操作。
这里是我实现我的选择的所有页面
<?php
namespace App\Controller;
use App\Entity\Contact;
use Symfony\Bridge\Twig\Mime\TemplatedEmail;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Mailer\MailerInterface;
class ContactMailContr
浏览 0提问于2020-06-16得票数 0
1回答
我在端口8000上有一个带有symfony/ API -plateform的REST api，在端口3000上有一个前端应用程序React
在我的React应用程序中:我想获取带有url的文件
let url = 'http://localhost:8000/delivrables/school/2021/b1_cpd/homework_matiere_0__devoir_0/picard-%C3%89lisabeth.zip'
axios.get(url)
.then(res => {
console.log(res)
})
但是我得到
浏览 4提问于2021-09-13得票数 1
2回答
从我的React前端，我向我的Symfony后端发送一个请求。(以前它在纯PHP后端工作得很好)。
useEffect(() => {
axios.get('http://localhost:8080/real_estate_refactored_backend/main').then((response) => {
console.log(response);
})
.catch((error) => {
console
浏览 5提问于2021-03-23得票数 0
我正在使用Symfony和React开发一个API Rest作为前端“框架”。
当尝试使用Postman连接到GET请求的URL时，例如，它可以完美地工作。但是当我尝试连接React应用时，我收到了这样的错误消息："localhost/:1从源‘’访问XMLHttpRequest被CORS策略阻止:请求的资源上不存在‘Access -Control-Allow-’头。“
我指定使用ORM而不是MongoDB。
所以看起来一切都应该由NelmioCorsBundle ()来管理。
我已经安装了Bundle，根据文档做了所有我必须做的事情。我在论坛上找到的config/nelmio_cor
浏览 2提问于2019-07-09得票数 1
我的Symfony 5应用程序就有这个问题，它就是我的API。我正在从同一个域和不同子域上的另一个应用程序向我的Symfony应用程序发出请求。 当我的Symfony应用程序中的调试模式设置为true APP_DEBUG = 1时，一切都很好。但是，如果我禁用调试模式APP_DEBUG = 0，则来自其他应用程序的请求会导致CORS错误： Access to XMLHttpRequest at 'https://api.mamacita365.com/api/getmeals'
from origin 'https://app.mamacita365.com'
浏览 16提问于2021-08-10得票数 0
回答已采纳
我们有一个用Django构建的rest api，作为客户端，我们将使用react-js应用程序从服务器获取数据。 我们的问题是Django API不支持CORS头，所以我想在react中禁用这个选项。 如何通过React How CORS头禁用react cors？
浏览 24提问于2021-01-26得票数 0
处理从React应用程序到Symfony的印前检查请求现在变得太难了，我正在尝试修复过去8小时的问题，这是我得到的错误， Access to XMLHttpRequest at 'https://mylocaldomain.com/validate-token' from origin 'http://myreactapplocal:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does
浏览 25提问于2021-07-06得票数 1
1回答
我正在用symfony开发一个API，当然我已经考虑到cors了。我安装了nelmio-cors-bundle，但是头没有到达客户端：
我的配置如下：
nelmio_cors:
defaults:
allow_credentials: true
allow_origin: []
allow_headers: []
allow_methods: []
expose_headers: []
max_age: 0
hosts: []
origin_regex: fa
浏览 7提问于2015-03-16得票数 0
2回答
当我试图启动我的功能测试时，出现了一个错误。
“BrowserKit组件不可用。”
php ./bin/phpunit
#!/usr/bin/env php
PHPUnit 6.5.14 by Sebastian Bergmann and contributors.
Testing Project Test Suite
E.. 3 / 3 (100%)
Time: 367 ms, Memory: 16.00MB
There was 1 error:
1) Ap
浏览 0提问于2019-02-22得票数 2
回答已采纳
我在一个新的Symfony 4项目中使用了带有PHPUnit 7.1.3的CodecellationV2.4.1。
我创建了一个功能测试，并尝试运行它，但收到一个错误：./vendor/bin/codecept run functional
There was 1 error:
---------
1) CustomerControllerCest: Customers on index
Test tests/functional/Controller/Internal/CustomerControllerCest.php:customersOnIndex
[Symfony\Com
浏览 0提问于2018-05-05得票数 5
我无法从React前端连接到python后端。 这就是错误 polling-xhr.js:268 GET http://localhost:5000/socket.io/?EIO=3&transport=polling&t=NEzs39W net::ERR_CONNECTION_REFUSED 前端代码(监听http://localhost:3000 )： import React from 'react';
import { render } from 'react-dom';
import io from "socket.io-cl
浏览 23提问于2020-08-05得票数 1
1回答
我的Expressjs API和React客户端之间的连接有一个小问题。 Express API -> http://localhost:3001 React -> http://exampleip:3000 (两者都在同一个windows服务器上) 我添加了CORS包并添加了以下代码 const express = require('express');
const cors = require('cors');
const app = express();
app.use(cors());
... other code
app.use(&#
浏览 17提问于2021-11-04得票数 0
回答已采纳
reactjs码
import axios from 'axios';
import {useEffect,useState} from 'react';
import ReactDOM from "react-dom/client";
import React from "react";
const App = () => {
const [res,setRes] = useState(null);
useEffect(()=>{
document.cookie="hello
浏览 5提问于2022-06-19得票数 0
1回答
刚刚开始了一个新项目，使用Symfony 4作为API，Vue作为前端/应用程序。
Vue开始抱怨CORS，所以我开始发送所需的CORS头(Access-Control-Allow-Origin)。
然后，它开始说‘对预飞的响应不具有HTTP状态’。
我现在黑了我的API，强制状态代码始终是200，但我正在寻找一个长期的解决方案。为什么我的API--使用Symfony 4构建的--不以OK状态响应？
浏览 0提问于2019-01-23得票数 1
我已经有一个使用bower组件(日期选择器、滑块、切换器、下拉列表、图表等)的HTML管理模板。此模板有一个布局，我想在我的应用程序中使用。
我想知道我能不能使用这个模板和react-boilertplate。
我已经在React和Symfony中使用了这个模板，没有任何问题，运行得非常好。其结构类似于：
- Main Symfony App folder
- Some Symfony folder
- Some Symfony folder
- the SRC Symfony folder where I Have all the bundles
-
浏览 0提问于2017-05-24得票数 0
2回答
我在YouTube上看过一个很棒的教程，里面的react是用DRF手动设置的。在整个教程中，根本没有使用csrf令牌和django-cors-headers。我正在尝试使用npx create-react-app来实现同样的功能，但是使用这种方式，csrf令牌和cors会成为一个问题。我怎样才能用我的drf/react应用程序避免CSRF和CORS！ 这是教程：https://www.youtube.com/watch?v=6c2NqDyxppU&t=1s
浏览 29提问于2021-03-20得票数 0
回答已采纳
1回答
我正在尝试从url中获取返回的数据。到url的卷曲结果如下：
{“姓名”：“你好世界！”}
下面是我的App.js中的代码
import React, { Component } from 'react';
import Contacts from './components/contacts';
class App extends Component {
render() {
return (
<Contacts contacts={this.state.contacts} />
)
}
state = {
浏览 3提问于2019-12-08得票数 4
回答已采纳
我在我的主机和域上使用express CORS模块和react AXIOS。
我在我的路由中间件中定义了CORS()，GET请求工作得很好。
但是对于POST和PUT请求，仍然会显示Access-Control-Allow-Origin BLOCKED错误。
此外，我还使用了webpack和开发服务器来代理前端react
这是我的express server.js文件
const express = require("express");
const app = express();
const db = require("./config/db");
db.
浏览 2提问于2020-03-01得票数 0
我展示了一张课程列表，但我想随机显示，我不知道该怎么做。
random.component.ts
export class RandomComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
courses:any[]=[
'laravel','symfony','angular','react',
'laravel1','symfony1','angular1',
浏览 3提问于2022-04-15得票数 -1
回答已采纳
我将react与express一起使用，我最初认为它是由cors策略引起的，所以我在express中需要cors并使用cors，但它仍然显示相同的问题error messages in console Code snippet
浏览 206提问于2021-09-27得票数 1
我在react.js项目中工作，我必须从JIRA rest api中获取数据并使用react.js显示它。当我直接从浏览器访问API时，它工作得很好，但当我尝试使用react.js获取它时，它会导致下面的错误。
CORS策略已阻止对从源'‘获取'API’的访问:请求的资源上不存在' Access -Control-Allow- origin‘标头。如果不透明的响应满足您的需求，请将请求的模式设置为'no- CORS‘，以便在禁用CORS的情况下获取资源。
注意：
我尝试了“no- cors”模式，甚至安装了npm cors lib，但都不能解决问题。
React
浏览 2提问于2018-11-28得票数 0
我正在从React调用Flask API (两者都在本地主机上运行)，我遇到了CORS问题。发出请求时，浏览器(Chrome)会显示以下错误
Access to XMLHttpRequest at 'http://localhost:5000/sas' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not all
浏览 12提问于2020-03-05得票数 1
ReactJS代码
import axios from 'axios';
import {useEffect,useState} from 'react';
import ReactDOM from "react-dom/client";
import React from "react";
const App = () => {
const [res,setRes] = useState(null)
useEffect(() => {
document.cookie='he
浏览 1提问于2022-06-19得票数 0
回答已采纳
大家好，我正在尝试在laravel 7.4中安装媒体库，但出现了以下错误：
Problem 1
- Installation request for symfony/console 5.0.1 -> satisfiable by symfony/console[v5.0.1].
- Installation request for spatie/laravel-medialibrary ^8.1 -> satisfiable by spatie/laravel-medialibrary[8.1.0].
- Can only install one of: symfony/proce
浏览 9提问于2020-04-13得票数 0
因此，我一直在开发一个向Django REST-API发送请求的React项目。问题是，我似乎无法绕过CORS的问题。前端与后端完全隔离。为了确保网站正常工作，我需要让Django为前端文件提供服务。我不确定从哪里开始，我如何设置Django + React环境，这样我就不必处理CORS问题了？
浏览 9提问于2017-07-28得票数 1
1回答
目前在Symfony 3.x上学习教程。
我的问题是在使用此代码的getAction()方法中遇到了问题。
namespace SwipeBundle\Controller\Backend\API;
use FOS\RestBundle\Controller\Annotations as Rest;
use FOS\RestBundle\Controller\FOSRestController;
use Symfony\Component\HttpFoundation\Response;
use FOS\RestBundle\View\View;
class UserController
浏览 6提问于2017-05-02得票数 1
好的，我有一个symfony项目，它使用两个不同的端口，
和服务器127.0.0.1:3000。
所以很明显，我得到了CORS错误，在做了一些研究后，我找到了Symfony的Nelio CorsBundle。但是，我指定的选项仅应用于options /印前检查请求，GET或POST仍然没有来自该捆绑包的任何标头。这是我的设置：
nelmio_cors:
defaults:
origin-regex: true
allow_origin: ["^http://localhost:[0-9]+"]
allow_meth
浏览 5提问于2018-04-11得票数 0
1回答
我想从我的GCP中获取pdf文件，但是我得到了CORS错误。好的，np。我试着在GCP中找到解决这个问题的方法。找到此示例： https://bitmovin.zendesk.com/hc/en-us/articles/360000059353-How-do-I-set-up-CORS-for-my-Google-Cloud-Storage-Bucket- 我已经遵循了所有这些说明： echo '[{"origin": ["*"],"responseHeader": ["Content-Type"],"metho
浏览 24提问于2019-10-06得票数 1
1回答
在部署我的angular5+symfony应用程序时，我发现了一些错误，无论我的配置是什么，我仍然得到：
跨源请求被阻止:相同的原产地策略不允许在 中读取远程资源(原因: CORS预飞通道没有成功)。
问题是，路径/一些-url/adicionar (post)工作，但没有其他任何工作。我跟踪了一些文档，以便在apache或虚拟主机中全局设置CORS原点，但仍然无法工作。
最后，这是我的nelmio配置，应该允许所有的来源。
nelmio_cors:
defaults:
allow_credentials: false
allow_origin:
浏览 2提问于2018-03-28得票数 0
回答已采纳
我已经搜索了整个StackOverflow，看到了类似的问题，但还没有找到一个有效的解决方案。想知道是否有人有一个可行的解决方案？我在localhost:3000上开发了一个创建react应用程序，并试图通过我的Apollo客户端访问不同站点上的URI (我正在使用进行测试)。
我已经将'no- CORS‘的fetchOptions模式添加到我的新ApolloClient实例中，但在我的控制台中仍然收到CORS错误。我的enitre index.js文件如下：
import React from 'react';
import ReactDOM from 're
浏览 0提问于2019-09-11得票数 14
我的应用程序使用Symfony作为后端，使用React作为前端。有没有一种在React中通过将Symfony form转换为react form来动态构建form的方法？在React应用程序中渲染Symfony表单？
浏览 8提问于2020-01-28得票数 2
我有一个运行在3000端口上的小型react客户端和一个运行在端口3001上的小型快速服务器。当我单击一个按钮时，请求将被发送到服务器。但是，POST请求打印空体，响应不传递。不过，服务器正确地标识了POST或GET请求。Chrome的控制台打印：
错误: SyntaxError:意外的输入结束(在App.tsx:41:1处)
在App.tsx:41:1
(匿名)@ App.tsx:50
Promise.catch (异步)
buttonClick2 @ App.tsx:48
callCallback @react dom.Development.js:4164
invokeGuardedCa
浏览 6提问于2022-09-08得票数 0
我有两个应用在nginx服务器上运行:我的Symfony API：******.com和我的React应用：******.com
我正在使用jwt身份验证，但由于cors策略，我无法连接到我的API。它也不能与nelmio cors捆绑包一起工作，但与Postman没有问题。
我的nelmio cors配置：
nelmio_cors:
defaults:
origin_regex: true
allow_origin: ['%env(CORS_ALLOW_ORIGIN)%']
allow_methods: ['GE
浏览 24提问于2019-11-20得票数 0
我试图使一个axios获得请求，但我得到的策略错误。我对axios有点陌生，这是我尝试过的：
useEffect(() => {
let url =
'http://18.189.49.66:3000/api/calculate/' +
props.type +
'/' +
height +
'/' +
width;
var config = {
headers: { 'Access-Control-Allow-Origin'
浏览 5提问于2020-02-17得票数 1
回答已采纳
1回答
CORS政策的问题:帮助
描述
大家好！
我为后端创建了一个使用Strapi的React应用程序，我不知道如何设置CORS策略。Strapi在我的在线服务器上，我在本地计算机上运行React应用程序。当我试图用Axios发送请求时，出现了以下问题：
CORS策略阻止从“”从“”到“”对XMLHttpRequest的访问:对飞行前请求的响应不通过访问控制检查:请求的资源上不存在“访问控制-允许-原产地”报头。
我在配置文件夹中创建了middleware.js文件，如文档：中所述
module.exports = {
load: {
before: ['timer',
浏览 3提问于2020-11-21得票数 1
回答已采纳
我有一个带有react前端和django后端的web应用程序。部分后端API被cors策略封堵，部分未被封堵。例如，用于获取博客帖子const res = await axios.get(`${process.env.REACT_APP_API_URL}/blog/posts`)的API正在返回数据，但是用于单个帖子const res = await axios.get(`${process.env.REACT_APP_API_URL}/blog/${slug}`);的API被阻塞。注册和登录API也被阻止。我已经将域名添加到settings.py中允许的url列表中，但这并没有解决问题。我
浏览 179提问于2021-10-23得票数 0
我已经有几天没能找到正确的方法了，但我无法下决心，所以我决定去看看你的经历:)
我的项目是开发一个会员管理网站/会费/.为了一个(小)协会。我想将React用于前端，Symfony 4用于后端，因为这是我掌握得最好的两种技术。
我的问题是：(1)我应该启动Symfony项目并集成React，还是(2)应该启动React项目并为我的应用程序创建一个带有Symfony的API？
实际上，如果我继续第一种解决方案，我最大的问题就是我不知道如何管理我的应用程序的路由(通过React或Symfony)。
如果使用第二种方法，恐怕我的应用程序不太安全(向身份验证管理部门报告)。
这就是我希望享受您的灯光，
浏览 0提问于2018-10-16得票数 0
回答已采纳
我正在尝试将React模块安装到我的Symfony 4项目中。我已经设置了React入口点，并且正在使用webpack安可运行，现在我想要向React应用程序添加一个模块。
React模块有一个github，可以通过npm安装，但如何将其安装到Symfony中？如何处理包中的webpack.config.js和package.json文件，因为Symfony有自己的文件。
我已经比较了webpack.config.js，似乎Symfony可以覆盖另一个，因为它已经涵盖了React入口点和babel设置。我做什么好？
我遇到的另一个问题是原来的模块已经过时了，所以我将项目分支到我的存储库，更新了
浏览 0提问于2018-12-31得票数 0
我正在尝试构建一个简单的React/Node/Socket.io应用程序。
这是React app.js
import React, { useState, useEffect } from "react";
import socketIOClient from "socket.io-client";
const ENDPOINT = "http://127.0.0.1:4001";
function App() {
const [response, setResponse] = useState("");
useEf
浏览 1提问于2021-07-11得票数 2
回答已采纳
我正在使用javascript来呈现React组件。
Javascript代码段
function loadRemoteComponent(url) {
return fetch(url)
.then(res => res.text())
.then(source => {
var exports = {}
function require(name) {
if (name == 'react') return Rea
浏览 3提问于2019-03-14得票数 0
4回答
App.js：
import React from 'react';
import './App.css';
class App extends React.Component {
state = {
character : {}
};
componentDidMount() {
fetch("https://jobs.github.com/positions.json?description=basf")
.then(data => console.log(data));
consol
浏览 0提问于2019-12-30得票数 2
我对CORS的角6/Symfony 4项目有一个问题。本项目具有登录/注册模块。默认情况下，我使用FOSUserBundle并将其设置为false。然后，我发送一个电子邮件与确认链接()，以验证它不是一个机器人。该链接重定向到一个特殊页面的角谁放置用户帐户，以启用它。问题是，在笔记本电脑上任何浏览器都能正常工作，但是当我想用手机做的时候，没有附加任何东西。我试图提醒错误消息，我得到了以下信息：
{"headers":{"normalizedNames":{}, "lazyUpdate":null,"headers": {}},&#
浏览 1提问于2019-01-17得票数 0
2回答
我正在用下面的代码从我的React应用程序发送一个post请求。
// https://react-app.com
await fetch('https://node-backend-on-aws-lambda-api.com/stage/resource', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
mode: 'cors',
body: JSON.stringi
浏览 1提问于2021-06-19得票数 1
当我将react应用部署到Heroku时，我遇到了一个问题：
Access to fetch at 'https://rs-yoga-prod.herokuapp.com/' from origin 'https://rs-react-prod.herokuapp.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' he
浏览 0提问于2018-11-06得票数 3
我正在构建一个react原生项目。我已经做了同样的项目的网站。我把它部署在Heroku上，没有任何问题，它可以工作。当我尝试使用react原生应用程序在本地服务器上获取数据时，它不起作用，但当我使用部署的项目url时，它起作用了。 例如： http://127.0.0.1:8000/api/sosyalmedya/不工作。 http://mydeployedwebsite.com/api/sosyalmedya/工作。 我的settings.py和部署的一样。 在我的settings.py中，我添加了这些； ALLOWED_HOSTS = ['*']
CORS_ORIGIN_
浏览 16提问于2021-09-30得票数 0
回答已采纳
我使用获取我的用户在线/离线状态。
这是我在onClose文件中的WebSocketHandler.php函数代码：
public function onClose(ConnectionInterface $connection)
{
$allChannels = $this->channelManager->getChannels($connection->app->id);
foreach ($allChannels as $channelData) {
$data = $channelData;
浏览 17提问于2022-05-11得票数 0
我不能理解问题是什么，我通过fetch得到一个请求，我试着看看会发生什么，但是什么都不起作用
import React from 'react';
import './SearchLine.css';
export class SearchLine extends React.Component {
constructor(props) {
super(props)
this.state = { data: []}
}
MakeARequest(request) {
fetch("h
浏览 2提问于2019-04-21得票数 0
我在https://example.com (PHP7.4 Symfony 5.1)上有一个具有ssl证书的主api主机，在https://my.example.com上有一个前端域(使用React的生产版本部署) CORS已经配置，并且可以在域间成功读取cookie。 $response->headers->set('Access-Control-Allow-Origin', '*');
$response->headers->set('Access-Control-Allow-Headers', &#
浏览 58提问于2020-10-19得票数 0
回答已采纳
1回答
我正在使用Symfony API后端，并希望通过Vue应用程序中的Axios通过REST调用进行身份验证。
当使用邮递员时，身份验证工作正常。它存储会话cookie，并在随后的请求中重新发送它。
然而，当我使用Axios时，它不会给我设置Cookie头。
到目前为止我尝试过的：
调整了Symfony后端上的CORS设置(没有CORS错误-所有路由都在工作)在Axios post请求上设置了{ withCredentials: true }作为配置参数。
注入CORS头的Symfony EventSubsriber：
public function onKernelResponse(Respon
浏览 6提问于2022-08-23得票数 0
我一直在寻找这个问题的解决方案，但显然我还没有找到一个解决方案，因为我发布了这个问题。我知道我以前这样做过，所以我不知道我是如何工作的，但我收到以下消息:阻止加载混合活动内容，但React文件位于Symfony文件所在的相同服务器和域中
我的Symfony base.html.twig文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{% block title %}Welcome! Tari
浏览 2提问于2020-04-26得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
