CORS - 在本地工作，但 API 不断响应浏览器请求 [重复]

Question

我在 Node.js 中有一个我想保护的 API，以便它仅响应本地（开发中）和前端（生产中的 React 应用程序）发出的请求。下面是我如何配置它的示例，在 CORS 选项中只允许 localhost 和我的域发出的请求（只是一个示例），它甚至可以工作。我的前端当前在端口 3000 上运行，如果我将 cors 更改为仅允许 3001，例如，由于 CORS，它会阻止访问并且后端不响应前端，这正是 CORS 工作和只允许来自我允许的源的请求的访问，您可以在下面看到我的 app.js 文件的一部分，我在其中配置了 CORS 的行为方式

var corsOptions = {
    origin: ['http://localhost:3000', 'https://meudominio.com.br'],
    optionsSuccessStatus: 200 
  }

app.use(cors(corsOptions));

// Authenticate database connection
connection.authenticate().then(() => {
    console.log('Connected to database');
})

// Parsing the application to json
app.use(express.json()) 
app.use(express.urlencoded({ extended: true }))

// Setting static folder
app.use(express.static(__dirname + '/public'));

// Setting routes
app.use(routes);

// Server listener
app.listen(process.env.PORT || 8080, () => {
    console.log('The server is running');
})

将相同的代码投入生产时，我的前端实际上具有 API 访问权限，但是当我直接从浏览器访问 API URL 时，它会不断以相同的方式为访问 URL 的任何用户返回数据，这会导致CORS 不起作用，因为其目的正是为了让您只能访问 localhost 和前端上的 API。本地测试，通过本地运行的浏览器访问路由时，同样的方式，我可以访问所有的数据，这是我想避免的。

enter image description here

我已经学习了几个来自不同 CORS 的教程，尝试了不同的形状和结构，但行为始终相同，允许前端访问 API，但任何用户仍然可以通过浏览器以相同的方式访问访问 API 端点时。

有什么建议吗？非常感谢！

Answer 1

您对 CORS 的理解有误。 CORS 不是对 API 的锁定，只能在某些域中工作。 CORS 是浏览器上的一个锁，只通过某个域与 API 通信。

如果您从托管 API 的同一 URL 访问 API，则您的请求实际上是有效的并通过 CORS，因为它位于同一来源！

如果您想锁定 API 以在某些域中工作，您可以检查标头中的引用者；但是，这可以被欺骗！

锁定 API 的最佳方法是密钥 :)