json解决ajax跨域的原理
- jsonp只能解决GET类型的ajax请求跨域问题
- jsonp请求不是ajax请求,而是一般的get请求
- 基本原理
- 浏览器端:
- 动态生成<script>来请求后台接口(src就是接口的url)
- 定义好用于接受响应数据的函数(fn),并将函数名通过请求参数提交给后台(如:callback=fn)
- 服务器端
- 接收到的请求处理产生结果数据后,返回一个函数调用的js代码,并将结果数据作为实参传入函数调用
- 浏览器端
- 收到响应自动执行函数调用的js代码,也就是执行了提前定义好的回调函数,并得到了需要的结果数据
- 浏览器端:
/*
jsonp请求的接口请求函数
*/
export const reqWeather= (city)=>{
return new Promise((resolve,reject) => {
const url = `http://wthrcdn.etouch.cn/weather_mini?city=${city}`
//发送jsonp请求
jsonp(url,{},(err,data) =>{
console.log('json()',err,data)
//如果成功了
if(!err&&data.status===){
const {date,type} = data.data.forecast[]
resolve({date,type})
}else{
//如果失败了
message.error('获取天气信息失败')
}
})
})
}
//reqWeather('武汉')
json解决ajax跨域的原理的更多相关文章
- Ajax操作如何实现跨域请求 (JSONP和CORS实现Ajax跨域的原理)
由于浏览器存在同源策略机制,同源策略阻止ajax (XMLHttpRequest) 从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性. 特别的:由于同源策略是浏览器的限制,所以请求的发送和响 ...
- jQuery的ajax跨域 Jsonp原理
1.Jsonp Jsonp(json with padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题. Jsonp是为了解决ajax跨域发送http请求出现的,利用S ...
- e3mall商城总结11之sso系统的分析、应用以及解决ajax跨域问题
说在前面的话 一.sso系统分析 什么是sso系统 SSO英文全称Single Sign On,单点登录.SSO是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统.它包括可以将这次 ...
- 如何解决ajax跨域问题(转)
由 于此前很少写前端的代码(哈哈,不合格的程序员啊),最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决 ajax的跨域问题.本篇将讲述一个小白从遇到跨域不 ...
- 看小白如何解决ajax跨域问题
由于此前很少写前端的代码(哈哈,不合格的程序员啊),最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决ajax的跨域问题.本篇将讲述一个小白从遇到跨域不知道 ...
- 如何解决ajax跨域问题
如何解决ajax跨域问题(转) 由 于此前很少写前端的代码(哈哈,不合格的程序员啊),最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决 ajax的跨域问题 ...
- 如何解决Ajax跨域问题-1
如何解决Ajax跨域问题 最近在做AJAX调用C的问题,出现跨域问题,学习总结如下: 在做ajax读取数据的时候,经常会遇到ajax需要跨域的问题,但由于浏览器安全方面的限制,XMLHttpReque ...
- 解决ajax跨域问题的一种方法
解决ajax跨域问题的一种方法 前后端分离经常用json来传输数据,比较常见的问题就有ajax跨域请求的错误问题,这里是我的一种解决方法: 在java中加入如下的注解类: import org.spr ...
- 【前端_js】解决ajax跨域请求数据
1.ajax发送请求必须遵循同源策略,即请求方和相应方的协议头.域名.端口全部一样.只要三者有一个不一样都视为跨域,浏览器出于安全考虑不允许跨域访问. 解决ajax跨域访问的常用方法: a.使用jso ...
随机推荐
- 关于《iBoard 电子学堂》的学习及进阶方式(精 转)
关于<iBoard 电子学堂>的学习及进阶方式 <iBoard 电子学堂>自发布以来,受到广大网友的热烈关注.虽然我前期设计我花了大量精力,但能得到大家的认可,我也非常欣慰.由 ...
- robotframework配置邮箱服务器
1.登录邮箱以腾讯企业邮箱为例:开启smtp服务并获得邮箱的客户端授权码 用户名:18890260218@163.com 客户端授权码:admin123 2.进入系统管理-->GO to plu ...
- Oracle - 通过dg,完成单实例到rac的迁移
一.概述 本文将介绍如何给单实例搭建一个rac dg,以及如何对其进行角色转换,完成从单实例到rac的迁移.预先具备的知识(rac搭建,单实例-单实例dg搭建) 二.实验环境介绍 主库(已有数据库实例 ...
- 解决Vue报错:TypeError: Cannot read property 'scrollHeight' of undefined
如图: 解决问题的根源: 这个DOM元素找不到,或者是初始化的时候没有初始化成功,总之就是这个DOM元素并没有创建成功就进行了操作.保证这个DOM元素创建成功了就不会存在这个问题了.判断当前DOM元素 ...
- 关于Manjaro+kde桌面Tim闪退的解决
文章目录 关于Manjaro+kde桌面Tim闪退的解决 参考 Tim 我的问题 QQ 我的问题 WeChat 我的问题 本文结束 关于Manjaro+kde桌面Tim闪退的解决 参考 https:/ ...
- webpack安装出错(电脑设置了代理)
安装webpack的时候发现第一句话就报错了,之后查了一下找到原因,原来是因为设置了代理服务原文 ,参考了之后知道是因为代理问题,就按着来做
- SpringCloud分布式配置中心
一.什么是配置中心 在分布式系统中,由于服务数量巨多,为了方便服务配置文件统一管理,实时更新,所以需要分布式配置中心组件.在Spring Cloud中,有分布式配置中心组件spring cloud c ...
- 构建 CDN 分发网络架构简析
构建 CDN 分发网络架构 CDN的基本目的:1.通过本地缓存实现网站的访问速度的提升 CDN的关键点:CNAME在域名解析:split智能分发,引流到最近缓存节点
- Spring基础——IOC九种bean声明方式
Spring简介 Spring不是服务于开发web项目的功能,或业务.而是服务于项目的开发,方便各层间的解耦调用,方便对类的批量管理,是提高软件开发效率,降低后期维护成本的框架. Spring的核心思 ...
- 松软科技Web课堂:JavaScript 正则表达式
正则表达式是构成搜索模式的字符序列. 该搜索模式可用于文本搜索和文本替换操作. 什么是正则表达式? 正则表达式是构成搜索模式(search pattern)的字符序列. 当您搜索文本中的数据时,您可使 ...