我正在遵循Udemy的教程,并在这里卡住了:
Yelp.js
import axios from "axios";
export default axios.create({
baseURL : 'https://api.yelp.com/v3/businesses',
headers : {
Authorization :
'Bearer ****************'
}
})
SearchScreen.js
const SearchScreen = () => {
const [term, setTerm] = useState('');
const [results, setResults] = useState([]);
const searchApi = async () => {
const response = await yelp.get('', {
params : {
term : term,
location: 'san jose'
}
});
setResults(response.data);
}
return (
<View style={styles.backgroundStyle}>
<SearchBar
term = {term}
onTermChange = {setTerm}
onTermSubmit = {searchApi} />
<Text>We have found {results.length} results</Text>
</View>
);
};
const styles = StyleSheet.create({
backgroundStyle : {
backgroundColor : '#FFFFFF',
flex: 1
}
})
export default SearchScreen
当触发searchApi时,我在控制台中看到此错误
[Unhandled promise rejection: Error: Network Error]
at node_modules/axios/lib/core/createError.js:15:17 in createError
at node_modules/axios/lib/adapters/xhr.js:114:22 in handleError
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:609:10 in setReadyState
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:396:6 in __didCompleteResponse
at node_modules/react-native/Libraries/vendor/emitter/_EventEmitter.js:135:10 in EventEmitter#emit
具有相同授权密钥的相同API在Postman中工作。我是不是漏掉了什么?
6条答案
按热度按时间irlmq6kh1#
如果连接不是问题所在,错误就在请求上,也许API试图让你知道错误代码,但你没有捕获它。
像这样执行try/catch:
然后检查您的控制台。
xsuvu9jc2#
您需要使用try catch块捕获错误。如果您没有收到任何错误,那么您也可以在Web浏览器的开发人员面板中检查网络XHR调用。在开发人员面板中,您可以确切地看到API调用URL,头部和主体,以及您可以看到从API接收的响应。
Chrome浏览器-> https://developer.chrome.com/docs/devtools/open/
Firefox -> https://developer.mozilla.org/en-US/docs/Tools/Web_Console
如果你需要进一步的帮助,请随时从网络面板发布屏幕截图或将代码推送到github以进一步调试。
gpnt7bae3#
这可能是一个CORS错误。参见Calling Yelp API from frontend JavaScript code running in a browser
该代码不能从具有CORS保护的浏览器运行。如果你必须这样做,你可以尝试使用第三方浏览器扩展或其他方式禁用CORS。(风险自担!)
hl0ma9xz4#
@housefly
我认为 Postman GET请求和axios请求之间的区别在于隐藏的头。Postman有内部逻辑来附加请求类型和标题,即使你没有提到。如果您使用Axios手动查询没有足够的标题。请在您的axios API调用中尝试以下标题。
lmyy7pcs5#
通过活动的开发人员工具检查网络选项卡中的XHR请求。如果您的API中出现错误。如果你得到的响应是正确的,那么通过捕获异常来调试你的代码。
laik7k3q6#
你可能会错过其中一个标题
1.服务器期望的一些自定义头
1.起源