(=@__@=)前一天晚上因?yàn)榧追降谋破韧ㄏ捻?xiàng)目亏栈，第二天阿里面試
狀態(tài)很糟糕蔼卡，剛剛回學(xué)锌曷牛考完試?yán)膊ず欤F(xiàn)在來記錄一下面試的過程??
一面
(和藹的) 介紹一下你的學(xué)習(xí)經(jīng)歷~
(懵逼的) HTML5律杠，CSS3潭流，JavaScript，PHP+MySQL俩功，nodeJS幻枉，Angular.JS，Vue.JS诡蜓，最近在學(xué)react
(超級(jí)喜(猥)悅(瑣)) 你知不知道面試的時(shí)候提Angular和Vue是很危險(xiǎn)的呀~
(開心的) 那我們來幾個(gè)最最最基本的問題吧
(終于進(jìn)入正題了啊) 嗯嗯熬甫！
(正經(jīng)的) 來講講跨域
(依舊懵逼的)
最普通的有CORS(但是當(dāng)時(shí)懵逼的我說成了CSRF，大寫的囧)蔓罚，服務(wù)端允許跨域椿肩。這個(gè)會(huì)有簡(jiǎn)單請(qǐng)求和復(fù)雜請(qǐng)求兩種。簡(jiǎn)單請(qǐng)求就是 GET請(qǐng)求( 除了Content-Type是json格式 )豺谈，復(fù)雜請(qǐng)求就是除此之外的請(qǐng)求郑象。 區(qū)別就是復(fù)雜請(qǐng)求在發(fā)送正式請(qǐng)求之前會(huì)提前發(fā)送一個(gè)OPTIONS請(qǐng)求，服務(wù)端如果允許了這個(gè)OPTIONS請(qǐng)求茬末，那就會(huì)接著去發(fā)正式請(qǐng)求厂榛。
然后就是 jsonp ，通過帶有src屬性的標(biāo)簽就可以跨域訪問丽惭。在標(biāo)簽的回調(diào)函數(shù)里添加對(duì)請(qǐng)求到的數(shù)據(jù)的處理方法就可以啦~
(嚴(yán)肅的) 別的呢击奶？？
(想了想) 還有iframe
(恍然大悟) 對(duì)了责掏，前些天做項(xiàng)目的時(shí)候用到了h5的postMessage柜砾，后臺(tái)那邊在官網(wǎng)添加首頁圖片預(yù)覽。本地調(diào)試時(shí)在我的代碼里引用一個(gè)帶有他域名的js文件换衬，就可以實(shí)現(xiàn)了后臺(tái)添加圖片的實(shí)時(shí)預(yù)覽痰驱。
(繼續(xù)問) 還有呢证芭？？
(懵逼的) 担映？废士？
(告訴我) 還有domain和flash然后balabala(我現(xiàn)在具體想不來了其實(shí)= =)
(笑的超開心)來談?wù)?你剛剛提到的)CSRF
(反應(yīng)過來并假裝自己剛剛什么都沒有說然后一本正經(jīng)的說)
跨站偽造請(qǐng)求嘛，典型的可以通過盜取cookie來得到用戶的各種權(quán)限另萤。
(微笑) 只有這樣湃密？
(繼續(xù)正經(jīng)) 那其實(shí)可以插入js的話也就等同于可以做任何事情了。其實(shí)有時(shí)候和XSS會(huì)有點(diǎn)像四敞。
(正經(jīng)臉) CSRF和XSS是完全不同的。
(懵逼) (⊙o⊙)
(正經(jīng)講解臉) 跨站請(qǐng)求偽造是一種挾制用戶在當(dāng)前已登錄的Web應(yīng)用程序上執(zhí)行非本意的操作的攻擊方法拔妥。跟跨網(wǎng)站腳本（XSS）相比忿危，XSS 利用的是用戶對(duì)指定網(wǎng)站的信任，CSRF 利用的是網(wǎng)站對(duì)用戶網(wǎng)頁瀏覽器的信任没龙。攻擊者并不能通過CSRF攻擊來直接獲取用戶的賬戶控制權(quán)铺厨，也不能直接竊取用戶的任何信息。他們能做到的硬纤，是欺騙用戶瀏覽器解滓，讓其以用戶的名義執(zhí)行操作。
(開心的) 原理告訴你了筝家，來洼裤，猜猜看怎么防御
(懵逼的) 可不可以直接屏蔽掉所有的外來js 啊溪王？腮鞍？
(嚴(yán)肅的) 不是這個(gè)問題
(想了想) 應(yīng)該是類似瀏覽器同源策略的方法吧，通過限制特點(diǎn)的域名下的js才能對(duì)網(wǎng)站進(jìn)行訪問
(正經(jīng)臉繼續(xù)解釋) 檢查Referer字段莹菱，HTTP頭中有一個(gè)Referer字段移国，這個(gè)字段用以標(biāo)明請(qǐng)求來源于哪個(gè)地址。在處理敏感數(shù)據(jù)請(qǐng)求時(shí)道伟，通常來說迹缀，Referer字段應(yīng)和請(qǐng)求的地址位于同一域名下。
還有呢蜜徽？祝懂？
(此時(shí)已經(jīng)完全懵) 想不出來了
(正經(jīng)臉) Web Authentication知道嗎？
(正經(jīng)臉) 嗯嗯娜汁，前些天做項(xiàng)目時(shí)有遇到嫂易。在用戶登錄后再向服務(wù)端發(fā)送請(qǐng)求時(shí)都會(huì)要求攜帶token，只有token正確服務(wù)端才會(huì)返回?cái)?shù)據(jù)掐禁。
(好奇臉) 那token就一定安全了嘛怜械？
(懵逼) 似乎不吧颅和，萬一cookie被盜用??
(嫌棄臉) 現(xiàn)在的網(wǎng)站有那么不安全嗎，其實(shí) token就已經(jīng)完全可以防御CSRF了
那想想在阿里CSRF防御可以用在哪些地方缕允？
(懵逼臉) 支付的過程吧
(我覺得他已經(jīng)進(jìn)入講解狀態(tài)了科科) 就拿支付寶說峡扩，如果盜用了用戶權(quán)限，隨意修改一下轉(zhuǎn)賬的account和轉(zhuǎn)賬的money障本，嗯教届，錢就沒有了。
此時(shí)我的心情：
(愉悅臉) 來來我們先來談一下這個(gè)你剛剛提到的angular驾霜，它是mvvm結(jié)構(gòu)案训，那它是怎么實(shí)現(xiàn)數(shù)據(jù)雙向綁定的？
(完全懵逼) 不是很清楚
(超爽快) 來粪糙，手機(jī)給你强霎，兩分鐘，自己查完給我講
--------------認(rèn)真百度的分割線-------------
(正經(jīng)臉) Angular的數(shù)據(jù)綁定主要是通過中間的ViewModel層($scope)來實(shí)現(xiàn)的蓉冈。引入了專門的ViewModel（視圖模型）來實(shí)現(xiàn)View和Model的粘合城舞，讓View和Model的進(jìn)一步分離。
--------------認(rèn)真裝逼的分割線-------------
http://imweb.io/topic/55c05482193684376cd08b53
https://www.zhihu.com/question/23275373
http://www.alloyteam.com/2015/06/mvvm-xue-xi-vue-shi-jian-xiao-jie/
剛剛看完上面這些寞酿，覺得自己too young too native
(繼續(xù)愉快臉) 來談?wù)勀銓?duì)spa的看法吧
(spa是個(gè)啥家夺？？) 不好意思我沒聽清楚??
(正經(jīng)臉) Single Page Application
(恍然大悟臉伐弹，不知道明顯不明顯) 我認(rèn)為單頁應(yīng)用適合邏輯明確拉馋，需要組件復(fù)用的web應(yīng)用。
我就一下講我的項(xiàng)目舉個(gè)栗子??吧~
例如項(xiàng)目中 header和footer的包括其中的一些 componet(about頁面和登錄頁面)都是可以重復(fù)使用的掸茅。中間router-view部分的頁面跳轉(zhuǎn)通過vue-router來進(jìn)行椅邓。
(好奇臉) 那spa如何優(yōu)化？
(有點(diǎn)懵) 壓縮css昧狮，js景馁，減少http請(qǐng)求，在請(qǐng)求http時(shí)使用vue-resource 逗鸣，在請(qǐng)求localStorage時(shí)使用對(duì)應(yīng)的組件合住。
(愉悅臉) 你的意思是要清空緩存嘍？
(????其實(shí)并沒有想到) 嗯嗯
(?(?*)) 那你為什么選擇Vue呢撒璧？
(誠(chéng)實(shí)的(透葛。??)ノ) 老師讓。
(??估計(jì)沒想到我這么誠(chéng)實(shí)) 那你自己的想法呢卿樱？
(思考臉) 比起Angular更加輕量僚害，API更少，但是實(shí)用性蠻強(qiáng)繁调。
(認(rèn)真臉) 我覺得Vue也還是太重了,也就是說你在用它的時(shí)候沒有考慮過為什么你們老師選擇用Vue嗎萨蚕？
(此時(shí)我的臉色應(yīng)該很苦/(ㄒoㄒ)/~~)
那我就說說我用的感受吧靶草。
文檔很詳細(xì)，寫法很簡(jiǎn)潔岳遥。
另外數(shù)據(jù)綁定沒有Angular那么方便是雙向奕翔，當(dāng)model層一些復(fù)雜數(shù)據(jù)(例如數(shù)組)發(fā)生變化時(shí)，Vue是檢測(cè)不到的浩蓉，需要增加watch來監(jiān)測(cè)這些變化派继。
沒有RootScope，同級(jí)組件之間傳遞信息復(fù)雜捻艳。目前我的解決方法是驾窟，a先將信息冒泡到父組件父組件再?gòu)V播b組件再接收。
(正經(jīng)臉) ok认轨，那其實(shí)框架只是一種選擇纫普。比起會(huì)用API更要緊的是你要知道為什么要選擇它，了解它的優(yōu)點(diǎn)和缺點(diǎn)好渠，要知道框架中的功能都是怎么實(shí)現(xiàn)的
(疑惑臉) 那怎么去了解框架相關(guān)功能的實(shí)現(xiàn)？通過閱讀源碼嗎节视？
(笑了) 有的框架源碼可讀性太差了況且如果對(duì)工程化沒有一個(gè)很明確的理解的話讀起來也是非常吃力的拳锚。
(小雞啄米一樣點(diǎn)頭??)
((≧▽≦)/)我的問題結(jié)束了，那你有什么問題問我呢寻行？
(這個(gè)部分我就不寫霍掺，嘻嘻)
其實(shí)過了一天加上當(dāng)時(shí)狀態(tài)很糟糕，真正的過程應(yīng)該遠(yuǎn)沒有寫的這么流暢拌蜘，本來當(dāng)時(shí)都準(zhǔn)備背著包去上班了杆烁。
結(jié)果被叫住說我這關(guān)你過了，可以去外面等??
二面明天再寫
