ajax&&node

1.Ajax 是什麼? 如何建立一個Ajax？

ajax的全稱：Asynchronous Javascript And XML。異步傳輸+js+xml。
所謂異步，在這裏簡單地解釋就是：向服務器發送請求的時候，咱們沒必要等待結果，而是能夠同時作其餘的事情，等到有告終果它本身會根據設定進行後續操做，與此同時，頁面是不會發生整頁刷新的，提升了用戶體驗
(1)建立XMLHttpRequest對象,也就是建立一個異步調用對象
(2)建立一個新的HTTP請求,並指定該HTTP請求的方法、URL及驗證信息
(3)設置響應HTTP請求狀態變化的函數
(4)發送HTTP請求
(5)獲取異步調用返回的數據
(6)使用JavaScript和DOM實現局部刷新
ajax是一種建立交互式網頁的計算

2.同步和異步的區別?

同步的概念應該是來自於OS中關於
同步的概念:不一樣進程爲協同完成某項工做而在前後次序上調整(經過阻塞,喚醒等方式).同步強調的是順序性.誰先誰後.異步則不存在這種順序性.
同步：瀏覽器訪問服務器請求，用戶看獲得頁面刷新，從新發請求,等請求完，頁面刷新，新內容出現，用戶看到新內容,進行下一步操做。
異步：瀏覽器訪問服務器請求，用戶正常操做，瀏覽器後端進行請求。等請求完，頁面不刷新，新內容也會出現，用戶看到新內容。

3.如何解決跨域問題?

jsonp、 iframe、window.name、window.postMessage、服務器上設置代理頁面
參考：http://qiutc.me/post/cross-do...

4.http狀態碼有那些？分別表明是什麼意思？

簡單版
             [
                        100  Continue   繼續，通常在發送post請求時，已發送了http header以後服務端將返回此信息，表示確認，以後發送具體參數信息
                        200  OK         正常返回信息
                        201  Created    請求成功而且服務器建立了新的資源
                        202  Accepted   服務器已接受請求，但還沒有處理
                        301  Moved Permanently  請求的網頁已永久移動到新位置。
                        302 Found       臨時性重定向。
                        303 See Other   臨時性重定向，且老是使用 GET 請求新的 URI。
                        304  Not Modified 自從上次請求後，請求的網頁未修改過。
 
                        400 Bad Request  服務器沒法理解請求的格式，客戶端不該當嘗試再次使用相同的內容發起請求。
                        401 Unauthorized 請求未受權。
                        403 Forbidden   禁止訪問。
                        404 Not Found   找不到如何與 URI 相匹配的資源。
 
                        500 Internal Server Error  最多見的服務器端錯誤。
                        503 Service Unavailable 服務器端暫時沒法處理請求（多是過載或維護）。
             ]

5.請解釋 JSONP 的工做原理，以及它爲何不是真正的 AJAX。

jsonp的工做原理是，動態的建立了一個全局方法，而且動態生成script標籤，將script標籤的src屬性變爲（接口地址?callback=動態生成方法的方法名）請求數據，然後臺則須要將接收到的callback值與數據一同返回，呈現出執行js方法的語句（方法名(數據)），其實就是在請求回來的數據中是執行請求是動態生成的js方法，生成了假象的ajax，因此jsonp只能作get類型請求

6.請解釋一下 JavaScript 的同源策略。

同源策略是客戶端腳本（尤爲是Javascript）的重要的安全度量標準。它最先出自Netscape Navigator2.0，其目的是防止某個文檔或腳本從多個不一樣源裝載。
它的精髓很簡單：它認爲自任何站點裝載的信賴內容是不安全的。當被瀏覽器半信半疑的腳本運行在沙箱時，它們應該只被容許訪問來自同一站點的資源，而不是那些來自其它站點可能懷有惡意的資源。
這裏的同源指的是：同協議，同域名和同端口

7.爲何要有同源限制？

咱們舉例說明：好比一個黑客程序，他利用IFrame把真正的銀行登陸頁面嵌到他的頁面上，當你使用真實的用戶名，密碼登陸時，他的頁面就能夠經過Javascript讀取到你的表單中input中的內容，這樣用戶名，密碼就輕鬆到手了。

