从源获取的访问已被 CORS 策略阻止(React 使用 MSAL 身份验证)

问题描述 投票:0回答:0

我正在按照本教程使用 MSAL 对 React 应用程序进行身份验证,并使用身份验证令牌调用 api:https://github.com/oizhaolei/typescript-msal-sample

我添加了以下代码来进行 api 调用:

function GetJobs() {
    const [jobs, setJobs] = useState([]);
    const [err, setError] = useState({});

    useEffect(() => {      
        callMsGraph()
        .then(response => setJobs(response))
        .catch(err => setError(err));      
    }, [])

    return (
        <div>
          {jobs.length > 0 ? <Job jobs={jobs} /> : (<Loader />)}
        </div>
        
    );
  }

const SignInSignOutButton = () => {
    const { inProgress } = useMsal();
    const isAuthenticated = useIsAuthenticated();

    if (isAuthenticated) {

        return (       
        <div>
            <SignOutButton />
            <GetJobs />
            
        </div>);
    } else

运行时,我看到 CORS 错误:

Access to fetch at 'https://xxxx/api/v1/jobs' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

我错过了什么?

reactjs asp.net cors msal aspnetcore-environment
© www.soinside.com 2019 - 2024. All rights reserved.