vue-resource與axios和javascript請求資料以及同源策略的
vue-resource:
官方提供外掛:github
1、安裝 :cnpm install vue-resource --save
2、引入 :main.裡面引入import VueResource from 'vue-resource';
3、呼叫:Vue.use(VueResource);
4、使用(看著github上教程用即可)
axios
1、安裝 cnpm install axios --save
2、應用:哪裡用哪裡引用
------------------------------------------------------------------------
1、--save把檔案寫入dependencies裡面,這樣打包的時候才不會報錯
2、如果是mac筆記本命令上面要加sudo
原生
1、new XMLHttpRequest()
2、xhr.open("get/post",hr,true);
可以加請求頭xhr.setRequestHeader();看需要
3、xhr.send(); //如果是post請求,資料最好是xhr.send("username=admin&password=123456&verify=123456");這種方式拼接;如果是get,留白就行了
4、 xhr.onreadystatechange = function(){
if(xhr.readystate == 4 && xhr.status ==200){
console.log(xhr.responseText)
}
};
------------------------------------------------------------------------------------------------------------------------------
順便總結一下:同源策略
所謂同源,就是必須協議、域名、埠都一致的,才叫做同源。例如:http://www.12306.cn和https://www.12306.cn,由於協議不一致,就不是同源。
如果是非同源,就會出現跨域報錯,解決的辦法有2種:
a、服務端設定這個Access-Control-Allow-Origin的header就可以允許跨域訪問了response.setHeader("Access-Control-Allow-Origin", "*"); (是*,所有都可以訪問,存在安全隱患)
b、jsonp請求方式,伺服器端要處理一下json資料