JSONP跨域请求封装以及php服务端解决跨域请求

最新推荐文章于 2021-11-13 22:49:17 发布

无处安放的前端

最新推荐文章于 2021-11-13 22:49:17 发布

阅读量604

点赞数 1

分类专栏：案例

本文链接：https://blog.csdn.net/qq_43512502/article/details/88385173

版权

案例专栏收录该内容

22 篇文章 0 订阅

订阅专栏

function jsonp (url, params, callback) {
    let  funcName = 'jsonp'+Date.now()+Math.random().toString().substr(2,5);
    if (typeof params === 'object') {
        let tempArr = [];
        for (key in params) {
            let value = params[key];
            tempArr.push(key+'='+value);
        }
        params = tempArr.join('&')
    }
    let script = document.createElement('script');
    script.src = url + '?' +params + '&callback=' + funcName;
    document.body.appendChild(script);
    window[funcName] = function (data) {
        callback(data);
        delete window[funcName];
        document.body.removeChild(script)
    }
}

//服务端代码
<?php 
//建立连接 @ 调用函数时候忽略错误

$mysqlconnect = @mysqli_connect('127.0.0.1','root','123123','android_db');
$newslist = mysqli_query($mysqlconnect,"select * from t_news");
   while ($data = mysqli_fetch_assoc($newslist)) {
      if(empty($data)){
         return ;
      }
      $datas[] = $data;
   }
   if (empty($_GET['callback'])) {
      header("Content-Type:text/json");  
      echo json_encode($datas);  
      exit();    
   }
   // 一行代码搞定
   //如果不想写jsonp 可以在服务端添加 header('Access-Control-Allow-Origin: *');代码 允许跨域请求 
  header("Content-Type:text/javascript");
   $result = json_encode($datas);
   echo "typeof {$_GET['callback']} == 'function'&&{$_GET['callback']}({$result})";
   //释放结果集
   mysqli_free_result($newslist);
   //关闭连接
   mysqli_close($mysqlconnect);


 ?>