jQuery请求网络(Access-Control-Allow-Origin)

最新推荐文章于 2022-07-18 10:18:13 发布

小溪彼岸

最新推荐文章于 2022-07-18 10:18:13 发布

阅读量7.9k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： # jQuery 文章标签： jquery 网络

本文链接：https://blog.youkuaiyun.com/zww1984774346/article/details/51789624

jQuery 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一种通过前端设置来解决跨域请求问题的方法，利用第三方代理服务绕过浏览器的同源策略限制，实现了对不同域资源的成功获取。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如果使用jQuery请求网络遇到这样的问题

XMLHttpRequest cannot load http://www.xx.com. No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'null' is therefore not allowed access.

除了在服务端配置外，可以尝试使用一下方式只需在前端设置即可。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("button").click(function(){


                $.get("https://crossorigin.me/http://www.w3school.com.cn/example/jquery/demo_test.txt",{
//                    dataType: 'JSONP'
                },function(responseTxt,statusTxt,xhr){
                    if(statusTxt=="success")
                        alert("外部内容加载成功！");
                        alert(responseTxt);
                    if(statusTxt=="error")
                        alert("Error: "+xhr.status+": "+xhr.statusText);
                });




                $.post("https://crossorigin.me/http://www.w3school.com.cn/example/jquery/demo_test.txt",{
                 //dataType: 'JSONP'
                },function(responseTxt,statusTxt,xhr){
                    if(statusTxt=="success")
                        alert("外部内容加载成功！");
                        alert(responseTxt);
                    if(statusTxt=="error")
                        alert("Error: "+xhr.status+": "+xhr.statusText);
                });


                $.ajax({
                    url: "https://crossorigin.me/http://www.w3school.com.cn/example/jquery/demo_test.txt",
                    useDefaultXhrHeader: false, //important, otherwise its not working
                    type: "GET",
                    dataType: 'text',
                    success: function(response, opts) {alert("success")},
                    failure: function(response, opts) {alert("failure")}
                });

            });
        });
    </script>
</head>
<body>




<button>向页面发送 HTTP GET 请求，然后获得返回的结果</button>

</body>
</html>