ページをレンダリングするためにアドレスバーからURLを入力します。
1.ブラウザがサーバーに対応するIPアドレスを解決するためにURLのドメイン名を要求します。
TCPコネクション(スリーウェイハンドシェイクを)確立2.。
3.ブラウザは、第三のハンドシェイクが発行され、ファイルを読み込むためのHTTPリクエストを送信します
4.ブラウザにサーバーの応答、およびブラウザに対応したHTMLテキスト
5. HTMLブラウザの表示テキスト
6.リリースTCPコネクション
4を振って、TCPコネクション、3ウェイハンドシェイクを確立
スリーウェイハンドシェイク
1.最初のハンドシェーク:クライアントが1に設定されているSYNを送信するには、ランダムに生成された値の配列= J、およびサーバへのパケットは、クライアントがSYN_SENT状態に入ります
2.第二のハンドシェイクは、サーバは、サーバがSYNとACK 1、ACK = J + 1に設定されている送信、パケットを受信し、ランダムに生成されたSEQ = K、発行したクライアント、およびSYN_RCVD状態に入ります。
第3のクライアント肯定応答が受信され、チェックACK J + 1か否かを、ACKが1であり、正しいACKフラグビットが1にセットされ、ACK = K + 1、およびサーバへのデータ、サーバ・チェック正しい接続が正常に確立された場合にACKが、1であるか否かをK + 1、ACKか。
HTTPメソッド、ポストは、get
HTTP1.0は三のリクエストメソッド、GET、POSTとは、HEADメソッドを定義します
HTTP1.1新しい6種類:OPTIONS、PUT、PATCH、DELETE、気管切開、CONNECT
式の形式:要求されたデータはに、URLに付加されますますか?部門、複数のパラメータ&接続、およびASCIIには、ASCIIは、いくつかの非コードキャッシュ可能に必要な、POSTリクエストデータをリクエストボディには、キャッシュ可能ではありません。
データ送信:GETリクエスト、HTTP仕様URLの長さのを制限することをではなく、ブラウザとサーバのURLの長さを制限するものではないので、GET要求は、送信データが制限されているときに、
POST URLは、理論的には無制限伝統的な価値観、ではありませんが、サーバーは、一般的にPOSTデータ転送サイズが制限されます。
伝統的な価値観に高いセキュリティを使用して、セキュリティPOSTリクエストボディ。
XSS
クロスサイトスクリプティング攻撃、攻撃者はHTMLリターンでJavaScriptのスクリプトを埋め込まれたとき、これらの攻撃は、HTTPヘッダにセットクッキーと相まって必要軽減するために:「HttpOnlyの」、アクセスJSクッキーを禁止します
攻撃の種類:反射、
DOMに基づくストレージ、
ソリューション:HttpOnlyのは、傍受のクッキーを防ぎます
具体的には、入力チェック、入力フィルタ、<>
チェック出力:出力、符号化し、脱出、
CSRF
クロスサイトリクエストフォージェリ、偽の要求の犠牲者の名前で、信頼されたサーバを詐取する攻撃者はクッキーの援助の被害者は、攻撃を受けてサーバに送信され、これにより攻撃。
クッキーは、ブラウザに送信され、サーバがローカルで、主にセッション状態管理のために、データの小片を保存しました
予防:キャプチャ
リファラーチェック検出要求は正当な情報源である、またはランダムに生成されたトークンを追加します
AJAX
それは、JavaScriptとXML非同期であります
同期が次のステップの前に、このステップを完了した後、ステップは、その後、コールバックリターンの範囲このステップは、次のステップを実行し始めました。
AJAXの技術が含まれています:XHTMLは、CSSを使用して、インタラクティブなDOMを使用してモデルを、前記サーバはXMLHttpRequestを非同期通信を使用して。Jsの結合との通話。
単純な原理、要求は、サーバーからデータを取得するためのXMLHttpRequestオブジェクトを介してサーバーに送信され、その後、ページを更新しています
長所:いいえリフレッシュ更新データ、および非同期サーバー間の通信は、バックエンドの負荷を軽減します、
AJAXは、バック機能と履歴を使用することはできません。
これは、セキュリティ上の問題、クロスサイトスクリプティング攻撃、SQLインジェクションを引き起こす可能性があります
検索エンジンのサポートが弱いです。
原生
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST","ajax_info.json",true);//POST可以发送大量数据
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//设置请求,GET忽略。
xmlhttp.send();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
console.log(xhr.responseText);
}
jquery中
$.ajax({
type:'get',
url:'abc.php',
data:{},
dataType:'json',
timeout:3000,
beforeSend:function(){
// 发送之前就会进入这个函数
// return false 这个ajax就停止了不会发 如果没有return false 就会继续
},
success:function(data){ // 成功拿到结果放到这个函数 data就是拿到的结果
},
error:function(){//失败的函数
},
complete:function(){//不管成功还是失败 都会进这个函数
}
})
$.ajax({
type:'get',
url:'',
data:{},
dataType:"json",
success:function(data){
}
})
axios
axious.get('/uesr?id=1')
.then(function(response){
console.log(response);
}).catch(function(error){
console.log(error);
});
//post也一样
ポストは、違いを取得します
1、標準のHTTPの観点から、サーバーのセキュリティを取得し、データの変更を引き起こすことなく、データを取得するために使用されるGET、POSTは、データの変更が発生することがあります。
2、理論的には、データを提出する制限を複数のエンコーディングを取得するセキュリティポストよりも、質量の参加、URLのパラメータ、不安、そしてリクエストボディの内部にポストパラメータを取得していない、とキャッシュされますが、ポストをサポート。
何GETとPOSTリクエストを送信するには?HTTPプロトコルのための2つの方法があります。
HTTP?HTTPはどのようにWorld Wide Web上でデータを通信する方法についてはTCP / IPプロトコルに何をベースにしています。
HTTPは、基礎となるTCP / IPです。下のGETとPOSTが言っていること、TCP / IPであるので、GET / POSTは、TCP接続です。GETとPOSTを行うことができます同じように同じです。プラスあなたは、POST URLパラメータをもたらす技術的に完全で同じことを行うには、GETリクエストのボディを与えます。
応答レイアウトとの互換性
利点:異なる強力な柔軟性のためのデバイスが、デバイス・コードの様々なとの互換性、
1.メディアクエリー、及び応答コードを追加、固定レイアウトを書きます。
2.一般的にはメタタグ、名前=「ビューポート」コンテンツ=「幅=装置幅、初期の規模= 1、最小規模= 1、ユーザースケーラブル=なし」を追加し、スケーリング禁止します。
図3に示すように、メディア・スクリーンと(最大幅:980px)@ {
}
メディア内のリンクを使用することができます。
4、比率の幅
互換性
主なソリューションは、CSSハック(異なるブラウザ、異なるスタイル)であります
図1に示すように、内側と外側の余白*マージンと異なるデフォルト:0;パディング:0。
画素を含むブロックは、ie6-7ボイドが次の画像に表示される2、。
解決:DIVとIMG同じラインを
ブロックへの画像、(IMGが同様の傾斜ブロックに沿った要素を置き換えます)
一連の画像垂直方向の配置。セットフロート。
3、ULとOLのリストのインデントの問題
IE:マージン:0;
火袋:マージン:0; パディング:0; リストスタイル:なし。
4、IE用。HTML、条件付きコメントは、
ディスプレイの設定、ラベルパターンを追加:ブロックを。
5、IE6二国間の距離、ディスプレイ:傾斜。
高さ太小、オーバーフロー:隠されました;
6、透明性の問題:さまざまなブラウザと私有財産。