问题由来:

在公司遇到一个线上bug,如下

var url = 'http://106.75.31.215:8012/onlinePreview?url=' + encodeURIComponent(fileUrl);

window.open(url, "_blank", "height=" + winHeight
+ ",top=80,left=80,toolbar=no, menubar=no, scrollbars=yes, resizable=yes");

由于 fileUrl 是多张图片的 url 拼装而来,在这里我们使用get请求方式调的后台图片预览接口,发现后台报错 请求头过长。

特此查了下

在IE8 下的URL地址总长度为:4076,超过该长度会自动忽略后面的内容;

在firefox 25下的URL地址总长度可以达到:7530,超过该长度会访问错误;

在chrome 29.0.1547.62 的最大总长度达到:7675,超过该长度会访问错误;

尴尬。。。我们这有一万多的字符。

解决思路:

换post请求啊,不能忍啊,因为post请求理论上没有请求数据的长度限制,但是没这么搞过啊。

解决方案:

好像以前只在form表单里接触过post调用,那么能不能让window.open()先打开一个隐藏的form表单呢?然后把请求数据塞进去,而偷偷的自动提交,不久可以了么。机智啊

实施如下:

var winHeight = window.document.documentElement.clientHeight-10;
var url = 'http://106.75.31.215:8012/picturesPreview';
var formStr = '<form style="visibility:hidden;" method="POST" action="' + url + '">' +
'<input type="hidden" name="urls" value="' + encodeURIComponent(urls) + '" />' +
'<input type="hidden" name="currentUrl" value="' + encodeURIComponent(fileUrl) + '" />'+
'</form>';
var win = window.open("", "_blank", "height=" + winHeight
+ ",top=80,left=80,toolbar=no, menubar=no, scrollbars=yes, resizable=yes");
win.document.body.innerHTML = formStr;
win.document.forms[0].submit();

经测试,可以跑通,完美解决。

如何让window.open()以post请求方式调用(巧妙解法)的更多相关文章

  1. 利用Ajax改变发送请求方式

    由于测试的时候需要模拟Head请求,解决办法:先访问要请求的站点,然后在浏览器的控制台下执行如下代码,请求方式就为参数给的值: var xmlHttp; if (window.ActiveXObjec ...

  2. AJAX中的请求方式以及同步异步的区别

    AJAX中的请求方式以及同步异步的区别请求方式,分为GET与POST: GET 最为常见的HTTP请求,普通上网浏览页面就是GET.GET方式的参数请求直接跟在URL后,以问号开始.(JS中用wind ...

  3. Android之Http通信——3.Android HTTP请求方式:HttpURLConnection

    3.Android HTTP请求方式之HttpURLConnection 引言: 好了,前两节我们已经对HTTP协议进行了学习.相信看完前两节的朋友对HTTP协议相比之前 应该更加熟悉吧.好吧.学了要 ...

  4. 使用Cors在WebApi中实现跨域请求,请求方式为angular的 $http.jsonp

    使用Cors在WebApi中实现跨域请求 第一步,在webapi项目中安装cors 在Web API配置文件中(Global.asax)进行全局配置: public class WebApiAppli ...

  5. 深入理解ajax系列第二篇——请求方式

    前面的话 在上一篇中,概要地介绍了XHR对象的使用.本文将详细介绍使用XHR对象发送请求的两种方式——GET和POST.下面将以实例的形式来详细说明 GET GET是最常见的请求类型,最常用于向服务器 ...

  6. 限制action所接受的请求方式或请求参数

    原文:http://www.cnblogs.com/liukemng/p/3726897.html 2.限制action所接受的请求方式(get或post): 之前我们在HelloWorldContr ...

  7. Android——JDK的get请求方式

    layout文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:an ...

  8. 第二节(RequestMapping请求方式)学习尚硅谷-springmvc视频教程

    项目中,创建测试类SpringMVCTest @Controller @RequestMapping("/springmvc1") public class SpringMVCTe ...

  9. jQuery中ajax的4种常用请求方式

    jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数 ...

随机推荐

  1. Java多线程基础(一)

    一个简单的多线程的例子: package multiThread; public class BasicThread implements Runnable{ private int countDow ...

  2. vue1.0中$index一直报错的解决办法

    原文链接:https://www.cnblogs.com/liqiong-web/p/8144925.html 看学习视频,因为年份比较早了,其实vue早已迭代到vue2.0了,遇到一些问题: v-f ...

  3. BZOJ 3110: [Zjoi2013]K大数查询 [整体二分]

    有N个位置,M个操作.操作有两种,每次操作如果是1 a b c的形式表示在第a个位置到第b个位置,每个位置加入一个数c如果是2 a b c形式,表示询问从第a个位置到第b个位置,第C大的数是多少. N ...

  4. php 处理并发问题

    对于商品抢购等并发场景下,可能会出现超卖的现象,这时就需要解决并发所带来的这些问题了 在PHP语言中并没有原生的提供并发的解决方案,因此就需要借助其他方式来实现并发控制. 方案一:使用文件锁排它锁 f ...

  5. ajax请求 readyState为0 可能原因之一

    问题:同样的代码逻辑,PC端和iOS都能正常访问,但是Android系统请求都是报错: 上网查阅,关于ajax请求失败且状态码都是0的情况有很多,最后排查的原因是:域名证书问题:

  6. Access denied for user 'root'@'localhost' (using password: YES)的解决

    今天使用phpmyadmin登录远程数据库所以改了一些配置,结果回过头来登录本地mysql时来了一句mysql Access denied for user 'root'@'localhost' (u ...

  7. TinyMce 使用初探

    https://www.cnblogs.com/nkxyf/p/3883586.html 参考:http://www.tinymce.com/    官网 http://www.tinymce.com ...

  8. Java经典编程题50道之二

    判断101-200之间有多少个素数,并输出所有素数. public class Example02 {    public static void main(String[] args) {      ...

  9. 重磅发布:《阿里巴巴Android开发手册(规约)》

    1.前言 阿里巴巴于近日为广大程序员再送上重磅开春好礼:<阿里巴巴Android开发手册(规约)>.该开发规范在阿里内部经过了长期的修缮,现已总结成册,向所有移动开发者.技术爱好者开放,希 ...

  10. C语言队列(数组内核)

    #include <stdio.h>#include <stdbool.h>#include <stdlib.h>struct Queue{ int *pBase; ...