Ajax跨域访问报错

Jammm
2020-03-11 / 0 评论 / 431 阅读 / 正在检测是否收录...

首先我们先来看下代码:

Access to XMLHttpRequest at 'XXXXXX' from origin 'XXXXXXXXXXX' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present

错误原因:
本地路径和目标路径不是同一个域名下引起的跨域问题,并且,就算两个域名是同一个一级域名不同二级域名的时候,例如a.baidu.comb.baidu.com是属于不同域的,也是会出现这个问题

出于安全原因,浏览器限制从脚本内发起的跨源HTTP请求。 例如,XMLHttpRequest和Fetch API遵循同源策略。 这意味着使用这些API的Web应用程序只能从加载应用程序的同一个域请求HTTP资源,除非响应报文包含了正确CORS响应头。

aspx解决方法

在服务器aspx页面头文件里加:

<meta http-equiv="Access-Control-Allow-Origin" content="*" />
详细访问:CSDN

Java解决方法

1.配置跨域访问的最简单的方式是用通配符 * ,(就是不安全,所有的请求都能跨域),如下代码:

response.setHeader("Access-Control-Allow-Origin","*");

2.这种方式不爽的地方就是前端浏览器不能带cookie信息(前端不能用带cookie的请求模式)如下:

response.setHeader("Access-Control-Allow-Origin","*");
response.setHeader("Access-Control-Allow-Credentials","true");//保持跨域 Ajax 时的 Cookie

服务器端 Access-Control-Allow-Credentials = true时,参数Access-Control-Allow-Origin 的值不能为 ‘*’ 。否则不起作用

详细查看:CSDN


php解决方法

<?php
    header('Content-Type: text/html;charset=utf-8');
    header('Access-Control-Allow-Origin:*'); // *代表允许任何网址请求
    header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE'); // 允许请求的类型
    header('Access-Control-Allow-Credentials: true'); // 设置是否允许发送 cookies
    header('Access-Control-Allow-Headers: Content-Type,Content-Length,Accept-Encoding,X-Requested-with, Origin'); // 设置允许自定义请求头的字段
if($_GET['name']) { 
  $name = $_GET['name'];
  echo $name;
} else { 
  echo "请求成功但。。。。";
} ?>
原文地址:点击访问

Node.js解决方法

方法一

//设置跨域访问
app.all('*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
  res.header("X-Powered-By",' 3.2.1')
  res.header("Content-Type", "application/json;charset=utf-8");
  next();
});
原文地址:点击访问

方法二 使用express中间件cors

const cors=require('cors')
app.use(cors())

方法三 安装request
安装

npm install request -s

基本用法

//在service中添加request
const request=require('request')
app.get('/cors',(req,res)=>{
    request('http://XXXXXXXX/XXX',(err,response,body)=>{
        if(!err){
            res.send(body)
        }
    })
})
本文共 378 个字数,平均阅读时长 ≈ 1分钟
0

打赏

海报

正在生成.....

评论 (0)

取消