• 目錄
• 上一篇：DartVM服務(wù)器開(kāi)發(fā)（第三天）--pub管理器、返回html頁(yè)面

經(jīng)過(guò)三天，大家已經(jīng)對(duì)DartVM服務(wù)器開(kāi)發(fā)有了一個(gè)基本的認(rèn)識(shí)，可能有人會(huì)說(shuō)，處理請(qǐng)求這么亂的嗎？今天就來(lái)優(yōu)化一下代碼！

優(yōu)化請(qǐng)求

上一篇文章中，我們通過(guò)依賴(lài)第三方http_server這個(gè)包實(shí)現(xiàn)將html頁(yè)面返回給瀏覽器，但是一般的服務(wù)器都包含請(qǐng)求html，json格式的傳遞，這樣就有可能造成了混亂，下面我們使用http_server這個(gè)包進(jìn)行優(yōu)化吧！

在上一篇文章中，有人問(wèn)了相對(duì)路徑在不同的系統(tǒng)的表現(xiàn)是不一樣的，那么，我們今天使用絕對(duì)路徑，獲取當(dāng)前項(xiàng)目的絕對(duì)路徑是很容易的,通過(guò)下面代碼獲取

  var webPath=Platform.script.toFilePath();

這里有一個(gè)Platform類(lèi),這個(gè)類(lèi)主要提供有關(guān)計(jì)算機(jī)和操作系統(tǒng)的信息，而PlatForm.script主要獲取當(dāng)前運(yùn)行腳本的絕對(duì)Uri，Uri內(nèi)容為File://地址，然后toFilePath()就是獲取當(dāng)前Uri的地址
我們來(lái)輸出運(yùn)行一下看看吧！

pathToBuild的值.png

然后，我的html路徑為
/Users/rhyme/WebstormProjects/ServerApp/webApp
那么我們?cè)趺锤臑樵撀窂侥?下面是我的代碼

import 'package:path/path.dart';

  var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';

可以看到，我導(dǎo)入了path.dart這個(gè)文件，這個(gè)文件中有一個(gè)方法dirname().該方法可以知道，獲取目錄的名字，我獲取了兩次目錄的名字，就是當(dāng)前項(xiàng)目的根目錄，然后就是拼接上"/webApp"這個(gè)字符串，就是html的存放位置了，我們來(lái)看一下現(xiàn)在的值吧！

image.png

main() async {
  VirtualDirectory staticFiles=new VirtualDirectory('.');
//.....
  }
}

對(duì)的，這里的VirtualDirectory構(gòu)造方法中，我們傳入了一個(gè)“ . ”這個(gè)點(diǎn)就是要傳入我們的html目錄路徑了，我們一定要記得，這里需要傳入絕對(duì)路徑，下面就是拼接的代碼

  var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';

  VirtualDirectory staticFiles=new VirtualDirectory(webPath);

接下來(lái)，我們要讓VirtualDirectory這個(gè)類(lèi)去接管收到的請(qǐng)求，并根據(jù)路徑訪(fǎng)問(wèn)html頁(yè)面

var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';

  VirtualDirectory staticFiles=new VirtualDirectory(webPath);
  //允許目錄監(jiān)聽(tīng),按照目錄去請(qǐng)求
  staticFiles.allowDirectoryListing=true;
//目錄處理，當(dāng)請(qǐng)求根目錄時(shí)，會(huì)返回該地址
  staticFiles.directoryHandler=(dir,request){
    var indexUri=new Uri.file(dir.path,).resolve('index.html');
    staticFiles.serveFile(new File(indexUri.toFilePath()), request);
  };

  var requestServer = await HttpServer.bind(InternetAddress.loopbackIPv6, 8080);

  print('監(jiān)聽(tīng) localhost地址，端口號(hào)為${requestServer.port}');

  //監(jiān)聽(tīng)請(qǐng)求
  await for (HttpRequest request in requestServer) {
//交給staticFiles處理了
    staticFiles.serveRequest(request);
//    logUtils.writeHeaders(request);
//
//    if(request.uri.toString()=='/'||request.uri.toString().endsWith('.html')){
//
//    }else{
//      handleMessage(request);
//    }
//
  }

最后，我們?cè)趙ebApp下面添加幾個(gè)頁(yè)面

添加幾個(gè)頁(yè)面.png

接下來(lái)我們根據(jù)路徑請(qǐng)求一下服務(wù)器

頁(yè)面一.png

頁(yè)面二.png

關(guān)于頁(yè)面.png

我們?cè)囍フ?qǐng)求一個(gè)不存在的頁(yè)面

可以看到不存在.png

我們?yōu)闆](méi)有找到的頁(yè)面進(jìn)行定制一下

  staticFiles.errorPageHandler=(request){
    if(request.uri.pathSegments.last.contains('.html')){
      staticFiles.serveFile(new File(webPath+'/404.html'), request);
    }else{
      handleMessage(request);
    }
  };

這里我們判斷請(qǐng)求地址最后請(qǐng)求的文件是否為一個(gè)html頁(yè)面，如果是，就為它返回一個(gè)404的頁(yè)面，如果不是，就去處理消息

404頁(yè)面png

啟動(dòng)服務(wù)器，我們重新請(qǐng)求之前找不到的地址，看看有什么變化

可以看到，返回了404的頁(yè)面.png

main() async {
  //獲取文件根目錄
  var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';
  VirtualDirectory staticFiles=new VirtualDirectory(webPath);
  //允許目錄監(jiān)聽(tīng)
  staticFiles.allowDirectoryListing=true;
  //處理訪(fǎng)問(wèn)根目錄
  staticFiles.directoryHandler=(dir,request){
    var indexUri=new Uri.file(dir.path,).resolve('index.html');
    staticFiles.serveFile(new File(indexUri.toFilePath()), request);
  };
  //處理訪(fǎng)問(wèn)不存在的頁(yè)面
  staticFiles.errorPageHandler=(request){
    if(request.uri.pathSegments.last.contains('.html')){
      staticFiles.serveFile(new File(webPath+'/404.html'), request);
    }else{
      handleMessage(request);
    }
  };
  var requestServer = await HttpServer.bind(InternetAddress.loopbackIPv6, 8080);
  print('監(jiān)聽(tīng) localhost地址，端口號(hào)為${requestServer.port}');
  //監(jiān)聽(tīng)請(qǐng)求
  await requestServer.forEach(staticFiles.serveRequest);
}

上面就是優(yōu)化的代碼了！
今天雖然沒(méi)有太多的知識(shí)，但是一個(gè)好的代碼環(huán)境，是我們繼續(xù)維護(hù)的動(dòng)力，好了！今天就到此結(jié)束了，明天見(jiàn)！

如果想繼續(xù)學(xué)習(xí)DartVM服務(wù)器開(kāi)發(fā)，請(qǐng)關(guān)注我，學(xué)習(xí)更多騷操作！

• 下一篇：DartVM服務(wù)器開(kāi)發(fā)（第五天）--日志工具