Ajax的基礎請求以及獲取JSON的兩種解析方式

2021-08-03 16:59:08 字數 1690 閱讀 3868

作為乙個前端,避免不了需要做前後臺互動

[html]view plain

copy

/*基礎請求*/  

xmlhttp.open('get',url,true);//僅僅寫出 get 下的基礎請求,post 需要進行偽裝;  

在上面我們能看見初步獲取了 str,即獲取到後台來的資料,有時候後台在資料發過來之前就進行過處理,我們 js 獲取到就是物件,這樣就很簡單省事了。但是有時候後台人員直接傳過來的是字串形式,這樣就需要我們苦逼的前端去處理一下資料了。然後問題就來了我們該怎麼去處理字串,哪種處理方式更好;

目前js處理有兩種:1、eval()。2、json.parse();那麼這兩種有什麼區別呢?

首先我們看看eval();

[html]view plain

copy

var 

str= 

'';  

var obj

= eval

('('+str+')');  

console.log(obj.age);  

上面這段**我們會看到頁面先彈出了 haha,也就意味著在處理 json字串的時候竟然把字串裡面的**給解析了。eval()能解析任何字串並不會對字串格式進行檢查。這樣就很可怕了,alert 並沒什麼,但是

可怕的是如果用惡意使用者在json字串中注入了向頁面插入木馬鏈結的指令碼,用eval也是可以操作的。就問你怕不怕!!!

我們再來看看第二種:json.parse()

[html]view plain

copy

var 

str= 

'alert(10)'

;  console.log(json.parse(str));  

竟然報錯了,意味著並不能解析裡面的**。同樣

[html]view plain

copy

var 

str= 

'';  

var obj

= json

.parse(str);  

console.log(obj.age);  

也會報錯。

json.parse()之可以解析json格式的資料,並且會對要解析的字串進行格式檢查,如果格式不正確則不進行解析。

但是如果**如下

[html]view plain

copy

var 

str= 

'';  

var obj

= json

.parse(str);  

console.log(obj.age);  

頁面就會正常輸出 obj.age 出現了18;

從上面看出來確實json.parse()就非常的實用安全了,當然了,一般非常好用的東西都是不相容了,一些低版本瀏覽器中是不支援的。望大家斟酌!

JS獲取頁面資料執行Ajax請求

下面這個例子展示了如何使用js獲取頁面中元素的值,並且將這些值作為引數執行ajax請求。submit task bind click function event var submitbtn this 禁止提交按鈕 submitbtn attr disabled disabled var formd...

原生js的ajax請求

針對get方法 針對post方法 注意 1.setrequestheader 把指定首部設定為所提供的值。在設定任何首部之前必須先呼叫open 設定header並和請求一起傳送 post 方法一定要 2.post請求一定要新增請求頭才行不然會報錯 3.open method url asyncfla...

原生js的ajax請求

什麼是ajax 傳統方法的缺點 傳統的web互動式使用者觸發乙個http請求伺服器,然後伺服器在收到之後,在做出響應到使用者,並且返回乙個新的頁面,每當伺服器處理客戶端提交的請求時,客戶都只能空閒等待,並且哪怕只是一次很小的互動 只需從伺服器端得到很簡單的乙個資料都要返回乙個完整的html頁,而使用...