8.建立ajax過程

(1)建立XMLHttpRequest對象,也就是建立一個異步調用對象.
(2)建立一個新的HTTP請求,並指定該HTTP請求的方法、URL及驗證信息.
(3)設置響應HTTP請求狀態變化的函數.
(4)發送HTTP請求.
(5)獲取異步調用返回的數據.
(6)使用JavaScript和DOM實現局部刷新.

var xmlHttp = new XMLHttpRequest(); 
xmlHttp.open('GET','demo.php','true'); 
xmlHttp.send() 
xmlHttp.onreadystatechange = function(){ 
     if(xmlHttp.readyState === 4 & xmlHttp.status === 200){ 
     } 
}

9.常見web安全及防禦原理

sql注入原理

就是經過把SQL命令插入到Web表單遞交或輸入域名或頁面請求的查詢字符串，最終達到欺騙服務器執行惡意的SQL命令。
總的來講有如下幾點：
1）永遠不要信任用戶的輸入，要對用戶的輸入進行校驗，能夠經過正則表達式，或限制長度，對單引號和雙"-"進行轉換等。
2）永遠不要使用動態拼裝SQL，可使用參數化的SQL或者直接使用存儲過程進行數據查詢存取。
3）永遠不要使用管理員權限的數據庫鏈接，爲每一個應用使用單獨的權限有限的數據庫鏈接。
4）不要把機密信息明文存放，請加密或者hash掉密碼和敏感的信息。
 

XSS原理及防範

Xss(cross-site scripting)攻擊指的是攻擊者往Web頁面裏插入惡意 html標籤或者javascript代碼。好比：攻擊者在論壇中放一個看似安全的連接，騙取用戶點擊後，竊取cookie中的用戶私密信息；或者攻擊者在論壇中加一個惡意表單當用戶提交表單的時候，卻把信息傳送到攻擊者的服務器中，而不是用戶本來覺得的信任站點。
 

XSS防範方法

首先代碼裏對用戶輸入的地方和變量都須要仔細檢查長度和對」<」,」>」,」;」,」’」等字符作過濾；其次任何內容寫到頁面以前都必須加以encode，避免不當心把html tag 弄出來。這一個層面作好，至少能夠堵住超過一半的XSS 攻擊。首先，避免直接在cookie 中泄露用戶隱私，例如email、密碼等等。其次，經過使cookie 和系統ip 綁定來下降cookie 泄露後的危險。這樣攻擊者獲得的cookie 沒有實際價值，不可能拿來重放。若是網站不須要再瀏覽器端對cookie 進行操做，能夠在Set-Cookie 末尾加上HttpOnly 來防止javascript 代碼直接獲取cookie 。儘可能採用POST 而非GET 提交表單

10.XSS與CSRF有什麼區別嗎？

XSS是獲取信息，不須要提早知道其餘用戶頁面的代碼和數據包。CSRF是代替用戶完成指定的動做，須要知道其餘用戶頁面的代碼和數據包。
要完成一次CSRF攻擊，受害者必須依次完成兩個步驟：
登陸受信任網站A，並在本地生成Cookie。
在不登出A的狀況下，訪問危險網站B。
CSRF的防護
服務端的CSRF方式方法不少樣，但總的思想都是一致的，就是在客戶端頁面增長僞隨機數。
經過驗證碼的方法
11.HTTP和HTTPS
HTTP協議一般承載於TCP協議之上，在HTTP和TCP之間添加一個安全協議層（SSL或TSL），這個時候，就成了咱們常說的HTTPS。
默認HTTP的端口號爲80，HTTPS的端口號爲443。
HTTPS和HTTP的區別主要以下：
1）https協議須要到ca申請證書，通常免費證書較少，於是須要必定費用。
2）http是超文本傳輸協議，信息是明文傳輸，https則是具備安全性的ssl加密傳輸協議。
3）http和https使用的是徹底不一樣的鏈接方式，用的端口也不同，前者是80，後者是443。
4）http的鏈接很簡單，是無狀態的；HTTPS協議是由SSL+HTTP協議構建的可進行加密傳輸、身份認證的網絡協議，比http協議安全。

