父页面于iframe通信

2018-7-18 liyangweb.com 李杨 HTML

  • iframe给父页面发送消息

父页面代码

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>index</title>
</head>
<body>
<iframe src="./iframe.html"></iframe>
</body>
<script type="text/javascript">
	window.addEventListener('message',function(event){
         //此处执行事件
         console.log(event.data);
	})
</script>
</html>


iframe代码

<!DOCTYPE html>
<html>
<head>
	<title>iframe</title>
</head>
<body>
<button onclick="clickHere();">hahaha</button>
</body>
<script type="text/javascript">
	function clickHere() {
		window.parent.postMessage({"click":true},'*');		
	}
</script>
</html>



  • 父页面给iframe发送消息

父页面代码

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>index</title>
</head>
<body>
<button onclick="clickHere();">hahaha</button>
<iframe src="./iframe.html" id='iframeId'></iframe>
</body>
<script type="text/javascript">
	function clickHere()
	{
		var frame = document.getElementById('iframeId');
		frame.contentWindow.postMessage({"click":true},'*');
	}
</script>
</html>

iframe代码

<!DOCTYPE html>
<html>
<head>
	<title>iframe</title>
</head>
<body>
</body>
<script type="text/javascript">
window.addEventListener('message',function(event){
    //此处执行事件
    console.log(event.data);
})
</script>
</html>


评论(0) 浏览(133)

linux shell 获取当前正在执行脚本的绝对路径

2018-6-6 liyangweb.com 李杨 服务器

workdir=$(cd $(dirname $0); pwd)

解释:

步骤1

dirname $0,取得当前执行的脚本文件的父目录


步骤2

cd到父目录,即进入当前工作目录


步骤3

pwd显示当前工作目录


评论(1) 浏览(292)

git 修改.gitignore后生效<转>

2018-6-2 liyangweb.com 李杨 Web周边

在使用git的时候我们有时候需要忽略一些文件或者文件夹。我们一般在仓库的根目录创建.gitignore文件

在提交之前,修改.gitignore文件,添加需要忽略的文件。然后再做add  commit push 等

但是有时在使用过称中,需要对.gitignore文件进行再次的修改。这次我们需要清除一下缓存cache,才能是.gitignore 生效。

具体做法:

git rm -r --cached .  #清除缓存
git add . #重新trace file
git commit -m "update .gitignore" #提交和注释
git push origin master #可选,如果需要同步到remote上的话

评论(0) 浏览(173)

PECL、PEAR、phpize、composer 的区别和联系

2018-5-6 liyangweb.com 李杨 PHP

首先,我们先分别了解一下这四个东西的官方介绍。

PECL:

PECL是PHP扩展的存储库,提供了所有已知的扩展和托管设施的目录,用于下载和开发PHP扩展。

PECL使用的包装和分配系统与它的姐妹PEAR共享。

PEAR:

PEAR是一个可重用PHP组件的框架和分发系统。

phpize:

用 phpize 编译共享 PECL 扩展库。

有时候不能用 pecl 安装命令。这可能是因为在防火墙后面,或者是因为想要安装的扩展库还没有 PECL 兼容的包,例如 SVN 中尚未发布的扩展库。如果要编译这种扩展库,可以用更底层的编译工具来手工进行编译。

Composer:

是 PHP 用来管理依赖(dependency)关系的工具。你可以在自己的项目中声明所依赖的外部工具库(libraries),Composer 会帮你安装这些依赖的库文件。

阅读全文>>

评论(0) 浏览(350)

docker中的Nginx镜像中的nginx:alpine是什么意思?

2018-5-4 liyangweb.com 李杨 服务器

因为相比nginx:latestnginx:alpine有几点优势:

  1. 用的是最新版nginx镜像,功能与nginx:latest一模一样
  2. alpine镜像用的是Alpine Linux内核,比ubuntu内核要小很多。
  3. nginx:alpine默认支持http2。

Alpine的更多请看《Alpine Linux,一个只有5M的Docker镜像》。

如要进入alpine容器,命令是(后面的路径不是/bin/bash):

