如何从 Sanity 获取数据到 React？

Question

我无法理解如何从理智中获取数据。我已经阅读了文档，但我仍然感到困惑。

我尝试将数据记录到控制台，但它给我一个错误，例如 "No 'Access-Control-Allow-Origin' header is present on the requested resource."

import React from "react";
import sanityClient from "@sanity/client";

const Post = () => {
  const client = sanityClient({
    projectId: "6sf5fafo",
    dataset: "production",
    useCdn: true
  });
// fetching the data
  client
    .fetch('*[__type == "post"][0]{title, "name": author->name}', {})
    .then(res => {
      console.log("Post info: ", res); // Here is when i tried to log the data but gets an error message.
    })
    .catch(err => {
      console.log(err);
    });
  return (
    <div>
      <h1>Hello</h1>
    </div>
  );
};
export default Post;

谁能对我的代码进行一些编辑以正确地从理智中获取数据，我们将不胜感激。

Answer 1

您收到此错误是因为 Sanity 拒绝来自未知浏览器来源的访问。默认情况下（生成新项目时），唯一允许的来源是 http://localhost:3333。您可以授予对任何其他来源的访问权限。

假设您是运行您在 https://studio.mysite.com 上的 Content Studio，并且想要授予对 URL 的访问权限。有两种方法：

打开您的终端，将目录切换到您保存 Studio 源代码的位置，然后键入：

sanity cors add https://studio.mysite.com

转到您的项目设置并通过网络添加来源 UI。由于您的 projectId 是 6sf5fafo，因此可以在 https://manage.sanity.io/projects/6sf5fafo/settings/api

有关 Sanity 和 CORS 的更多信息，请参阅 https://www.sanity.io/docs/front-ends/cors

上的文档

如何从 Sanity 获取数据到 React？

How to fetch data from Sanity to React?

cors

reactjs

sanity