在MUI中修改AJAX的Referer

问题描述

使用mui利用微博官网的api做个性化的微博app的时候，发现凡是发微博、评论、转发之类的接口，在html5 plus runtime中发起请求后，都会被服务器拒绝。
使用Fiddler抓包测试之后，发现是微博检测了请求Header中的Referer，Referer必须来自微博的域名才允许通过。
但是众所周知，Referer是有浏览器自动加上的，并且出于安全限制，浏览器不允许我们手动修改它。
查了MUI的社区，关于Referer的问题没有给出解决方案。自己研究了下，下面给出解决方法。

解决方案

1. 使用服务器代理

使用代理，通过服务器中转发起请求，从而绕过浏览器限制，发出带有Referer的请求。
代理只需要根据目标路径，以post或get方式将原请求的querystring和body部分转发即可，注意需要再多定义一个参数，用于接受原请求发出的微博cookie串，并且附加到转发的请求中，才能通过微博的身份认证。
这种方式，代理服务器压力会大，延迟也会加大。并不推荐。

2. 利用html5 plus runtime的特性

该方案目前在网络上应该是首发？其实思路对了就可以找到这个方法了。这个方法必须要在html5 plus runtime中才能使用，不确定是特性还是漏洞，如果是漏洞希望DCloud不要修复它，因为有时候真的需要用到自定义Referer。
在其他浏览器如Chrome中无法使用，会报错误如下：

Uncaught SecurityError: Failed to execute 'pushState' on 'History': 
A history state object with URL 'http://www.baidu.com/' cannot be created in a document 
with origin 'http://127.0.0.1:8848' and URL 'http://127.0.0.1:8848/Referer/index.html'.

经过测试，发现在html5 plus runtime下，history.pushState可以从本地文件路径切换到其他域名，那么，发出带指定的Referer的请求就非常简单了。

history.pushState(null,null,"http://www.baidu.com")
console.log("当前url:"+location.href)
mui.ajax('http://www.baidu.com',{
	success:function(data,ststus,xhr){
		console.log(data) 
	},
	error:function(xhr,type,errorThrown){}
});

这时候请求的Referer已经是www.baidu.com了。
注意，用这个方式，请求完毕后，记得调用

history.back()

将地址还原会本地路径，要不刷新页面的时候，页面会加载到history.pushState设定的页面去。