12.爲何HTTPS安全

由於網絡請求須要中間有不少的服務器路由器的轉發。中間的節點均可能篡改信息，而若是使用HTTPS，密鑰在你和終點站纔有。https之因此比http安全，是由於他利用ssl/tls協議傳輸。它包含證書，卸載，流量轉發，負載均衡，頁面適配，瀏覽器適配，refer傳遞等。保障了傳輸過程的安全性

13.GET和POST的區別，什麼時候使用POST？

GET：通常用於信息獲取，使用URL傳遞參數，對所發送信息的數量也有限制，通常在2000個字符
POST：通常用於修改服務器上的資源，對所發送的信息沒有限制。
 
GET方式須要使用Request.QueryString來取得變量的值，而POST方式經過Request.Form來獲取變量的值，也就是說Get是經過地址欄來傳值，而Post是經過提交表單來傳值。
然而，在如下狀況中，請使用 POST 請求：
沒法使用緩存文件（更新服務器上的文件或數據庫）
向服務器發送大量數據（POST 沒有數據量限制）
發送包含未知字符的用戶輸入時，POST 比 GET 更穩定也更可靠
14，ajax的缺點和在IE下的問題？
ajax的缺點
    一、ajax不支持瀏覽器back按鈕。
    二、安全問題 AJAX暴露了與服務器交互的細節。
    三、對搜索引擎的支持比較弱。
    四、破壞了程序的異常機制。
    五、不容易調試。
IE緩存問題
在IE瀏覽器下，若是請求的方法是GET，而且請求的URL不變，那麼這個請求的結果就會被緩存。解決這個問題的辦法能夠經過實時改變請求的URL，只要URL改變，就不會被緩存，能夠經過在URL末尾添加上隨機的時間戳參數('t'= + new Date().getTime())
或者：
    open('GET','demo.php?rand=+Math.random()',true);//
    Ajax請求的頁面歷史記錄狀態問題
    能夠經過錨點來記錄狀態，location.hash。讓瀏覽器記錄Ajax請求時頁面狀態的變化。
    還能夠經過HTML5的history.pushState，來實現瀏覽器地址欄的無刷新改變

15.前端須要注意哪些SEO

合理的title、description、keywords：搜索對着三項的權重逐個減少，title值強調重點便可，重要關鍵詞出現不要超過2次，並且要靠前，不一樣頁面title要有所不一樣；description把頁面內容高度歸納，長度合適，不可   過度堆砌關鍵詞，不一樣頁面description有所不一樣；keywords列舉出重要關鍵詞便可

語義化的HTML代碼，符合W3C規範：語義化代碼讓搜索引擎容易理解網頁
重要內容HTML代碼放在最前：搜索引擎抓取HTML順序是從上到下，有的搜索引擎對抓取長度有限制，保證重要內容必定會被抓取
重要內容不要用js輸出：爬蟲不會執行js獲取內容
少用iframe：搜索引擎不會抓取iframe中的內容
非裝飾性圖片必須加alt
提升網站速度：網站速度是搜索引擎排序的一個重要指標

16.什麼是Ajax和JSON，它們的優缺點

Ajax是異步JavaScript和XML，用於在Web頁面中實現異步數據交互。

優勢：

    可使得頁面不重載所有內容的狀況下加載局部內容，下降數據傳輸量
    避免用戶不斷刷新或者跳轉頁面，提升用戶體驗

缺點：

    對搜索引擎不友好（
    要實現ajax下的先後退功能成本較大
    可能形成請求數的增長
    跨域問題限制
JSON是一種輕量級的數據交換格式，ECMA的一個子集
優勢：輕量級、易於人的閱讀和編寫，便於機器（JavaScript）解析，支持複合數據類型（數組、對象、字符串、數字）

17.AJAX的請求方式？

