妥善的ajax跨域提交post请求的解决方案,结合PHP与jquery

开发背景:

在开发中采用了一个新的架构,将大部分客户的留言功能集成到一个公共API提交保存,采用不一样的用户名区分,供客户查询本身网站的留言,这样节约了客户网站的资源,也提高了维护性。 javascript

那么在提交时不能采用直接的post提交,不然会产生跳转,使访客混乱,因此采用ajax提交留言内容至公共服务器:http://wx.igooda.cn/index.php/messagesave,但尝试后发现不能提交post请求,百度后查询结果是跨域只能是get请求,这对留言内容多的来讲,是不可行的。还有一种解决方案是采用jsonp请求,原理是在页面中创建一个script脚本,导入外部脚本,再将外部脚本转换为结果反馈,这样的方法也不可以很好的解决。 php

开发思路:

虽然javascript的跨域有限制,但php能够跨域提交post请求,因此在网站内创建一个api,作为post的中转站,在提交给远程服务器,这样就能够完成跨域post请求。 html

开发步骤:

一、修改表单 前端

将form的action指向网站内的 api.php,创建一个隐藏字段: java

<input type="hidden" name="request_url" value="跨域的api地址">


二、创建企业网站内的 api.php ajax

function Post($url, $post = null) {
    if (is_array($post)) {
        ksort($post);
        $content = http_build_query($post);
        $content_length = strlen($content);
        $options = array(
            'http' => array(
                'method' => 'POST',
                'header' =>
                "Content-type: application/x-www-form-urlencoded\r\n" .
                "Content-length: $content_length\r\n",
                'content' => $content
            )
        );
        return file_get_contents($url, false, stream_context_create($options));
    }
}

$request_url = $_POST['request_url'];

$response = Post($request_url , $_POST);

echo $response;
三、ajax提交请求吧!相关的javascript代码请查看下面的案例里的源代码。


演示地址:

http://www.hrbzljr.com/ json

这个客户的网站就是采用了这样的机制,前端代码能够经过查看源码找到。 api

另:这个客户网站新增了一个功能,就是经过在线留言后,后台自动经过企业的微信公众平台给企业的客户发送一条微信提醒,十分方便。

相关文章
相关标签/搜索