最近开始学习ajax,学习ajax必须得掌握的就是跨域请求,实际上在不同源的地址上发送请求就是跨域请求

域名地址的组成:

http:// www . google : 8080 / script/jquery.js

      http:// (协议号)

www  (子域名)

google (主域名)

8080 (端口号)

script/jquery.js (请求的地址)

* 当协议、子域名、主域名、端口号中任意一各不相同时,都算不同的“域”。

* 不同的域之间相互请求资源,就叫“跨域”。

我们所了解的能够发送请求的有 img 、link、script 这些

##1    img

img可以发送不同源地址之间的请求,但是无法拿到响应结果;

##2   link

link可以发送不同源地址之间的请求,但是无法拿到响应结果或者说不能够处理;

#3   script

script可以发送不同源地址之间的请求,但是无法拿到响应结果,但是能借助于能够作为js执行能获取数据

跨域请求解决办法----jsonp:

原理:通过script 标签请求一个服务器端的PHP文件,这个文件返回的结果是一段JS,作用是调用我们事先定义好的一个函数,从而将服务器端想要给客户端发过去的数据发送给客户端。具体实现如下:

客户端:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var script = document.createElement('script');
script.src='http://test1.com/jsonp/server.php';
document.body.appendChild(script);
function aabb(res){
console.log(res);
}
</script>
</body>
</html>

服务端:

<?php
$conn=mysqli_connect('127.0.0.1','root','root','demo1'); $query=mysqli_query($conn,'select * from users'); while ($row = mysqli_fetch_assoc($query)){
$data[]=$row;
}
// header('Content-Type:application/json');
// echo json_encode($data);
// 如果客户端采用的是 script 标记对我发送的请求
// 一定要返回一段 javascript header('Content-Type:application/json');
$result=json_encode($data);
echo "aabb({$result})";

注意:但是JSONP只支持 “GET” 请求,但不支持 “POST” 请求。

AJAX跨域请求详解的更多相关文章

  1. jquery ajax跨域请求详解

    本文章来给大家详细jquery中的ajax跨域请求, 在JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的jquery.ajax jsonp格式和jque ...

  2. AJAX请求和跨域请求详解(原生JS、Jquery)

    一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...

  3. jQuery jsonp跨域请求详解

    跨域的安全限制都是对浏览器端来说的,服务器端是不存在跨域安全限制的. 浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互. 如果协议,端口和主机对于两个页面是相同的,则两个页面具 ...

  4. day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记

    课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现   SSO系统就是解决分布式环境下登录问题的,本 ...

  5. jQuery中getJSON跨域原理详解

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp28 jQuery中getJSON跨域原理详解 前几天我再开发一个叫 河蟹工 ...

  6. .Net Ajax跨域请求总结

    导语 之前写过一篇文章Ajax跨域请求COOKIE无法带上的解决办法,这两天正好好好的查了一下相关知识,做来总结一下 一.传统 ajax跨域访问是一个老问题了,解决方法很多,比较常用的是JSONP方法 ...

  7. 浅谈linux 下,利用Nginx服务器代理实现ajax跨域请求。

    ajax跨域请求对于前端开发者几乎在任何一个项目中都会用到,众所周知,跨域请求有三种方式: jsonp; XHR2 代理: jsonp: 这种应该是开发中是使用的最多的,最常见的跨域请求方法,其实aj ...

  8. 「JavaScript」四种跨域方式详解

    超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript 的同源策略,并且了解使用跨域跨域的理由. 1. JSONP 首先要介绍的跨域方法必然是 JSON ...

  9. 本地主机作服务器解决AJAX跨域请求访问数据的方法

    近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www. ...

随机推荐

  1. remove方法

    1.jQuery的remove()方法 http://www.365mini.com/page/jquery-remove.htm ①返回值是jquery对象本身 所以可以做删除再添加的操作 // 移 ...

  2. 16.app后端如何保证通讯安全--url签名

    app和后端的通讯过程中,api请求有可能被别人截取或不小心泄露.那么,怎么保证api请求的安全呢?在这篇文章中,介绍一种常见的保证api请求安全的做法--url签名. 1. url签名详解 在前一篇 ...

  3. nginx 开启 停止 重启

    Nginx的启动.停止与重启 启动 启动代码格式:nginx安装目录地址 -c nginx配置文件地址 例如: [root@LinuxServer sbin]# /usr/local/nginx/sb ...

  4. nsq源码阅读笔记之nsqd(一)——nsqd的配置解析和初始化

    配置解析 nsqd的主函数位于apps/nsqd.go中的main函数 首先main函数调用nsqFlagset和Parse进行命令行参数集初始化, 然后判断version参数是否存在,若存在,则打印 ...

  5. 【bzoj 1407】【Noi2002】Savage

    Description Input 第1行为一个整数N(1<=N<=15),即野人的数目. 第2行到第N+1每行为三个整数Ci, Pi, Li表示每个野人所住的初始洞穴编号,每年走过的洞穴 ...

  6. 浅析ajax原理与用法

    1 ajax原理 Ajax(Asynchronous JavaScript and XML (异步的JavaScript和XML)),是一种快速创建 动态网页的技术,目的是显示动态局部刷新.通过XML ...

  7. NavigationView头部设置监听事件

    直接写解决方法吧: 1.将XML里的静态引入删除: <android.support.design.widget.NavigationView android:id="@+id/nav ...

  8. window10 hello 人脸识别无法启动相机的问题

    win10设置人脸识别的时候无法打开相机.但是在qq,其他软件中可以调用相机,可以打开相机的时候.windows hello 就是打不开,不知道怎么回事. 尝试打开电源选项,有一个   选项,还原一下 ...

  9. Java解析表达式

    需求 思路 总结 需求 指定一个String表达式,表达式符合给出的运算符规范,比如:2!=2 and 2>=3 or 4<=4,计算出表达式的结果(true or false). 支持的 ...

  10. 从壹开始 [vueAdmin后台] 之三 || 动态路由配置 & 项目快速开发

    回顾 今天VS 2019正式发布,实验一波,你安装了么?Blog.Core 预计今天会升级到 Core 3.0 版本. 哈喽大家周三好!本来今天呢要写 Id4 了,但是写到了一半,突然有人问到了关于 ...