GET：GET是http的默認請求方式， 通常用來獲取數據。
HEAD：HEAD方法與GET方法同樣，都是向服務器發出指定資源的請求。可是，服務器在響應HEAD請求時不會回傳資源的內容部分，即：響應主體。這樣，咱們能夠不傳輸所有內容的狀況下，就能夠獲取服務器的響應頭信息。HEAD方法常被用於客戶端查看服務器的性能。
POST：POST請求會向指定資源提交數據，請求服務器進行處理。如：表單提交、文件上傳。
PUT：PUT請求會身向指定資源位置上傳其最新內容，經過該方法客戶端能夠將指定資源的最新數據傳送給服務器取代指定的資源的內容。
DELETE：DELETE請求用於請求服務器刪除所請求URI所標識的資源。DELETE請求後指定資源會被刪除。
TRACE：返回接受到的請求，用來查看數據通過中間服務器時發生了哪些變更。
OPTIONS：OPTIONS請求與HEAD相似，通常也是用於客戶端查看服務器的性能。 這個方法會請求服務器返回該資源所支持的全部HTTP請求方法，該方法會用'*'來代替資源名稱，向服務器發送OPTIONS請求，能夠測試服務器功能是否正常。JavaScript的XMLHttpRequest對象進行CORS跨域資源共享時，就是使用OPTIONS方法發送嗅探請求，以判斷是否有對指定資源的訪問權限。
CONNECT：要求使用SSL和TLS進行TCP通訊。
PATCH：請求修改局部數據

18.RESTful架構

REST是一種架構風格：無狀態，以資源爲中心，充分利用HTTP協議和URI協議，提供統一的接口定義，使得它做爲一種設計Web服務的方法而變得流行。在某種意義上，經過強調URI和HTTP等早期Internet標準，REST是對大型應用程序服務器時代以前的Web方式的迴歸。

架構約束：

客戶-服務器:通訊只能由客戶端單方面發起，表現爲請求-響應的形式。
無狀態:通訊的會話狀態（Session State）應該所有由客戶端負責維護。
緩存:響應內容能夠在通訊鏈的某處被緩存，以改善網絡效率。
統一接口:通訊鏈的組件之間經過統一的接口相互通訊，以提升交互的可見性。
分層系統:經過限制組件的行爲（即，每一個組件只能"看到"與其交互的緊鄰層），將架構分解爲若干等級的層。
按需代碼:支持經過下載並執行一些代碼（例如Java Applet、Flash或JavaScript），對客戶端的功能進行擴展。

主要特徵：

面向資源（Resource Oriented）
可尋址（Addressability）
連通性（Connectedness）
無狀態（Statelessness）
統一接口（Uniform Interface）
超文本驅動（Hypertext Driven）

19.cookie 和session 的區別：     

1）cookie數據存放在客戶的瀏覽器上，session數據放在服務器上。    
2）cookie不是很安全，別人能夠分析存放在本地的COOKIE並進行COOKIE欺騙考慮到安全應當使用session。     
3）session會在必定時間內保存在服務器上。當訪問增多，會比較佔用你服務器的性能考慮到減輕服務器性能方面，應當使用COOKIE。     
4）單個cookie保存的數據不能超過4K，不少瀏覽器都限制一個站點最多保存20個cookie。     
5）因此通常狀況下將登錄信息等重要信息存放爲SESSION其餘信息若是須要保留，能夠放在COOKIE中

20.Cookie和localstorage、session storage的區別

Cookie技術瀏覽器兼容性好，但操做比較複雜，須要程序員本身封裝，源生的Cookie接口不友好,存儲的內容較小,cookie的數據會隨着ajax的請求發送到服務端，通常狀況主要用在用戶登陸的時候咱們能夠經過在 Cookie 中存入一段辨別用戶身份的數據，用於後臺判斷。

WebStorage則不能超過8MB，操做簡單；能夠代替一些cookie的工做，通常主要是用於存儲一些本地數據，購物車數據之類的在安全方面的話，都不安全，通常就是對數據進行一些簡單的加密，如base64編碼，加密約定之類的東西localstorage、sessionstorage一個是長期存儲，一個是會話存儲

21.fetch與ajax的區別？      

