服务器支持跨域请求


最近工作中遇到前端采用ajax请求服务器(php)然后填充数据的情况,由于浏览器默认的同源策略是不允许跨域请求的,请求虽然可以成功但是会报错。之前遇到这种情况都是服务器端将接口请求的结果存在文件中,然后发给前端进行调试的,那么问题来了,每个接口都需要一个文件,然后前端进行调试,最后提交时还要将请求的地址改回实际生产环境的地址,很是麻烦。后来在网上查阅,研究,最终找到了解决办法。其中网上有好多文章说可以允许ajax跨域请求的服务器配置但很多都是坑,试了不起作用。前端和后端在同一局域网内,前端可以通过ip访问后端开发者的电脑,这样就可以实现前端调试了。下面的方法暂未考虑安全方面问题(ps本人只是初级菜鸟,安全方面了解不多),如果需要请另行解决。
1、不修改服务器配置文件,只是在php脚本文件顶部输出header信息。
header(“Access-Control-Allow-Origin: *”); //允许所有源的请求
2、nginx服务器
修改nginx配置文件,在http代码块中添加
add_header Access-Control-Allow-Origin *; #允许所有源的请求
add_header Access-Control-Allow-Methods GET,POST,OPTIONS; #允许的请求方法(如果是单纯为了调试可以不加)
然后重启nginx服务。
3、apache服务器
修改apache配置文件。
(1)确认已开启 headers_module模块功能;
(2)修改apache配置文件,在<Directory>块中添加 Header set Access-Control-Allow-Origin *
默认配置:
<Directory />
AllowOverride none
Require all denied
</Directory>
修改后的配置:
<Directory />
AllowOverride none
Require all denied
Header set Access-Control-Allow-Origin *
</Directory>
重启apache服务。

上面的三种方法已经亲测,均可以实现ajax跨域请求。更多关于ajax方面的内容可以查看w3c标准。


使用fidder抓取客户端http网络请求


Fiddler是一款非常流行并且实用的http抓包工具,它的原理是在本机开启了一个http的代理服务器,然后它会转发所有的http请求和响应,因此,它比一般的firebug或者是chrome自带的抓包工具要好用的多。不仅如此,它还可以支持请求重放等一些高级功能。显然它是可以支持对手机应用进行http抓包的。在程序开发调试的时候,获取网络请求的数据包,会帮助我们分析一些问题。最近开发的项目就是遇到服务器返回304异常问题。下面就来介绍下如何用fiddler对手机应用来抓包,支持安卓和苹果设备(已亲测)。

  1. 打开Fidder,打开菜单栏中的Tools->Fidder Options界面

1.png

  1. 在Options界面,切换到“Connections”选项卡,勾选“Allow remote computers to connect”,并设置“Fiddler listens on port”监听端口,这里我设置的是888,点击右下角的“ok”。

2.png

  1. 电脑打开命令行(win+r 输入cmd),然后输入ipconfig,查看电脑局域网的ip地址。

3.png

另一种简单的方法就是在Fidder主界面右上角,将鼠标移到Online上,然后会显示网卡及ip地址信息。如果安装了虚拟机,虚拟机的网络信息也会在这里。

4.png

  1. 然后打开android设备,连接wifi,安卓设备需要与电脑连接在同一wifi,选择要连接的wifi,长按选择修改网络,

5.jpg

在弹出的页面里勾选“显示高级选项”,“代理设置”选择“手动”,然后设置代理服务器主机ip和端口,点击保存。

6.jpg

  1. 设置好wifi后,打开安卓手机就可以在Fidder中查看网络请求了。

7.png