DartVM服务器开发(四)-代码优化

经过三天,大家已经对DartVM服务器开发有了一个基本的认识,可能有人会说,处理请求这么乱的吗?今天就来优化一下代码!

优化请求

上一篇文章中,我们通过依赖第三方http_server这个包实现将html页面返回给浏览器,但是一般的服务器都包含请求html,json格式的传递,这样就有可能造成了混乱,下面我们使用http_server这个包进行优化吧!

在上一篇文章中,有人问了相对路径在不同的系统的表现是不一样的,那么,我们今天使用绝对路径,获取当前项目的绝对路径是很容易的,通过下面代码获取

1
var webPath=Platform.script.toFilePath();

这里有一个Platform类,这个类主要提供有关计算机和操作系统的信息,而PlatForm.script主要获取当前运行脚本的绝对Uri,Uri内容为File://地址,然后toFilePath()就是获取当前Uri的地址
我们来输出运行一下看看吧!
pathToBuild的值.png
然后,我的html路径为
/Users/rhyme/WebstormProjects/ServerApp/webApp
那么我们怎么改为该路径呢,下面是我的代码

1
2
3
import 'package:path/path.dart';

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

可以看到,我导入了path.dart这个文件,这个文件中有一个方法dirname().该方法可以知道,获取目录的名字,我获取了两次目录的名字,就是当前项目的根目录,然后就是拼接上”/webApp”这个字符串,就是html的存放位置了,我们来看一下现在的值吧!
image.png
可以看到成功的获取到了,这个就是我的html存放路径,如果你是win系统,也可以通过该方法去试着获取到html存放路径,下面就将该路径传入到http_server这个包的一个类中,在此之前,我们昨天有人可能对下面这一段代码有点疑问

1
2
3
4
5
main() async {
VirtualDirectory staticFiles=new VirtualDirectory('.');
//.....
}
}

对的,这里的VirtualDirectory构造方法中,我们传入了一个“ . ”这个点就是要传入我们的html目录路径了,我们一定要记得,这里需要传入绝对路径,下面就是拼接的代码

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

VirtualDirectory staticFiles=new VirtualDirectory(webPath);

接下来,我们要让VirtualDirectory这个类去接管收到的请求,并根据路径访问html页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';

VirtualDirectory staticFiles=new VirtualDirectory(webPath);
//允许目录监听,按照目录去请求
staticFiles.allowDirectoryListing=true;
//目录处理,当请求根目录时,会返回该地址
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('监听 localhost地址,端口号为${requestServer.port}');

//监听请求
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);
// }
//
}

最后,我们在webApp下面添加几个页面
添加几个页面.png

接下来我们根据路径请求一下服务器
页面一.png
页面二.png

关于页面.png
我们试着去请求一个不存在的页面
可以看到不存在.png

我们为没有找到的页面进行定制一下

1
2
3
4
5
6
7
staticFiles.errorPageHandler=(request){
if(request.uri.pathSegments.last.contains('.html')){
staticFiles.serveFile(new File(webPath+'/404.html'), request);
}else{
handleMessage(request);
}
};

这里我们判断请求地址最后请求的文件是否为一个html页面,如果是,就为它返回一个404的页面,如果不是,就去处理消息
404页面png
启动服务器,我们重新请求之前找不到的地址,看看有什么变化
可以看到,返回了404的页面.png
接下来,我们优化一下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
main() async {
//获取文件根目录
var webPath=dirname(dirname(Platform.script.toFilePath()))+'/webApp';
VirtualDirectory staticFiles=new VirtualDirectory(webPath);
//允许目录监听
staticFiles.allowDirectoryListing=true;
//处理访问根目录
staticFiles.directoryHandler=(dir,request){
var indexUri=new Uri.file(dir.path,).resolve('index.html');
staticFiles.serveFile(new File(indexUri.toFilePath()), request);
};
//处理访问不存在的页面
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('监听 localhost地址,端口号为${requestServer.port}');
//监听请求
await requestServer.forEach(staticFiles.serveRequest);
}

上面就是优化的代码了!
今天虽然没有太多的知识,但是一个好的代码环境,是我们继续维护的动力,好了!今天就到此结束了,明天见!

评论系统未开启,无法评论!