Ajax主要是利用的是XMLHttpRequest對象來請求數據的。

Fetch是window的一個方法

主要特色是

1) 第一個參數是URL
2) 第二個參數可選參數 能夠控制不一樣的init對象
3) 使用了js 中的promise對象

fetch 的第二參數中
1) 默認的請求爲get請求 可使用method:post 來進行配置 
2) 第一步中的 response有許多方法 json() text() formData()
3) Fetch跨域的時候默認不會帶cookie ，若是你想在fetch請求裏附帶cookies之類的憑證信息，能夠將 credentials參數設置成 「include」 值。還有就是fetch返回的promise在某些錯誤的http狀態下如400、500等不會reject的錯誤狀態，相反它會被resolve；只有網絡錯誤會致使請求不能完成時，fetch 纔會被 reject；因此通常會對fetch請求作一層封裝，在resolve中真對於大於200和 小於300的狀態返回正確信息，其餘則返回錯誤信息全部的IE瀏覽器都不會支持 fetch()方法

22.瀏覽器本地存儲

在較高版本的瀏覽器中，js提供了sessionStorage和globalStorage。在HTML5中提供了localStorage來取代globalStorage。
html5中的Web Storage包括了兩種存儲方式：sessionStorage和localStorage。
sessionStorage用於本地存儲一個會話（session）中的數據，這些數據只有在同一個會話中的頁面才能訪問而且當會話結束後數據也隨之銷燬。所以sessionStorage不是一種持久化的本地存儲，僅僅是會話級別的存儲
而localStorage用於持久化的本地存儲，除非主動刪除數據，不然數據是永遠不會過時的。
23.請你談談Cookie的弊端
cookie雖然在持久保存客戶端數據提供了方便，分擔了服務器存儲的負擔，但仍是有不少侷限性的。

1，每一個特定的域名下最多生成20個cookie
2，IE6或更低版本最多20個cookie
3，IE7和以後的版本最後能夠有50個cookie。
4，Firefox最多50個cookie
5，chrome和Safari沒有作硬性限制

            
IE和Opera 會清理近期最少使用的cookie，Firefox會隨機清理cookie。
            cookie的最大大約爲4096字節，爲了兼容性，通常不能超過4095字節。
            IE 提供了一種存儲能夠持久化用戶數據，叫作userdata，從IE5.0就開始支持。每一個數據最多128K，每一個域名下最多1M。這個持久化數據放在緩存中，若是緩存沒有清理，那麼會一直存在。

優勢：極高的擴展性和可用性
      1）經過良好的編程，控制保存在cookie中的session對象的大小。
      2）經過加密和安全傳輸技術（SSL），減小cookie被破解的可能性。
      3）只在cookie中存放不敏感數據，即便被盜也不會有重大損失。
      4）控制cookie的生命期，使之不會永遠有效。偷盜者極可能拿到一個過時的cookie。
