ajax实现jsonp跨域接口
HTML页面代码:
<script type="text/javascript">
function UrlSearch(){
var name,value;
var str=location.href; //取得整个地址栏
var num=str.indexOf("?")
str=str.substr(num+1); //取得所有参数 stringvar.substr(start [, length ]
var arr=str.split("&"); //各个参数放到数组里
for(var i=0;i < arr.length;i++){
num=arr[i].indexOf("=");
if(num>0){
name=arr[i].substring(0,num);
value=arr[i].substr(num+1);
this[name]=value;
}
}
}
function jsonp(){
var Request=new UrlSearch(); //实例化
var goods_name = Request.name
$.ajax({
type: "GET",
async: false,
url:"http://test.com/jp4.php",
dataType: "jsonp",
data:{goods_name:goods_name},
jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(callback)
jsonpCallback:"call",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
success: function(jsons){
console.log(jsons)
if(jsons.status==1){
alert("goods_id:"+jsons.goods_id+";\n面料编号:"+jsons.goods_name+";\n描述是:"+jsons.keywords+';\n基本价格是:'+jsons.shop_price+"韩元")
}else if(jsons.status==0){
alert(jsons.data)
}
},
error: function(jsons){
//console.log(jsons)
alert(jsons.status+"\n路径错误")
}
});
}
window.onload=(jsonp());
</script>
PHP代码:
<?php
include_once "./radio_class.php";
$radio = new Radio();
$goods_name = $_GET["goods_name"];
//$goods_name = 'Mvbb4AeP';
if(empty($goods_name)){
$arr = array('data'=>'参数为空','status'=>0);
$results = json_encode($arr);
echo "call($results)";exit();
}
$table='ecs_goods';
$where=array('goods_name'=>$goods_name);
$fieldes=array('goods_id','goods_name','keywords','shop_price');
$arr = $radio->fileds_select($table,$where,$fieldes);
//print_r($arr);
echo $arr;
exit();
附:radio_class.php
<?php
header('content-type:text/html;charset=utf-8');
class Radio{
private $host;
private $port;
private $user;
private $pass;
private $dbname;
private $charset;
private $link;
private static $db;
public function __construct($arr=array()){
$this->host = isset($arr['host']) ? $arr['host'] : 'localhost';
$this->port = isset($arr['port']) ? $arr['port'] : '3306';
$this->user = isset($arr['user']) ? $arr['user'] : 'root';
$this->pass = isset($arr['pass']) ? $arr['pass'] : 'root';
$this->dbname = isset($arr['dbname']) ? $arr['dbname'] : 'newlibrary';
$this->charset = isset($arr['charset']) ? $arr['charset'] : 'utf8';
//连接数据库
$this->db_connect();
//选择数据库
$this->db_usedb();
//设置字符集
$this->db_charset();
}
public function __clone(){
trigger_error('克隆不被允许',E_USER_ERROR);
}
private function aaa(){
echo 'nihao1';die;
}
public function __call($action,$b){
var_dump($action);var_dump($b);die;
}
public static function getInstance($arr){
if(!self::$db){
self::$db = new Self($arr);
}
return self::$db;
}
//连接数据库
private function db_connect(){
$this->link=mysqli_connect($this->host.':'.$this->port , $this->user , $this->pass);
if(!$this->link){
echo "数据库连接失败 <br>";
echo "错误编码是".mysqli_errno().'<br>';
echo "错误原因是".mysqli_error().'<br>';
exit;
}
}
//选择数据库
private function db_usedb(){
mysqli_query($this->link,"use {$this->dbname}");
}
//设置字符集
private function db_charset(){
mysqli_query($this->link,"set names {$this->charset}");
}
/**
* 执行sql语句
* @param $sql
* @return source
**/
public function query($sql){
$res=mysqli_query($this->link,$sql);
if(!$res){
echo "SQL语句有错误 <br>";
echo "错误编码是".mysqli_errno($this->link).'<br>';
echo "错误原因是".mysqli_error($this->link).'<br>';
exit;
}
return $res;
}
/**
* 获取一条记录
* 前置条件 资源型
* @param $query
* @return array 二维
**/
public function getRowFromSourse($query,$type='assoc'){
if(!in_array($type, array('assoc','array','row'))){
die('转化错误');
}
$funcname="mysqli_fetch_".$type;
return $funcname($query);
}
/**
* 获取列表
* @param $sql
* @return array 二维
**/
public function getAll($sql){
$query=$this->query($sql);
$list=array();
$list = $this->getRowFromSourse($query);
/*while ($row=$this->getRowFromSourse($query)) {
$list[]=$row;
}*/
return $list;
}
/**
* 显示数据
* @param $table 表名
* @param $fieldes 字段名
* @param $where where条件
* @return array 二维数组
**/
public function fileds_select($table,$where=array(),$fieldes=array()){
$str='1=1';
$strs='';
if(is_array($where)){
foreach ($where as $key => $v) {
$str.=' and '.$key."='".$v."'";
}
}
if(is_array($fieldes)){
foreach ($fieldes as $key => $v) {
$strs.=','.$v;
}
$strs = substr($strs,1);
}
$sql="select $strs from $table where $str";
$result = $this->getAll($sql);
if(empty($result)){
$arr = array('data'=>'数据为空','status'=>0);
$result = json_encode($arr);
return "call($result)";
}
//return $result;die;
$result['status']=1;
$result = json_encode($result);
return "call($result)";
}
}
注:一定要在两个域名下测试哦
ajax实现jsonp跨域接口的更多相关文章
- 06: AJAX全套 & jsonp跨域AJAX
目录: 1.1 AJAX介绍 1.2 jQuery AJAX(第一种) 1.3 原生ajax(第二种) 1.4 iframe“伪”AJAX(第三种) 1.5 jsonp跨域请求 1.6 在tornad ...
- jQuery ajax的jsonp跨域请求
一直在听“跨域跨域”,但是什么是跨域呢?今天做了一些了解.(利用jQuery的jsonp) jQuery使用JSONP跨域 JSONP跨域是利用script脚本允许引用不同域下的js实现的,将回调方法 ...
- AJax与Jsonp跨域访问
一.JavaScript的AJax AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML) 设计AJax使用的一种重要技术 ...
- ajax使用jsonp跨域调用webservice error错误信息"readyState":4,"status":200,"statusText":"success"
主要还是接口写有问题 至于ajax保持简洁写法即可 $.ajax({ dataType: 'jsonp', type: ‘get’, data: {}, url: '' })
- ajax,jsonp跨域访问数据
访问高德aip天气接口 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> & ...
- ajax之jsonp跨域请求
前端ajax请求代码 后台php处理代码
- (三)ajax请求不同源之jsonp跨域
凡是拥有"src"这个属性的标签都具有跨域的能力,比如<script>.<img>.<iframe>. JS中,我们直接用XMLHttpRequ ...
- jquery ajax怎么使用jsonp跨域访问
在项目中使用接口的比较多,在客户端跨域访问,jquery中只能使用jquery ajax的jsonp方法. 值得注意的是,jQuery.ajax()只支持get方式的跨域,post的方式是不支持的.& ...
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
随机推荐
- JAVA 编程规范(上)
2016-03-20 J120-CHARLIEPAN JAVA 编程规范(上) 1. 应用范围 本规范应用于采用J2EE规范的项目中,所有项目中的JAVA代码(含JSP,SERVLET,JA ...
- 尚学堂Spring视频教程(二):Spring控制反转
用Spring来实现IOC 在上节中我们自定义了一个接口BeanFactory和类ClassPathXmlApplicationContext来模拟Spring,其实它们在Spring中确实是存在的, ...
- Stanford CS1 Compilers PA2J notes
[题记·碎碎念] 斯坦福这门Compilers原本放在Coursera上,当年错过档期很是可惜,后来发现他们自己的MOOC站放了一个self paced版本,真是普大喜奔,趁着放假有空学学. 这门课的 ...
- 【HEVC】2、HM-16.7编码一个CU(帧内部分) 1.帧内预测相邻参考像素获取
HEVC帧内预测的35中预测模式是在PU基础上定义的,实际帧内预测的过程则以TU为单位.PU以四叉树划分TU,一个PU内所有TU共享同一种预测模式.帧内预测分3个步骤: (1) 判断当前TU相邻像素点 ...
- 【MySQL】pt-query-digest数据处理并关联业务
参考:www.percona.com/doc/percona-toolkit/2.1/pt-query-digest.htm 通过pt-query-digest将慢日志导入数据库后在表global_q ...
- uva11292 Dragon of Loowater
水题,排序遍历即可 #include<iostream> #include<cstdio> #include<algorithm> using namespace ...
- css secrets----multiple borders
原始文档: https://www.zybuluo.com/freeethy/note/193574 box-shadow solution 只能实现solid border box-shadow表现 ...
- lua弱表引用
1.普通垃圾回收 --lua弱表,主要是删除key或者value是table的一种元方法 --元表里的__mode字段包含k或者v:k表示key为弱引用:v表示value为弱引用 local test ...
- About Mysql 5.7 Installation
After version of mysql 5.7, mysql increase its security level. CMD run as adminstratot cd c:/mysql/b ...
- delpin常用函数
if r>570 then SET_TT(1);//超出多少行就用excel导出 类似数组用法:var ts: TStringlist;begi ...