当从axios, react和typescript发送到.net核心端点时， GUID为0000000- 0000000

Question

我这里有一个。net端点:

public class ListContactRequest
{
public Guid userId { get; set; }
}
[Authorize]
[HttPost]
[Route("listContacts")]
public async Task<AddressBookListContacts> listContacts([FromBody]ListContactRequest req)
{
return blah blah....
}

和我的react axios调用在typescript

import { Guid } from "guid-typescript";
interface IListContactRequest {
userId: Guid;
}
const ListContacts = (user: IListContactRequest) => {
console.log(user);
return axios
.post(API_URL + "/listContacts", user, {
headers: {
"Content-Type": "application/json",
},
})
.then((response) => {
return response.data;
});
};

问题是，当axios方法触发时，它到达。net端点，然而，参数对象中的guid以0000000- 0000000- 0000000- 000000000000

当控制台记录前端时，guid显示正确，但当它到达后端api时，它似乎没有延续。

有人能给点建议吗?

console.log(JSON.stringify(user))  

显示

{"userId"{"value"24883 e12汽油- 439 d - 4 - e54 aae5 - 5 b1d5140833e"}}

Answer 1

您的Guid作为具有value属性的对象序列化为JSON，但您的c#模型不匹配。

您可以使用Guid.prototype.toString()或Guid.prototype.toJSON()方法来获得正确的值

axios.post("/listContacts", {
userId: user.userId.toJSON().value // or user.userId.toString()
}, {
baseURL: API_URL
});

看到https://github.com/snico-dev/guid-typescript props-and-methods

---

也许一个更简洁的选择是使IListContactRequest成为一个类，而不是实现自己的toJSON()方法

class ListContactRequest {
constructor(readonly userId: Guid) {}
toJSON() {
return {
userId: this.userId.toJSON().value,
};
}
}
const user = new ListContactRequest(Guid.create());
axios.post(url, user);