AJAX跨域请求详解
最近开始学习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跨域请求详解的更多相关文章
- jquery ajax跨域请求详解
本文章来给大家详细jquery中的ajax跨域请求, 在JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的jquery.ajax jsonp格式和jque ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
- jQuery jsonp跨域请求详解
跨域的安全限制都是对浏览器端来说的,服务器端是不存在跨域安全限制的. 浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互. 如果协议,端口和主机对于两个页面是相同的,则两个页面具 ...
- day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记
课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现 SSO系统就是解决分布式环境下登录问题的,本 ...
- jQuery中getJSON跨域原理详解
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp28 jQuery中getJSON跨域原理详解 前几天我再开发一个叫 河蟹工 ...
- .Net Ajax跨域请求总结
导语 之前写过一篇文章Ajax跨域请求COOKIE无法带上的解决办法,这两天正好好好的查了一下相关知识,做来总结一下 一.传统 ajax跨域访问是一个老问题了,解决方法很多,比较常用的是JSONP方法 ...
- 浅谈linux 下,利用Nginx服务器代理实现ajax跨域请求。
ajax跨域请求对于前端开发者几乎在任何一个项目中都会用到,众所周知,跨域请求有三种方式: jsonp; XHR2 代理: jsonp: 这种应该是开发中是使用的最多的,最常见的跨域请求方法,其实aj ...
- 「JavaScript」四种跨域方式详解
超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript 的同源策略,并且了解使用跨域跨域的理由. 1. JSONP 首先要介绍的跨域方法必然是 JSON ...
- 本地主机作服务器解决AJAX跨域请求访问数据的方法
近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www. ...
随机推荐
- 你不知道的JavaScript--Item6 var预解析与函数声明提升(hoist )
1.var 变量预编译 JavaScript 的语法和 C .Java.C# 类似,统称为 C 类语法.有过 C 或 Java 编程经验的同学应该对"先声明.后使用"的规则很熟悉, ...
- C++雾中风景9:emplace_back与可变长模板
C++11的版本在vector容器添加了emplace_back方法,相对于原先的push_back方法能够在一定程度上提升vector容器的表现性能.所以我们从STL源码角度来切入,看看这两种方法有 ...
- main.go
package main import ( "flag" "fmt" "log" "os" ...
- 将函数声明为Static的作用
表示静态函数,它为所有类共有的.调用该函数直接使用类名加上修饰符,如:Windows win;Windows::W_SIZE();而不是:win.W_SIZE();静态函数只能处理静态数据成员,不能处 ...
- BZOJ_2962_序列操作_线段树
Description 有一个长度为n的序列,有三个操作1.I a b c表示将[a,b]这一段区间的元素集体增加c,2.R a b表示将[a,b]区间内所有元素变成相反数,3.Q a b c表示询问 ...
- springboot redis多数据源
springboot中默认的redis配置是只能对单个redis库进行操作的. 那么我们需要多个库操作的时候这个时候就可以采用redis多数据源. 本代码参考RedisAutoConfiguratio ...
- UR机械臂运动学正逆解方法
最近几个月因为工作接触到了机械臂的项目,突然对机械臂运动方法产生了兴趣,也就是如何控制机械臂的位置和姿态.借用一张网上的图片,应该是ur5的尺寸.我用到的是ur3机械臂,除了尺寸不一样,各关节结构和初 ...
- [dotnet core]落地微服务特色的DevOps管道,持续集成/部署到kubernetes。
目录 前言 目标 工具 - 最小的学习成本 方案 - 愿景 1. 持续集成 - CI 2. 持续部署 - CD 部署环境 1. 部署gitlab-runner 2. 注册gitlab-runner 搭 ...
- 阿里云Centos7.x MySql安装教程示例
创建用户 useradd mysql; passwd mysql; 下载(比如:5.5.61) 地址 https://dev.mysql.com/downloads/mysql/5.6.html#do ...
- .NET Core IdentityServer4实战 第三章-使用EntityFramework Core进行持久化配置
内容:本文带大家使用IdentityServer4进行使用使用EntityFramework Core进行配置和操作数据 作者:zara(张子浩) 欢迎分享,但需在文章鲜明处留下原文地址. 前两章内容 ...