发布请求以包含“Content-Type”和 JSON
Posted
技术标签:
【中文标题】发布请求以包含“Content-Type”和 JSON【英文标题】：Post request to include 'Content-Type' and JSON 【发布时间】：2013-10-27 02:43:02 【问题描述】：我将使用 goo.gl 来缩短 URL。我需要提出以下要求：
POST https://www.googleapis.com/urlshortener/v1/url
Content-Type: application/json
"longUrl": "http://www.google.com/"
我的 html:-
<form method="post" action="https://www.googleapis.com/urlshortener/v1/">
<button type="submit"> submit </button>
</form>
如何在此处添加“内容类型”和 json？
【问题讨论】：
您可以通过 ajax 提交表单并在那里添加 content-type 。 @Ghost 为什么你需要使用 ajax？ @Prateek 默认内容类型是“application/x-www-form-urlencoded”，现在要更改它，应该更改表单的“enctype”属性。由于发送 JSON 数据所需的问题以及我建议使用这里也适用的 ajax 请求。我不知道如何在没有 ajax 的情况下发送 JSON 数据。 【参考方案1】：可以通过 javascript 从浏览器发出 JSON POST 请求
大多数浏览器（自 2020 年起应支持 Fetch API）允许您使用 JSON 发出 POST 请求。 See the MDN reference here - 当然，您必须在 javascript 中执行此操作。【讨论】：
【参考方案2】：HTML 表单不支持 JSON，您必须使用 AJAX 发送 JSON。
但是如果你只是想测试一个应用程序的安全性，看看它是否容易受到 CSRF 攻击，有一个 hack 可以将 JSON 数据作为纯文本发送，如本文所述：https://systemoverlord.com/2016/08/24/posting-json-with-an-html-form.html
HTML 表单的优点是不需要启用 JavaScript，并且不像 AJAX XMLHttpRequest 那样具有同源策略保护，因此 HTML 表单可以将数据发送到任何第三方域。 事实上，看起来也可以使用 XMLHttpRequest 向第三方域发送 GET 和 POST 请求（您只会收到一条警告，说您无法读取响应），即使 CORS 不允许，只要您不要将 Content-Type 标头更改为“application/json”：https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS?redirectlocale=en-US&redirectslug=HTTP_access_control#Examples_of_access_control_scenarios
这是文章中的一个例子：
<body onload='document.forms[0].submit()'>
<form method='POST' enctype='text/plain'>
<input name='"secret": 1337, "trash": "' value='"'>
</form>
</body>
但是，如果您尝试将 enctype 表单参数设置为“application/json”而不是“text/plain”，它将无法被识别并导致默认的“application/x-www-form-urlencoded” Content-Type HTTP 标头。
某些应用程序会检查 Content-Type HTTP 标头是否为“application/json”，因此可以防止 CSRF 攻击（除非您安装了 Flash Player：https://www.geekboy.ninja/blog/exploiting-json-cross-site-request-forgery-csrf-using-flash/）。更好的安全性是使用真实性令牌，这将保护 HTTP 请求，即使数据类型不是 JSON。否则，也可以在 session ID cookie 上使用 sameSite 属性来防止 CSRF (https://www.owasp.org/index.php/SameSite)。
【讨论】：
这个答案对我帮助很大。最终创建了一个 javascript 库来启用它：github.com/keithhackbarth/submitAsJSON @keithhackbarth 我更新了我的答案，我认为发送 JSON 的 HTML 表单只有在您想在不启用 JavaScript 的情况下发送数据时才有用（因此，如果没有 JavaScript，库将无法工作）。否则你可以直接使用 XMLHttpRequest。【参考方案3】：浏览器不支持 JSON 作为表单提交的媒体类型（支持的类型为 listed in the spec）。
从网页发出此类请求的唯一方法是使用 XMLHttpRequest 对象。
Google 提供了a JavaScript library（包装了 XMLHttpRequest），可以与他们的URL Shortener API 进行交互。
【讨论】：
【参考方案4】：使用 Ajax 请求让生活更轻松。
$.ajax(
url: 'https://www.googleapis.com/urlshortener/v1/url',
type: 'POST',
data: JSON.stringify(
longUrl: $scope.url
),
contentType: 'application/json',
success: function(got)
return alert("shortened url: " + got.id);
);
以上方法完美。
【讨论】：
以上是关于发布请求以包含“Content-Type”和 JSON的主要内容，如果未能解决你的问题，请参考以下文章
设置 Content-Type：在 Angular js 发布请求中
Next.js 动态 api 页面无法响应带有 Content-Type=application/json 标头的 post 请求
REST 错误-请求包含实体主体但没有 Content-Type 标头。推断的媒体类型 application/octet-stream 不支持此资源