如何在XAMPP上启用跨域资源共享? [英] How do I enable cross-origin resource sharing on XAMPP?
问题描述
我的本地主机上有一个html文件，其中包含一个表单和一个用于处理发布数据的jquery/ajax.一个简单的php脚本在mysql数据库表中查找数据
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
这是主要部分:
// $.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中收到以下错误消息
But when I point to the online lookup_update.php I get the following error message in chrome
XMLHttpRequest无法加载 http://www.example.com/projectX/lookup_update.php .所请求的资源上没有"Access-Control-Allow-Origin"标头.因此，不允许访问来源' http://localhost .响应的HTTP状态代码为404.
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.
据我了解，我需要使用
header("Access-Control-Allow-Origin: *");
对于php.但是，当我将其添加到example.com/lookup_update.php时，当本地文件尝试调用它时，该文件将显示404.
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.
我还尝试将以下内容添加到Xampp apache配置文件中
I also tried to add the following to my Xampp apache config file
Header set Access-Control-Allow-Origin "*"
如何从本地XAMPP设置中正确启用跨域资源?
How do I correctly enable cross-origin resource from my local XAMPP setup??
[ EDIT ] 这是我在本地主机上的简单表单
[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-->
具有以下形式的jquery代码
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 ]
好的，我认为这与在线lookup_update.php文件无关，因为我正在用它来在另一个文件中进行测试
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
推荐答案
您必须在lookup_update.php的开始处编写以下代码
You have to write below code at the beginning of your lookup_update.php
header('Access-Control-Allow-Origin: *');
header('Content-type: application/json');
您只能写IP地址而不是*.
Instead of * you can write just Ip address.
OR
首先，您必须检查本地主机或其他服务器上的问题所在.
First you have to check where is problem either on localhost or other server.
尝试以下代码::如果您在警报中获取了一些数据，则问题出在其他服务器上的localhost上.
Try this code : If you getting some data in alert then problem is on localhost else on other server.
$.post( "test.php", function( data ) {
alert( "Data Loaded: " + data );
});
这篇关于如何在XAMPP上启用跨域资源共享?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
