在angular中提交带有数据的表单时出错

Question

我累了提交表单数据，但从laravel api得到json解码错误。我无法访问laravel api端。当我试图从swagger提交它时，它工作得很好。

curl -X 'POST' 
'https://example.com/create-reference' 
-H 'accept: application/json' 
-H 'Authorization: Bearer 883|DuNTAVq5Yl2FbeNEpWMk64dpiF0z8Nem1QG0fHUo54545' 
-H 'Content-Type: multipart/form-data' 
-F 'file=@dart-overview-slide.pdf;type=application/pdf' 
-F 'reference={
"contact_person": "Dalia Kadoch",
"email": "[e-mail]",
"phone_number": "7821503357",
"address": "Heriot House, Heriot Road, Chertsey, KT16 0DT",
"company_name": "The Big Word",

}'

当我尝试从angular提交它时，我的表单主体看起来像这样，并得到错误。

{
"file" : "tes",
"reference" : {
"id": 1,
"contact_person": "Dalia Kadoch",
"email": "[e-mail]",
"phone_number": "7821503357",
"address": "Heriot House, Heriot Road, Chertsey, KT16 0DT",
"company_name": "The Big Word",
"document_url": "https://image.com/image.jpeg"
} }

但是我从laravel得到json.decode()错误。

json_decode():参数#1 ($json)必须是string类型的数组

Answer 1

swagger/curl请求正在提交包含两个字段名为file和reference的FormData。

从curl手册:

- f/——形式& lt; name = content>

(HTTP)这允许curl模拟用户按下提交按钮的已填写表单。根据RFC1867，这会导致curl使用内容类型multipart/form-data来POST数据。这允许上传二进制文件等。要强制'content'部分是一个文件，请在文件名前加上@符号。要从文件中获取内容部分，请在文件名前加上字母<@和<然后@使文件作为文件上传附加在帖子中，而><创建一个文本字段，然后从文件中获取该文本字段的内容。>

在你的Angular方法中，看起来你提交了一个带有file和reference字段的JSON对象，但JSON对象不是FormData。

你可以在下面的Stack Overflow文章中学习如何提交FormData:如何在angular 2的http post请求中发送表单数据