我使用Axios来执行如下的HTTP post:
import axios from 'axios'
params = {'HTTP_CONTENT_LANGUAGE': self.language}
headers = {'header1': value}
axios.post(url, params, headers)
这对吗?或者我应该这样做:
axios.post(url, params: params, headers: headers)
我使用Axios来执行如下的HTTP post:
import axios from 'axios'
params = {'HTTP_CONTENT_LANGUAGE': self.language}
headers = {'header1': value}
axios.post(url, params, headers)
这对吗?或者我应该这样做:
axios.post(url, params: params, headers: headers)
当前回答
你可以初始化一个默认头axios.defaults.headers
axios.defaults.headers = {
'Content-Type': 'application/json',
Authorization: 'myspecialpassword'
}
axios.post('https://myapi.com', { data: "hello world" })
.then(response => {
console.log('Response', response.data)
})
.catch(e => {
console.log('Error: ', e.response.data)
})
其他回答
如果你想用参数和头来做一个get请求。
这是瓦尔 paramName1: paramValue1 paramName2: paramValue2 …… 瓦尔希德斯 headerName1: headerValue1 headerName2: headerValue2 …… Axios。输入url然后(res = >—— console.log (res.data.representation); 新程序);
使用异步/等待
Axios post签名 Post (url:字符串,数据?: any, config?: AxiosRequestConfig): Promise<AxiosResponse> data和config都是可选的 AxiosRequestConfig可以查看- https://github.com/axios/axios/blob/e462973a4b23e9541efe3e64ca120ae9111a6ad8/index.d.ts#L60
....
....
try {
....
....
const url = "your post url"
const data = {
HTTP_CONTENT_LANGUAGE: self.language
}
const config = {
headers: {
"header1": value
},
timeout: 1000,
// plenty more options can be added, refer source link above
}
const response = await axios.post(url, data, config);
// If Everything's OK, make use of the response data
const responseData = response.data;
....
....
}catch(err){
// handle the error
if(axios.isAxiosError(err){
....
....
}
}
@user2950593 您的axios请求是正确的。您需要在服务器端允许您的自定义头。 如果你在php中有api,那么这段代码将为你工作。
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, HEAD");
header("Access-Control-Allow-Headers: Content-Type, header1");
一旦您允许在服务器端使用自定义头文件,axios请求就可以正常工作了。
我必须创建一个fd=new FormData()对象,并在将它通过axios发送到我的Django API之前使用[.append()][1]方法,否则我会收到一个400错误。 在我的后端,配置文件图像通过一对一的关系与用户模型相关联。因此,它被序列化为一个嵌套对象,并期望put请求能够工作。
对前端状态的所有更改都是使用this完成的。设置状态的方法。我认为最重要的部分是最后的handleSubmit方法。
首先我的axios put请求:
export const PutUser=(data)=>(dispatch,getState)=>{
dispatch({type: AUTH_USER_LOADING});
const token=getState().auth.token;
axios(
{
¦ method:'put',
¦ url:`https://<xyz>/api/account/user/`,
¦ data:data,
¦ headers:{
¦ ¦ Authorization: 'Token '+token||null,
¦ ¦ 'Content-Type': 'multipart/form-data',
¦ }
})
¦ .then(response=>{
¦ ¦ dispatch({
¦ ¦ ¦ type: AUTH_USER_PUT,
¦ ¦ ¦ payload: response.data,
¦ ¦ });
¦ })
¦ .catch(err=>{
¦ ¦ dispatch({
¦ ¦ ¦ type:AUTH_USER_PUT_ERROR,
¦ ¦ ¦ payload: err,
¦ ¦ });
¦ })
}
我的handleSubmit方法需要创建以下json对象,其中图像属性被实际的用户输入所取代:
user:{
username:'charly',
first_name:'charly',
last_name:'brown',
profile:{
image: 'imgurl',
}
}
下面是我在组件中的handleSumit方法: 检查附加
handleSubmit=(e)=>{
¦ e.preventDefault();
¦ let fd=new FormData();
¦ fd.append('username',this.state.username);
¦ fd.append('first_name',this.state.first_name);
¦ fd.append('last_name',this.state.last_name);
¦ if(this.state.image!=null){fd.append('profile.image',this.state.image, this.state.image.name)};
¦ this.props.PutUser(fd);
};
有几种方法可以做到:
For a single request: let config = { headers: { header1: value, } } let data = { 'HTTP_CONTENT_LANGUAGE': self.language } axios.post(URL, data, config).then(...) For setting default global config: axios.defaults.headers.post['header1'] = 'value' // for POST requests axios.defaults.headers.common['header1'] = 'value' // for all requests For setting as default on axios instance: let instance = axios.create({ headers: { post: { // can be common or any other method header1: 'value1' } } }) //- or after instance has been created instance.defaults.headers.post['header1'] = 'value' //- or before a request is made // using Interceptors instance.interceptors.request.use(config => { config.headers.post['header1'] = 'value'; return config; });