1、Jsonp的原理,如何利用Jsonp發送post請求?
JSONP動態插入<script>元素,為其src屬性指定一個跨域URL;包含在回調函數中的JSON數據。與ajax無關,算是一種內容注入,所以存在一定的安全問題。
流程:客戶端發送的src的網址中利用查詢字符串傳遞一個查詢參數--callback;服務端得到這個callback的名字后,會利用js語法生成一個function,function的名字就是這個回調函數,將要返回的內容用json格式包裝起來,放置到函數中,返回給客戶端;客戶端解析<script>標簽,執行返回的js文檔。
JSONP默認只支持get方法,JSONP發送post請求:方法一:如果是利用jquery的話
客戶端更改:
添加:crossDomain: true
修改:dataType: "json"
服務端添加:
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST');
方法二:在查詢字符串中添加一個標記字符串,比如tag=post;與服務器端約定,當接收到這個標記時,將get請求轉化為post請求。
2、get和post的區別
(1)使用Get請求時,參數在URL中顯示,而使用Post請求,則不會顯示出來;
(2)Post傳輸的數據量大,可以達到2M,而Get方法由于受到URL長度的限制,只能傳遞大約1024字節.?
(3)Get請求需注意緩存問題,Post請求不需擔心這個問題;?
(4)Post請求必須設置Content-Type;?
(5)發送請求時,因為Get請求的參數都在url里,所以send函數發送的參數為null,而Post請求在使用send方法時,卻需賦予其參數;?
(6)GET方式請求的數據會被瀏覽器緩存起來,因此其他人就可以從瀏覽器的歷史記錄中讀取到這些數據,例如賬號和密碼等。在某種情況下,GET方式會帶來嚴重的安全問題。而POST方式相對來說就可以避免這些問題。?
3、cookie和localStorage的區別
cookie:為了辨別用戶身份,存儲在用戶本地終端的數據。分為:(1)內存cookie:保存在內存中,由瀏覽器維護,關閉瀏覽器則消失(2)硬盤cookie:保存在硬盤中,除非手動清理或過期,否則不會消失。
服務器可以設置或讀取?Cookies?中包含的信息,借此維護用戶跟服務器會話中的狀態。因為?HTTP?協議是無狀態的,就是說服務器不知道用戶上一次做了什么,為實現交互,就用?Cookie?來記錄。
cookie的缺點:(1)Cookie?會被附加到每個?HTTP?請求中,無形增加了流量
? ? ? ? ? ? ? ? ? ? ? ? ?(2)HTTP請求中的?Cookie?是明文傳遞,安全性成問題。(HTTPS?不會)
? ? ? ? ? ? ? ? ? ? ? ? ?(3)Cookie?大小限制在?4KB,對于復雜的存儲需求是不夠用的
附加討論:cookie和session的區別
1,session 在服務器端,cookie 在客戶端(瀏覽器)
2,session 默認被存在在服務器的一個文件里(不是內存)
3,session 的運行依賴 session id,而 session id 是存在 cookie 中的,也就是說,如果瀏覽器禁用了 cookie ,同時 session 也會失效(但是可以通過其它方式實現,比如在 url 中傳遞 session_id)
4,session 可以放在 文件、數據庫、或內存中都可以。
5,用戶驗證這種場合一般會用 session
因此,維持一個會話的核心就是客戶端的唯一標識,即 session id??梢酝ㄟ^cookie加密的形式取代session。
4、說說有哪些http狀態碼,304狀態碼
5、緩存的過程原理
瀏覽器和服務器如何標記網站頁面更新的機制
Cache-Control優先級高于Expires
請求頭:If-Modify-Since 搭配 響應頭:last-Modified
請求頭:If-None-Match 搭配 響應頭:Etag(資源唯一標識符)
Etag優先級高于last-Modified
Cache-Control里有一個max-age,緩存的最大保存時間。
6、詳細說明一下,當刷新一個瀏覽器頁面時,緩存是如何工作的
max-age,Etag,last-Modified
Etag唯一資源標識符是如何生成的?(利用MD5,會根據文件內容生成對應的編碼,并且當文件內容改變時,編碼自動改變。)
7、transition和animation的區別——css3動畫
transition:屬性過渡;需要用戶行為觸發過渡,比如:hover,:focus,
animation:通過關鍵幀@keyframe來制作動畫,不需要觸發
8、安卓和ios的兼容性問題
淘寶的flexible解決方案:
ib-flexible庫的使用方法非常的簡單,只需要在Web頁面中添加對應的flexible_css.js,flexible.js文件:在所有資源加載之前執行這個JS。執行這個JS后,會在元素上增加一個data-dpr屬性,以及一個font-size樣式。JS會根據不同的設備添加不同的data-dpr值,比如說2或者3,同時會給html加上對應的font-size的值,比如說75px。如此一來,頁面中的元素,都可以通過rem單位來設置。他們會根據html元素的font-size值做相應的計算,從而實現屏幕的適配效果。
自己的實現:首先利用media進行屏幕響應,其次,在根元素傷設置rem尺寸,則全部使用rem,都能響應。
9、如何實現水平、垂直居中
10、盒子模型
11、git如何合并分支
git merge;合并之后才能夠提交。