POST 제출 데이터 의 --- Content - Type 의 이해;
14646 단어 http
네트워크 요청 에 자주 사용 되 는 Content - type 은 text / html, text / plain, text / css, text / javascript, image / jpeg, image / png, image / gif, application / x - www - form - urlencoded, multipart / form - data, application / json, application / xml 등 이 있 습 니 다.
그 중에서 text / html, text / plain, text / css, text / javascript, image / jpeg, image / png, image / gif 는 흔히 볼 수 있 는 페이지 자원 유형 입 니 다.
application / x - www - form - urlencoded, multipart / form - data, application / json, application / xml 이 네 가 지 는 ajax 의 요청, 폼 제출 또는 파일 업로드 에 자주 사용 되 는 자원 형식 입 니 다.
form 폼 에서 enctype 속성 을 정의 할 수 있 습 니 다. 이 속성 은 서버 에 보 내기 전에 폼 데 이 터 를 어떻게 인 코딩 해 야 하 는 지 를 의미 합 니 다.기본적으로 폼 데 이 터 는 "application / x - ww - form - unlencoded" 로 인 코딩 됩 니 다.
enctype 에서 자주 사용 하 는 속성 값 은 다음 과 같 습 니 다. application / x - www - form - unlencoded: 보 내기 전에 모든 문 자 를 인 코딩 합 니 다 (기본 값).multipart / form - data, 문자 인 코딩 이 아 닙 니 다.파일 업로드 시 이 값 을 사용 합 니 다.
1. application / x - www - form - urlencoded 는 주로 다음 과 같은 데 사 용 됩 니 다. 1.1: 가장 흔히 볼 수 있 는 POST 제출 데이터 방식 입 니 다.1.2: 원생 form 의 기본 제출 방식 (enctype 으로 제출 데이터 형식 을 지정 할 수 있 습 니 다).1.3: jquery, zepto 등 기본 post 가 제출 을 요청 하 는 방식 입 니 다.
1. 먼저 form 폼 에서 post 기본 제출 방식 의 데 이 터 를 살 펴 봅 니 다.코드 는 다음 과 같 습 니 다:
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<div id="app">
<form action="http://www.example.com" method="POST">
<p>username: <input type="text" name="fname"/></p>
<p>age: <input type="text" name="age"/></p>
<input type="submit" value=" "/>
</form>
</div>
</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/e5066e730f7eb54593b566daf2b12723.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p>application/x-www-form-urlencoded , GET/POST , key1=value1&key2=value2<br/> , utf-8 , %20;</p>
<p> application/x-www-form-urlencoded , chrome network , 。 formData ;</p>
<p> ajax ;</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>
<title/>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<script type="text/javascript" src="https://tugenhua0707.github.io/html5UploadImage/js/jquery.js"/>
<div id="app">
<div class="btn"> post </div>
</div>
<script>
var obj = {
"name": 'CntChen',
"info": 'Front-End',
};
$('.btn').click(function() {
$.ajax({
url: 'www.example.com',
type: 'POST',
dataType: 'json',
data: obj,
success: function(d) {
}
})
});
</script>
</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/a52ecb07e077839f65ffaae93c9956c0.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p> contentType application/x-www-form-urlencoded, :<br/> username=111&age=2;</p>
<p> type GET , url ; POST, http body Form Data 。</p>
<p><strong> :multipart/form-data</strong><br/> , enctype multipart/form-data. , --boundary ;</p>
<p>html :</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>
<title/>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<div id="app">
<form action="http://www.example.com" method="POST" enctype="multipart/form-data">
<p>username: <input type="text" name="fname"/></p>
<p>age: <input type="text" name="age"/></p>
<input type="submit" value=" "/>
</form>
</div>
</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/91d9a95296ef2de61165b295e961d52a.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p>ajax formdata </p>
<p><strong> :application/json</strong><br/> http ,ContentType application/x-www-form-urlencoded, :name/value ,<br/> & , name value = , key=xxx&name=111&password=123456; ,<br/> json , :</p>
<pre><code>{
a: 1,
b: 2
}</code></pre>
<p> a=1&b=2 , , json , , :</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>{
obj: [
{
"name": 111,
"password": 22
}
]
}</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> ,application/x-www-form-urlencoded , obj[0]['name']=111&obj[0].['password']=2 。<br/> json ;</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>{
"obj": [
{
"name": 111,
"password": 22
}
]
}</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> , , application/json , application/json。 application/json , application/x-www-form-urlencoded , ,<br/> json , json , , json , 。</p>
<p> json 。json , 。</p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>
<title/>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<script type="text/javascript" src="https://tugenhua0707.github.io/html5UploadImage/js/jquery.js"/>
<div id="app">
<div class="btn"> post </div>
</div>
<script>
$('.btn').click(function() {
$.ajax({
url: 'http://www.example.com',
type: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({a: [{b:1, a:1}]}),
success: function(d) {
}
})
});
</script>
</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> , , , :</p>
<p><img alt="" src="https://s1.md5.ltd/image/1964c419d83a3d0d9fa8bcfeb2095fed.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/3cb8b7fcdd43e267f288f1220ddd8b1a.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p><strong>3.1 ajax ContentType: application/json</strong></p>
<p> ajax , Header ContentType application/json, , Method OPTIONS ,<br/> ( GET,POST) 。 , , , 。 demo, :</p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<pre><code>
<title/>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
<script type="text/javascript" src="https://tugenhua0707.github.io/html5UploadImage/js/jquery.js"/>
<div id="app">
<div class="btn"> post </div>
</div>
<script>
$('.btn').click(function() {
$.ajax({
url: 'http://localhost:8081/api.json',
type: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({a: [{b:1, a:1}]}),
success: function(d) {
}
})
});
</script>
</code></pre>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p><img alt="" src="https://s1.md5.ltd/image/51e409b11aa51c150090697429a953ed.gif" width="0" height="0" class="check_url_is_full"/></p>
<p> :</p>
<p><img alt="" src="https://s1.md5.ltd/image/6cefa2f96b4c17568e5f81f35b8b6ddd.jpg" width="0" height="0" class="check_url_is_full"/></p>
<p> json Request Payload;</p>
</div>
</div>
</div>
</div>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
빠른 팁: SingleStoreDB의 데이터 API 사용SingleStoreDB는 HTTP 연결을 통해 SQL 문을 실행하는 데 사용할 수 있는 을 제공합니다. 이 짧은 문서에서는 이 데이터 API를 사용하는 방법에 대한 예를 보여줍니다. A는 무료 SingleStore...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.