Javascript 请求失败，axios.get中的状态代码为403（禁止）

我正在使用react.js和musixmatch api构建一个简单的歌词查找应用程序。当我请求api时，我在控制台中得到了这个错误

error:request失败，状态代码403位于createError（createError.js:16）处，状态代码403位于settle（settle.js:17）位于XMLHttpRequest.handleLoad（xhr.js:62）

这是我的componentDidMount（）函数

import React，{Component}来自'React'；
从“axios”导入axios；
const Context=React.createContext（）；
导出类提供程序扩展组件{
状态={
跟踪列表：[]，
标题：“前10首曲目”
}
componentDidMount（）{
axios.get(
`https://cors-anywhere.herokuapp.com/https://api.musixmatch.com/ws/1.1/chart.tracks.get?chart_name=top&page=1&page_size=5&country=it&f_has_lyrics=1&apikey=${
process.env.REACT\u APP\u MM\u KEY}`
)
.then（res=>console.log（res.data））
.catch（err=>console.log（err））；
}
render（）{
返回(
{this.props.children}
);
}
}
export const Consumer=Context.Consumer状态代码403表示您未经授权。您可能输入了错误的api密钥，或者您的process.env不起作用（请尝试直接输入api密钥！）

你确定你在任何地方都需要cors吗？你有没有试过不穿衣服

编辑：

当您只需在浏览器中输入带有密钥的url（任何地方都没有汽车）时，您可以测试api密钥是否有效，如下所示：


编辑2：

当我在React应用程序中尝试时，这是可行的：因此问题一定出在process.env实现上

componentDidMount() {
    axios.get(
        `https://cors-anywhere.herokuapp.com/https://api.musixmatch.com/ws/1.1/chart.tracks.get?chart_name=top&page=1&page_size=5&country=it&f_has_lyrics=1&apikey=your_api_key`
    )
        .then(res => console.log(res.data))
        .catch(err => console.log(err));
}

你确定url正确吗？当我用api键在浏览器中输入url时，它就会工作。我还尝试直接输入api密钥（没有cors anywhere），但仍然出现错误。我认为cors anywhere服务器限制访问，在这种情况下，您必须运行自己的。是的，当我在浏览器中输入url（没有cors anywhere）时，api工作正常。现在我该怎么办。请帮助我，我是react和javascript的begnner。尝试在没有cors的情况下使用组件内部的url，并且直接使用api键（将url中的代码粘贴到get请求中）。我完全按照你说的做了，但现在我遇到了这些错误。。。。。GET net:：ERR_失败请参见上面我编辑的答案。它在我这边起作用（即使在任何地方使用cors）。检查您的env实现！现在问题终于解决了。在浏览器中打开带有cors anywhere的链接后，我必须单击按钮（请求临时访问演示服务器），然后单击该按钮并刷新react应用程序后，我得到了所需的结果。