环境介绍 虚拟主机1: ip eth0192.168.0.100/24 eth1: 200.168.0.100/24 虚拟主机2(模拟外网) 200.168.0.109/24 (运行web server) pc机() ip 192.168.0.111/24 gateway 192.168.0.100 透明代理的实现方法 基本实现 1.修改squid.conf http_port 192.168.0.100:3128 transparent 2.重新加载配置文件 3.添加iptables规则 把内…
在虚拟机下做的测试. 虚拟主机1:(双网卡) eth0连接内网 ip地址为 192.168.0.100/24 eth1配置一个虚拟外网的ip 200.168.0.100/24 虚拟主机2: ip:200.168.0.101/24(为了测试,就和上面的一个ip在同一网段内) pc机: 192.168.0.110 一.安装squid 使用yum安装 yum install squid* -y 修改配置 vi /etc/squid/squid.conf http_port 192.168.0.100:…
这是完成了预想中的最后两个功能:歌曲评论以及歌曲搜索. 1.评论效果: 用户点击评论按钮,评论框获取焦点. 输入之后点击提交,下方显示评论,用户名称以及日期.相应的用户也可以删除自己评论. 当然只能删除自己的评论,鼠标放置其他人评论上面不会显示删除按钮. 2.搜索歌曲 搜索可以搜索歌曲或者歌手,这里搜索"LiSA",结果如下: 也可以只输入“A”,显示如下: 这里有一个歌手页面,显示的是所有歌手的歌曲,如点击"Aimer"歌手: 至此,基本功能就展示完成,下面看实现…
上一篇遗漏了一个简单的效果没写,见下图: 主页面点击热门推荐和更多之后跳转到歌曲列表页面,现在的页面只是简单的把所有歌曲列出来,没有进行排序.实现起来也很简单,在MainPage的两个链接上添加: <div id="recommend-head"> <router-link to="/PopularMusic">热门推荐</router-link> <router-link to="/PopularMusic&qu…
上一篇文章讲到的是如何利用mongoose从数据库读取数据然后更新页面,接下来要实现的就是用户注册登录功能,这个功能涉及到的东西太多了,今天只实现了登录功能,登陆之后更新导航条界面,最后效果如下: 登录之前: 登陆之后(用户名:oujiamin): 这是登陆界面(还没有设置css): 主要实现步骤: 1.校验 所谓校验就是对用户的输入进行限制并且给出一点提示,这里使用的是vee-validate插件,该插件主要作用就在于可以很方便地绑定input标签并且给出校验规则和提示语,使用步骤: 安装:n…
最近在学习vue框架,练习了一些例子之后,想着搭建一个vue项目,了解到官方有提供一个vue-cli工具来搭建项目脚手架,尝试了一下,写下博客来记录一下. 一.工具环境 1.node.js 6.10.0,目前node.js最新版本是8.7.0,可以到官网下载最新版本安装.链接:http://nodejs.cn/download/ 2.编辑器,Hbuilder 8.8.4 3.windows 8.1 二.创建项目 1.安装node.js,默认安装在"C:\Program Files\nodejs&…
这几天完成了歌曲收藏功能,先看最后效果: 新注册用户:“newuser”,进入“我的音乐界面如下所示” 点击新建歌单,输入:“新歌单”,确认,如下: 目前还没有歌曲,打开音乐界面,点击收藏功能,如下,可以看到新创建的歌单已经在上面: 把歌曲收藏在新歌单,在打开我的音乐界面,已经收藏好了: 点击删除之后,可以看到歌曲已经被删除: 删除歌单: 基本的功能就是这样,有一些细节就不展示了,下面是实现,整体功能的实现,跟前面没太大区别,利用vue-resource和后台通信,发送请求,在后台利用mongo…
上一篇文章中说到这一篇博客会实现音乐播放功能,只是令我意外的是,如果利用h5的audio标签,几行代码就实现了......先来看一下最终效果吧. 这里直接用了audio标签,样式没有怎么管,能获得音乐文件并且播放就足够了. 所以后面我利用了两天的时间,在看了一遍vue官方文档,然后看了vue-router + vue-resource,再学习了mongodb和mongoose,安装了Mongodb数据库,下载了mongo可视化工具robomongo并且学习使用,最后要实现的效果就是利用node.…
1.利用router-link在组件之间传递数据 如上图,MainPage.vue中主要有8个推荐曲目数据,主要实现方式是建立好主页面模板,然后用v-for循环获取返回的music对象,然后分别绑定曲目,代码如下: ul作为承载8个曲目的模板,利用v-for="music in musics"遍历musics数组,依次生成li标签填充页面.musics为一个对象数组,其内容是8个对象,具体实现如下图所示: 在dev-server.js中先把请求到的json函数(appData)复制一份…
1.利用vue-router实现页面跳转 程序可以正常运行之后,下面我们需要配置路由实现页面的局部刷新,这一功能将用来实现网站页面的跳转. 打开程序目录,进入"src\router\index.js",可以看到程序已经配置了一个路由和其相关联的组件. 这里引入了"vue-router",并且新建了一个Router对象,对象里有一个routes属性,是一个对象数组.routes的每一个对象都有以下属性: path:表示程序当前在什么路径下就需要渲染,"/&q…