此问题是由浏览器中的CORS
OPTIONS请求引起的,与axios无关。https://developer.nps.gov要求
Authorization所有HTTP请求(包括OPTIONS)中的标头。但是,所有自定义HTTP标头都将从OPTIONS中排除,请参阅https://www.w3.org/TR/cors/#cross-
origin-request-with-preflight-0
国家公园服务API不需要
AuthorizationOPTIONS请求的标头,但确实如此。无论如何,有一种解决方法:在您自己的后端中进行转发,接收来自浏览器的HTTP请求,从后端中的https://developer.nps.gov检索数据,最后将其返回给浏览器。
实际上,从浏览器发送带有第三方授权密钥的HTTP请求绝对不是一个好主意-这种设计会将您的National Park Service
API密钥暴露给所有访问该页面的人,这当然是很危险的事情。
您的第一个解决方案(axios默认标头的配置API密钥)是可以的。我尝试使用自己的API密钥和您的URL,响应代码为200 OK。
对于第二种解决方案,该
config对象应用作
headersaxios语句中的字段。该代码将是:
axios.get('https://developer.nps.gov/api/v0/parks?parkCode=yell', {headers: config})


