Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

跨域API的调用处理

  现在很多在线服务都需要跳转到其它域名处理,完成后再跳转回去。比如联合登陆API、在线支付API,等。但登陆完成后总是在新页面上操作也很不科学,所以经常有使用支付接口的网页弹出“已完成操作”和“操作遇到问题”两个按钮。为什么不自己从回调页面判断呢?

  弹出这两个奇怪的按钮虽然大家已经习惯了,但总感觉很不合理。打开新窗口后是可以获取到那个窗口对象的,虽然是跨域的,不能直接对这个窗口对象做进一步操作。但通常这些API工作完成后会有跳转的行为,只要跳转回原域下就可以操作。比如下面这个例子
<!-- saved from url=(0026)http://127.0.0.1/test.html -->
<input type="button" value="打开" />
<script>
document.querySelector("input").onclick=function(){
  open("//localhost");
};
</script>
<!-- saved from url=(0017)http://localhost/ -->
<input type="button" value="完成操作" />
<script>
document.querySelector("input").onclick=function(){
  location.href="//127.0.0.1/callback.html";
};
</script>
<!-- saved from url=(0030)http://127.0.0.1/callback.html -->
<script>
opener.console.log("操作完成!");
close();
</script>
  打开点击test.html页面上的“打开”按钮,就会打开一个localhost页面。而点击localhost页面上的“完成操作”按钮就会关闭页面,并且在test.html页面的控制台上会有文字提示。
  这就是那些跨域API的基本过程,所以不必搞个奇怪的按钮来引导用户,用户操作了什么就显示什么。
网名:
3.80.32.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^