[英]Error: Request Failed with status code 400 - React - API Key
this is my code:这是我的代码:
import "./styles.css";
import "mvp.css";
import { useState, useEffect } from "react";
import axios from "axios";
function Books() {
const [book, setBook] = useState("");
const [result, setResult] = useState([]);
const [apiKey, setApiKey] = useState(
""
);
function handleChange(event) {
const book = event.target.value;
setBook(book);
}
function handleSubmit(event) {
event.preventDefault();
axios
.get(
"https://www.googleapis.com/books/v1/volumes?q=" +
book +
"&key=" +
apiKey +
"&maxResults=100"
)
.then((data) => {
console.log(data);
});
}
return (
<div className="App">
<h1>Search For A Book</h1>
<form onSubmit={handleSubmit}>
<div className="form-group">
<input
type="text"
onChange={handleChange}
className="input"
placeholder="Search..."
/>
<button type="submit" className="btn">
Go!
</button>
</div>
</form>
</div>
);
}
export default function App() {
return <Books />;
}
Is anyone able to figure out why I am unable to get this to work?有谁能弄清楚为什么我无法让它工作? I keep getting a Request failed error and I am not sure what is going wrong.
我不断收到请求失败错误,我不确定出了什么问题。 I have manually entered my url into the my browser such as this:
我已经手动将我的 url 输入到我的浏览器中,如下所示:
https://www.googleapis.com/books/v1/volumes?q=javascript&key=APIKEY
https://www.googleapis.com/books/v1/volumes?q=javascript&key=APIKEY
But when I do it through my code it is not working.但是,当我通过我的代码执行此操作时,它不起作用。
Thanks in advance.提前致谢。
As you can see, your url in axios is: https://www.googleapis.com/books/v1/volumes?q=javascript&key=apiKey&maxResults=100可以看到,你的axios中的url是: https://www.googleapis.com/books/v1/volumes?q=javascript&key=apiKey&maxResults=100
So that why return http code 400, you should remove &maxResults=100所以为什么返回 http 代码 400,你应该删除&maxResults=100
maxResults should be less than <= 40 according to recommendation.根据建议,maxResults 应小于 <= 40。 Update the max result in code.
更新代码中的最大结果。 It would work after that
之后它会起作用
What's the erro message?错误信息是什么? If "API key not valid. Please pass a valid API key."
如果“API 密钥无效。请传递有效的 API 密钥。” u api key is wrong.
u api 密钥错误。 This page will help you https://cloud.google.com/apis/design/errors
此页面将帮助您https://cloud.google.com/apis/design/errors
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.