需要html、javascript、jquery的基础。
例子功能概述:
当时想要实现的是这样一个功能:一个svg editor(可以搜索一下svg editor了解一下,网上有很多开源的svg editor),在选中画好图形后,点击create symbol之后,可以生成右边的svg content和preview,同时希望能够把用nodejs把svg content里面的内容保存到本地。这里主要完善最后一点,保存到本地。
存在问题:
在网上看了很多关于nodejs爬虫的代码,但是他们都是针对非本地的页面。然后利用get,post来获取页面的信息。但是,在这个本地的svg editor上,画图、保存都不存在get,post请求行为,很纠结(之前以为是本地非本地的原因,看了AJAX后才知道别人也都是创建了请求而已,而我没有建立这些请求,不知道会不会有人和我有一样的傻想法)。
如下图:画完图,点生成。按F12后,这边的XHR(此时还不清楚什么是XHR)一点动作都没有(也就是说,我们需要自己添加请求。)
解决方法:
在点击create symbol后,我在触发的事件中添加了一个downloadInfo的函数。利用jQuery.ajax绑定了post的行为(这个函数能够触发请求的调用)。data中存放了我所需要用到的数据。dataString中就是Svg Content中的内容。
这时点击create symbol就会出现这个post请求。
然后起一个server,时刻监听这个post行为什么时候发生,在下面这个js文件中(其中可能有一些代码无用)
当‘http://127.0.0.1:8080/download’这个节点发生了post请求之后,就开始执行function里面的内容。其中,之前的ajax里data中的内容,会变成request.body的内容。所以我先把它保存下来,一个是输出到文件中的内容,一个是文件名。Path是将root和filename结合成有效的路径,所以fileToSend是即将生成的文件的完整路径。fs是nodejs中用来读写文件的模块,用了它包含的writeFile方法,将xmlContent写入到fileToSend对应的文件中去。
PS:写完这段内容时自己还没有完整了解过一遍AJAX,只是靠着别人的例子在那边拼拼凑凑来完成的。也正是因为实现了“本地有过操作的页面,没有什么post、get请求,那么应该怎么爬下来想要的内容”,但仍然一知半解,所以激发了我对AJAX的学习兴趣。希望也能激发起你的。
PPS:(23:57,再晚就要算在明天的篇数里面,一天只能一篇伤不起)