一:发送

window.postMessage("Hello, world", "http://127.0.0.1:8080");

注意,必须要加上http://,后面的端口如果是80的话,不必写,就算写了,监听的时候e.origin也不必把端口带上

二:绑定监听事件

window.addEventListener("message", messageHandler, true);

注意,绑定事件的类型是message,而不是load

三:监听

function messageHandler(e){

  switch(e.origin){

    case "http://127.0.0.1:8080":

HTML5 - HTML5 postMessage API 注意事项的更多相关文章

  1. 通过Html5的postMessage和onMessage方法实现跨域跨文档请求访问

    在项目中有应用到不同的子项目,通过不同的二级域名实现相互调用功能.其中一个功能是将播放器作为单独的二级域名的请求接口,其他项目必须根据该二级域名调用播放器.最近需要实现视频播放完毕后的事件触发,调用父 ...

  2. html5的postmessage实现js前端跨域訪问及调用解决方式

    关于跨域訪问.使用JSONP的方法.我前面已经demo过了.详细见http://supercharles888.blog.51cto.com/609344/856886,HTML5提供了一个很强大的A ...

  3. 【小月博客】用HTML5的File API做上传图片预览功能

    前段时间做了一个项目,涉及到上传本地图片以及预览的功能,正好之前了解过 html5(点击查看更多关于web前端的有关资源) 可以上传本地图片,然后再网上看了一些demo结合自己的需求,终于搞定了.(P ...

  4. HTML5 <Audio/>标签Api整理(二)

    1.实例2: 相对较完整 Html代码: <style> #volumeSlider .slider-selection { background:#bababa; } </styl ...

  5. HTML5: Screen Orientation API

    媒体的询问取决于智能手机和平板布局调整的方向一致网站.但有时候你被锁定在一个希腊网站特定方向.横向或纵向.此时,是本机格式可以指定保健应用. APP只显示在一个预设格式-独立于实际设备方向.通过使用H ...

  6. HTML5文件操作API

    HTML5文件操作API       一.文件操作API 在之前我们操作本地文件都是使用flash.silverlight或者第三方的activeX插件等技术,由于使用了这些技术后就很难进行跨平台.或 ...

  7. 锚接口(下)——html5的history api

    概述 虽然html5的history api是H5专门用来解决记录历史记录和单页面的方法,但是很多老式的浏览器并不支持它,所以一般遇到老式的浏览器会做一个polyfill使用之前的hashchange ...

  8. HTML5 <Audio>标签API整理(三)

    一.浏览器支持 Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持 <audio> 元素. 注意: Internet Ex ...

  9. 基于html5拖拽api实现列表的拖拽排序

    基于html5拖拽api实现列表的拖拽排序 html代码: <ul ondrop="drop_handler(event);" ondragover="dragov ...

随机推荐

  1. [反汇编练习] 160个CrackMe之002

    [反汇编练习] 160个CrackMe之002. 本系列文章的目的是从一个没有任何经验的新手的角度(其实就是我自己),一步步尝试将160个CrackMe全部破解,如果可以,通过任何方式写出一个类似于注 ...

  2. HDU 3844 Mining Your Own Business(割点,经典)

    题意: 给出一个连通图,要求将某些点涂黑,使得无论哪个点(包括相关的边)撤掉后能够成功使得剩下的所有点能够到达任意一个涂黑的点,颜料不多,涂黑的点越少越好,并输出要涂几个点和有多少种涂法. 思路: 要 ...

  3. 给你一个承诺 - 玩转 AngularJS 的 Promise(转)

    在谈论Promise之前我们要了解一下一些额外的知识:我们知道JavaScript语言的执行环境是“单线程”,所谓单线程,就是一次只能够执行一个任务,如果有多个任务的话就要排队,前面一个任务完成后才可 ...

  4. Java [Leetcode 202]Happy Number

    题目描述: Write an algorithm to determine if a number is "happy". A happy number is a number d ...

  5. Swift入门篇-swift简介

    潜水博客园很多年,闲来无事,聊一下自己的经历,语文不好(如有什么错别字,请您在下评论)望您谅解,没有上过什么学的 在前期 ios入门篇 -hello Word(1) 文章中介绍我这半年准备写一些ios ...

  6. 通过Instant Client包来使用SQL*PLUS

    1.首先下载两个程序包: Instant Client Package - Basic(或Instant Client Package - Basic Lite)包 Instant Client Pa ...

  7. 【转】NSDictionary以及NSMutableDictionary的用法

    原文网址:http://my.oschina.net/u/1245365/blog/177736 摘要 Foundation中的字典是由 键—值 对组成的数据集合.通过key(键),查找对应的valu ...

  8. webdriver(python)学习笔记一

    最近有python开发的项目,也正打算要学习自动化与python语言.因此想通过学习python版本的webdriver来一同学习. 学习过程中参考资料有乙醇的博客:https://github.co ...

  9. SOA和NS区别

    SOA是起始权威服务器,在该服务器上可以新增和删除记录; NS服务器是笔试哪些DNS服务器可以解析该域名; 对于一个域(如baidu.com)SOA只有一个NS可以有多个. NS服务器包含SOA,SO ...

  10. iOS数据存储之属性列表理解

    iOS数据存储之属性列表理解 数据存储简介 数据存储,即数据持久化,是指以何种方式保存应用程序的数据. 我的理解是,开发了一款应用之后,应用在内存中运行时会产生很多数据,这些数据在程序运行时和程序一起 ...