$ docker exec -it dnmp_nginx_1 /bin/sh


评论(0) 浏览(280)

js多级返回上一级页面时出现的死循环解决方法

2018-5-2 liyangweb.com 李杨 JavaScript

history.go(-1)是js返回上一级的方法,很容易实现让页面从哪来回哪去,简单好用,但是如果我们有多级页面,这个方法会出现死循环。

比如我们访问页面的顺序是A->B->C,在C页面点击返回,会跳到B页面,在B页面再点击返回,就到了C页面,并不是我们期望的A页面,这样就出现了死循环,导致无论如何我无法返回到A页面。

解决方法:

阅读全文>>

评论(1) 浏览(363)

iPhone中的webview显示iframe中的页面宽度超出屏幕

2018-4-22 liyangweb.com 李杨 HTML

今日在做一个项目,遇到了iPhone中iframe页面超宽的问题,业务场景大致是这样:

1.项目运行环境是移动端浏览器,APP中的webview,支持Android和iOS

2.页面中有一个iframe,包含了多个不同的外部链接,我们无法对此页面中的内容做任何更改

由于开发都是用PC模拟手机来进行的,本人使用的Android手机,开发完成后简单测试没发现任何问题,但是后期在iPhone中测试的时候,却发现,外部链接竟然有一半以上不能正常显示,经过各种尝试以及找了很多资料,最后终于找到一个完美解决的办法。

代码如下:

<div style="overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;">
    <iframe src="http://www.baidu.com" frameborder="0" height="100%" scrolling='no' style="width: 1px; min-width: 100%; *width: 100%;"></iframe>
</div>

评论(1) 浏览(442)

PHP分片上传

2018-4-22 liyangweb.com 李杨 JavaScript

PHP的上传受一些配置的影响,一般默认上传最大文件为8M,如果我们需要上传一个10M的文件怎么做呢?

简单实现的话,我们可以通过修改PHP的配置文件来实现:

upload_max_filesize = 2M //PHP最大能接受的文件大小
post_max_size = 8M //PHP能收到的最大POST值'
memory_limit = 128M //内存上限
max_execution_time = 30 //最大执行时间
但是如果我们需要上传一个100M的文件呢?单纯修改上面的配置是不行的,即使测试中能把文件传上去,等到生产环境多个用户一起访问,服务器配置再强大也得挂掉。

所以我们就需要在前端把文件拆分开,也就是所谓的分片上传。

分片上传用到了一些HTML5的新特性,所以对于一些比较老的浏览器就不能用了,我们可以提示用户去下载现代浏览器,或者使用flash来做兼容,本示例中,我们不考虑兼容问题,默认用户在使用现代浏览器。

阅读全文>>

标签: PHP分片上传 js分片上传 PHP大文件上传

评论(1) 浏览(422)

/etc/rc.d/rc.local开机执行命令失败的问题

2018-4-18 liyangweb.com 李杨 服务器

最近配了一台服务器,在/etc/rc.d/rc.local中设置了nginx开机自启动,但是当服务器重启的时候,发现nginx并没有自动启动,经检查/etc/rc.d/rc.local中的内容并没有问题。

里面只有一行:

/usr/nginx/sbin/nginx

后来查了一些资料,发现原来rc.local是需要执行权限的,而我并没有给它执行权限。

执行:

shmod +x /etc/rc.d/rc.local
搞定。

评论(0) 浏览(284)

linux如何查看端口被哪个进程占用

2018-4-17 liyangweb.com 李杨 服务器

lsof -i:端口号


  1. 步骤一】lsof -i

    lsof -i 用以显示符合条件的进程情况,lsof(list open files)是一个列出当前系统打开文件的工具。以root用户来执行lsof -i命令,如下图

    linux如何查看端口被哪个进程占用?
  2.  

    【步骤二】lsof -i:端口号

    lsof -i:端口号,用于查看某一端口的占用情况,比如查看22号端口使用情况,lsof -i:22,如下图

    linux如何查看端口被哪个进程占用?


评论(0) 浏览(337)

Powered by emlog 冀ICP备13011830号-1