分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

jsonp实现跨域请求

发布时间:2023-09-06 01:35责任编辑:熊小新关键词:jsjson跨域

直接用原生ajax请求另一个域的资源,会被同源策略限制,而用<script src="url"></script>这种方式“引入url”,实际上引入了一个js代码,就不会被同源策略限制,可以请求到。

用这个有一个前提就是对方网站后台的返回确实设置了js代码块或者某个callback函数,所以这种请求方式是有特定应用场景的,并不是跨域都能用这种。

1. javascript方式

 ???<script> ???????function getContent() { ???????????/* 原生ajax会被同源限制 ???????????var xhr = new XMLHttpRequest(); ???????????xhr.open(‘GET‘,‘http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301‘); ???????????xhr.onreadystatechange = function () { ?????????????console.log(xhr.responseText); ???????????}; ???????????xhr.send(); ???????????????????????var tag = document.createElement(‘script‘); ??????????tag.src = ‘http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301‘;#} ??????????document.head.appendChild(tag);       document.head.removeChild(tag); ???????} ???????????????/* 回调函数,这个得看api的写法,有的是动态的,有的是写死的。 */ ???????function list(arg) { ???????????console.log(arg) ???????} ???</script>

2. jquery ajax

用这种<script src>引入的方式的话,是不用发POST请求的,因为ajax如下的配置实际上就做了如上的事,也是封装了引入方式,所以最终ajax写POST请求会变为GET请求发送。

$.ajax({ ??????url:‘http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301‘, ???//这儿写GET,POST都一样,最后都发的是GET请求。 ??????type:‘POST‘, ??????dataType:‘jsonp‘, ??????jsonp:‘callback‘, ??????jsonpCallback:‘list‘,}) ???

jsonp实现跨域请求

原文地址:https://www.cnblogs.com/NoYone/p/8270831.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved