Javascript 反应获取api失败

我正在尝试从randomuser.me获取，我的组件是：

import React, { Component } from 'react';

class RandomUser extends Component {
    state = {
        contacts:[]
    }

    async   componentDidMount(){
        const url = 'http://api.randomuser.me?results=20';
        const response = await fetch(url, {mode: 'cors'});
        const data = await response.json();
        console.log(data);
    }

    render(){
    console.log(this.state.contacts);
        return (
            <div>
                <h2>Users:</h2>
            </div>
            )
    }
}

export default RandomUser;

import React，{Component}来自'React'；
类用户扩展组件{
状态={
联系人：[]
}
异步组件didmount（）{
常量url=http://api.randomuser.me?results=20';
const response=wait fetch（url，{mode:'cors'}）；
const data=wait response.json（）；
控制台日志（数据）；
}
render（）{
console.log（this.state.contacts）；
返回(
用户：
)
}
}
导出默认用户；

我在console中看到的错误是：

在获取时访问'http://api.randomuser.me/?results=20“起源”http://localhost:3000'已被CORS策略阻止：请求的资源上不存在'Access Control Allow Origin'标头。如果不透明响应满足您的需要，请将请求的模式设置为“无cors”，以获取禁用cors的资源。

我如何纠正它？我没有使用任何本地服务器，并且依赖于randomuser.me

---

请提供帮助。

在不设置获取模式的情况下尝试。我还有一个使用randomuser API的React项目，我只是

等待获取（url）

，这一直都是有效的。

@Quentin

函数postData（url=''，data={}）{//默认选项标记为*return fetch（url，{方法：'POST'，//*GET，POST，PUT，DELETE等。模式：'cors'，//无cors，cors，*同一来源…

from@Quentin也在这里使用code

let response=wait fetch（url）；