/**  * 前端需要開啟history模式，而后端根據(jù)url并不知道前端在請求api還是在請求頁面，如localhost:4200/home這種url，前端理所當(dāng)然認(rèn)為“我需要得到html，并跳轉(zhuǎn)到首頁”，然而后端并不能區(qū)分。 * 因此需要一種判斷機(jī)制，來使得后端能分析出前端的請求目的。 * connect-history-api-fallback 這個(gè)中間件正好幫我們完成了上述分析操作，來看下它是怎么實(shí)現(xiàn)的吧！ * 第一次把自己的源碼分析思路寫出來，說得不對的地方，請指出！ */'use strict';var url = require('url');exports = module.exports = function historyApiFallback(options) { // 接收配置參數(shù) options = options || {}; // 初始化日志管理器 var logger = getLogger(options); // 中間件是要返回一個(gè)函數(shù)的，函數(shù)形參有req, res, next return function(req, res, next) {  var headers = req.headers;  if (req.method !== 'GET') {   // 如果請求方法不是GET類型，說明不需要返回html，那么就調(diào)用next()，把請求交給下一個(gè)中間件   logger(    'Not rewriting',    req.method,    req.url,    'because the method is not GET.'   );   return next();  } else if (!headers || typeof headers.accept !== 'string') {   // 如果沒有請求頭，或者請求頭中的accept不是字符串，說明不是一個(gè)標(biāo)準(zhǔn)的http請求，也不予處理，把請求交給下一個(gè)中間件   logger(    'Not rewriting',    req.method,    req.url,    'because the client did not send an HTTP accept header.'   );   return next();  } else if (headers.accept.indexOf('application/json') === 0) {   // 如果客戶端希望得到application/json類型的響應(yīng)，說明也不是在請求html，也不予處理，把請求交給下一個(gè)中間件   logger(    'Not rewriting',    req.method,    req.url,    'because the client prefers JSON.'   );   return next();  } else if (!acceptsHtml(headers.accept, options)) {   // 如果請求頭中不包含配置的Accept或者默認(rèn)的['text/html', '*/*']，那么說明也不是在請求html，也不予處理，把請求交給下一個(gè)中間件   logger(    'Not rewriting',    req.method,    req.url,    'because the client does not accept HTML.'   );   return next();  }  // 走到這里說明是在請求html了，要開始秀操作了  // 首先利用url模塊的parse方法解析下url，會(huì)得到一個(gè)對象，包括protocol，hash，path, pathname, query, search等字段，類似瀏覽器的location對象  var parsedUrl = url.parse(req.url);  var rewriteTarget;  // 然后得到配置中的rewrites，也就是重定向配置；  // 重定向配置是一個(gè)數(shù)組，每一項(xiàng)都包含from和to兩個(gè)屬性；  // from是用來正則匹配pathname是否需要重定向的;  // to則是重定向的url，to可以是一個(gè)字符串，也可以是一個(gè)回調(diào)方法來返回一個(gè)字符串，回調(diào)函數(shù)接收一個(gè)上下文參數(shù)context，context包含三個(gè)屬性（parsedUrl，match，request）  options.rewrites = options.rewrites || [];  // 遍歷一波重定向配置  for (var i = 0; i < options.rewrites.length; i++) {   var rewrite = options.rewrites[i];   // 利用字符串的match方法去匹配   var match = parsedUrl.pathname.match(rewrite.from);   if (match !== null) {    // 如果match不是null，說明pathname和重定向配置匹配上了    rewriteTarget = evaluateRewriteRule(parsedUrl, match, rewrite.to, req);    if(rewriteTarget.charAt(0) !== '/') {     // 推薦使用/開頭的絕對路徑作為重定向url     logger(      'We recommend using an absolute path for the rewrite target.',      'Received a non-absolute rewrite target',      rewriteTarget,      'for URL',      req.url     );    }    logger('Rewriting', req.method, req.url, 'to', rewriteTarget);    // 進(jìn)行重定向url操作    req.url = rewriteTarget;    return next();   }  }  var pathname = parsedUrl.pathname;  // 首先說明一下：校驗(yàn)邏輯默認(rèn)是會(huì)去檢查url中最后的.號的，有.號的說明在請求文件，那就跟history模式就沒什么鳥關(guān)系了  // 我暫且將上述規(guī)則成為“點(diǎn)號校驗(yàn)規(guī)則”  // disableDotRule為true，代表禁用點(diǎn)號校驗(yàn)規(guī)則  if (pathname.lastIndexOf('.') > pathname.lastIndexOf('/') &&    options.disableDotRule !== true) {   // 如果pathname的最后一個(gè)/之后還有.，說明請求的是/a/b/c/d.*的文件（*代表任意文件類型）;   // 如果此時(shí)配置disableDotRule為false，說明開啟點(diǎn)號校驗(yàn)規(guī)則，那么不予處理，交給其他中間件   logger(    'Not rewriting',    req.method,    req.url,    'because the path includes a dot (.) character.'   );   return next();  }  // 如果pathname最后一個(gè)/之后沒有.，或者disableDotRule為true，都會(huì)走到最后一步：重寫url  // 重寫url有默認(rèn)值/index.html，也可以通過配置中的index自定義  rewriteTarget = options.index || '/index.html';  logger('Rewriting', req.method, req.url, 'to', rewriteTarget);  // 重寫url  req.url = rewriteTarget;  // 此時(shí)再將執(zhí)行權(quán)交給下一個(gè)中間件（url都換成index.html了，后面的路由等中間件也不會(huì)再處理了，然后前端接收到html就開始解析路由了，目的達(dá)到！）  next(); };};// 判斷重定向配置中的tofunction evaluateRewriteRule(parsedUrl, match, rule, req) { if (typeof rule === 'string') {  // 如果是字符串，直接返回  return rule; } else if (typeof rule !== 'function') {  // 如果不是函數(shù)，拋出錯(cuò)誤  throw new Error('Rewrite rule can only be of type string or function.'); } // 執(zhí)行自定義的回調(diào)函數(shù)，得到一個(gè)重定向的url return rule({  parsedUrl: parsedUrl,  match: match,  request: req });}// 判斷請求頭的accept是不是包含在配置數(shù)組或默認(rèn)數(shù)組的范圍內(nèi)function acceptsHtml(header, options) { options.htmlAcceptHeaders = options.htmlAcceptHeaders || ['text/html', '*/*']; for (var i = 0; i < options.htmlAcceptHeaders.length; i++) {  if (header.indexOf(options.htmlAcceptHeaders[i]) !== -1) {   return true;  } } return false;}// 處理日志function getLogger(options) { if (options && options.logger) {  // 如果有指定的日志方法，則使用指定的日志方法  return options.logger; } else if (options && options.verbose) {  // 否則，如果配置了verbose，默認(rèn)使用console.log作為日志方法  return console.log.bind(console); } // 否則就沒有日志方法，就不記錄日志咯 return function(){};}