缺點：
      1）Cookie`數量和長度的限制。每一個domain最多隻能有20條cookie，每一個cookie長度不能超過4KB，不然會被截掉.
      2）安全性問題。若是cookie被人攔截了，那人就能夠取得全部的session信息。即便加密也與事無補，由於攔截者並不須要知道cookie的意義，他只要原樣轉發cookie就能夠達到目的了。
      3）有些狀態不可能保存在客戶端。例如，爲了防止重複提交表單，咱們須要在服務器端保存一個計數器。若是咱們把這個計數器保存在客戶端，那麼它起不到任何做用。
      

Node面試題

1. 爲何要用node?

參考答案: 總結起來node有如下幾個特色:簡單強大，輕量可擴展．簡單體如今node使用的是javascript,json來進行編碼，人人都會；強大致如今非阻塞IO,能夠適應分塊傳輸數據，較慢的網絡環境，尤爲擅長高併發訪問；輕量體如今node自己既是代碼，又是服務器，先後端使用統一語言;可擴展體如今能夠輕鬆應對多實例，多服務器架構，同時有海量的第三方應用組件．

2. node的構架是什麼樣子的?

參考答案: 主要分爲三層，應用app >> V8及node內置架構 >> 操做系統. V8是node運行的環境，能夠理解爲node虛擬機．node內置架構又可分爲三層: 核心模塊(javascript實現) >> c++綁定 >> libuv + CAes + http.
 

3. node有哪些核心模塊?

參考答案: EventEmitter, Stream, FS, Net和全局對象

node全局對象

1. node有哪些全局對象?

參考答案: process, console, Buffer和exports

2. process有哪些經常使用方法?

參考答案: process.stdin, process.stdout, process.stderr, process.on, process.env, process.argv, process.arch, process.platform, process.exit

3. console有哪些經常使用方法?

參考答案: console.log/console.info, console.error/console.warning, console.time/console.timeEnd, console.trace, console.table
 

4. node有哪些定時功能?

參考答案: setTimeout/clearTimeout, setInterval/clearInterval, setImmediate/clearImmediate, process.nextTick
 

node中的事件循環是什麼樣子的?

整體上執行順序是：process.nextTick >> setImmidate >> setTimeout/SetInterval 看官網吧：https://github.com/nodejs/nod...

node中的Buffer如何應用?

參考答案: Buffer是用來處理二進制數據的，好比圖片，mp3,數據庫文件等.Buffer支持各類編碼解碼，二進制字符串互轉．

文件系統

 

1. 內置的fs模塊架構是什麼樣子的?

參考答案: fs模塊主要由下面幾部分組成:
1) POSIX文件Wrapper,對應於操做系統的原生文件操做
2) 文件流 fs.createReadStream和fs.createWriteStream
3) 同步文件讀寫,fs.readFileSync和fs.writeFileSync
4) 異步文件讀寫, fs.readFile和fs.writeFile
 

2. 讀寫一個文件有多少種方法?

參考答案: 整體來講有四種:
1) POSIX式低層讀寫
2) 流式讀寫
3) 同步文件讀寫
4) 異步文件讀寫
 

3. 怎麼讀取json配置文件?

參考答案: 主要有兩種方式，
第一種是利用node內置的require('data.json')機制，直接獲得js對象;
第二種是讀入文件入內容，而後用JSON.parse(content)轉換成js對象．
兩者的區別是require機制狀況下，若是多個模塊都加載了同一個json文件，那麼其中一個改變了js對象，其它跟着改變，這是由node模塊的緩存機制形成的，只有一個js模塊對象; 第二種方式則能夠隨意改變加載後的js變量，並且各模塊互不影響，由於他們都是獨立的，是多個js對象.
 

4. fs.watch和fs.watchFile有什麼區別，怎麼應用?

參考答案: 兩者主要用來監聽文件變更．fs.watch利用操做系統原生機制來監聽，可能不適用網絡文件系統; fs.watchFile則是按期檢查文件狀態變動，適用於網絡文件系統，可是相比fs.watch有些慢，由於不是實時機制．

網絡

 

1. node的網絡模塊架構是什麼樣子的?

參考答案: node全面支持各類網絡服務器和客戶端，包括tcp, http/https, tcp, udp, dns, tls/ssl等.
 

2. node是怎樣支持https,tls的?

參考答案: 主要實現如下幾個步驟便可:
1) openssl生成公鑰私鑰
2) 服務器或客戶端使用https替代http
3) 服務器或客戶端加載公鑰私鑰證書
 

3. 實現一個簡單的http服務器?(必須會手寫)

參考答案: 經典又很沒毛意義的一個題目．思路是加載http模塊，建立服務器，監聽端口.
 
代碼演示
 
   

var http = require('http'); // 加載http模塊 
 
    http.createServer(function(req, res) { 
        res.writeHead(200, {'Content-Type': 'text/html'}); // 200表明狀態成功, 文檔類型是給瀏覽器識別用的 
        res.write('<meta charset="UTF-8"><h1>我是標題啊！</h1><font color="red">這麼原生，初級的服務器，下輩子能用着嗎?!</font>'); // 返回給客戶端的html數據 
        res.end(); // 結束輸出流 
    }).listen(3000); // 綁定3ooo, 查看效果請訪問 http://localhost:3000