如何在XAMPP上启用跨源资源共享？(How do I enable cross-origin resource sharing on XAMPP?)

 我的localhost上有一个带有表单和jquery / ajax的html文件，用于处理发布数据。 一个简单的php脚本在mysql数据库表中查找数据 
 
 这是主要部分： 
 
// $.post('lookup_update.php', $(this).serialize()) //<- local part which works
   $.post('http://www.example.com/projectX/lookup_update.php', $(this).serialize()).done(function (data)
                            { etc.
 
 但是，当我指向在线lookup_update.php时，我在chrome中收到以下错误消息 
 
 
 
 XMLHttpRequest无法加载http://www.example.com/projectX/lookup_update.php 。 请求的资源上不存在“Access-Control-Allow-Origin”标头。 因此不允许Origin'http：// localhost '访问。 响应具有HTTP状态代码404。 
 
 
 据我了解，我需要使用 
 
 header("Access-Control-Allow-Origin: *");
 
 对于PHP。 但是当我将其添加到example.com/lookup_update.php时，当localhost文件尝试调用它时，该文件会给出404。 
 
 我还尝试将以下内容添加到我的Xampp apache配置文件中 
 
Header set Access-Control-Allow-Origin "*"
 
 如何从本地XAMPP设置中正确启用跨源资源？ 
 
 [ 编辑 ]这是我在localhost上的简单表单 
 
<!--Begin form-->
    <div id="form" class="result">
        <form method="post" id="reg-form"  class="form-horizontal">
            <div class="controls">
                <input type="text" name="code" id="code" placeholder="Code"  class="form-control input-lg" />      
            </div>
        </form>
    </div>
    <!--End form-->
 
 用以下形式的jquery代码 
 
    <script type="text/javascript">
            $(document).ready(function ()
            {
                $(document).on('submit', '#reg-form', function ()
                {
                    var tmpCode = $("#code").val();

//                    $.post('lookup_update.php', $(this).serialize())
                      $.post('http://www.example.com/projectX/lookup_update.php', $(this).serialize())
                            .done(function (data)
                            {

                                $("#reg-form").fadeOut('slow', function ()
                                {
                                    $(".result").fadeIn('slow', function ()
                                    {
                                        console.log("inner test " + tmpCode);
                                        $(".result").html(data);


                                        setTimeout(function () {
                                            location.reload();
                                            $('input').val("");
                                        }, 3000);


                                    });
                                });
                            })
                            .fail(function ()
                            {
                                alert('fail to submit the data');
                            });
                    return false;
                });


            });

        </script>
 
 [ 编辑2 ] 
 
 好的，我不认为它与在线lookup_update.php文件有关，因为我用它在另一个文件中测试 
 
            var testXHR = $.post("http://www.example.com/projectX/lookup_update.php", function (data) {
            alert("success:" + data);
        })
 
 在警报弹出窗口中，我看到了预期的数据 

I have a html file on my localhost with a form and jquery/ajax which handles the post data. A simple php script looks up the data in a mysql database table 
 
This is the main part:
 
// $.post('lookup_update.php', $(this).serialize()) //<- local part which works
   $.post('http://www.example.com/projectX/lookup_update.php', $(this).serialize()).done(function (data)
                            { etc.
 
But when I point to the online lookup_update.php I get the following error message in chrome
 
 
 
XMLHttpRequest cannot load http://www.example.com/projectX/lookup_update.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. The response had HTTP status code 404.
 
 
As I understand it I need to use 
 
 header("Access-Control-Allow-Origin: *");
 
for php. But when I add this to example.com/lookup_update.php, the file gives a 404 when the localhost file tries to call it.
 
I also tried to add the following to my Xampp apache config file
 
Header set Access-Control-Allow-Origin "*"
 
How do I correctly enable cross-origin resource from my local XAMPP setup??
 
[EDIT] This is my simple form on my localhost
 
<!--Begin form-->
    <div id="form" class="result">
        <form method="post" id="reg-form"  class="form-horizontal">
            <div class="controls">
                <input type="text" name="code" id="code" placeholder="Code"  class="form-control input-lg" />      
            </div>
        </form>
    </div>
    <!--End form-->
 
With the following form jquery code
 
    <script type="text/javascript">
            $(document).ready(function ()
            {
                $(document).on('submit', '#reg-form', function ()
                {
                    var tmpCode = $("#code").val();

//                    $.post('lookup_update.php', $(this).serialize())
                      $.post('http://www.example.com/projectX/lookup_update.php', $(this).serialize())
                            .done(function (data)
                            {

                                $("#reg-form").fadeOut('slow', function ()
                                {
                                    $(".result").fadeIn('slow', function ()
                                    {
                                        console.log("inner test " + tmpCode);
                                        $(".result").html(data);


                                        setTimeout(function () {
                                            location.reload();
                                            $('input').val("");
                                        }, 3000);


                                    });
                                });
                            })
                            .fail(function ()
                            {
                                alert('fail to submit the data');
                            });
                    return false;
                });


            });

        </script>
 
[EDIT 2]
 
OK, i don't think it has to do with the online lookup_update.php file, as I am using this to test in another file
 
            var testXHR = $.post("http://www.example.com/projectX/lookup_update.php", function (data) {
            alert("success:" + data);
        })
 
And in the alert popup window I see the expected data

原文：https://stackoverflow.com/questions/34872760