问题汇总:跨域访问需要后台那边配合吗?为什么动态生成函数名?等等、、、

问题汇总:跨域访问需要后台那边配合吗?为什么动态生成函数名?等等、、、

问题一:跨域访问需要后台配合吗?比如说接受到请求时候,取jsonp=abc中abc作为函数名返回,这个是需要后台那边设置,还是jsonP请求自动处理的?

问题二:在函数内部删除函数自身,这个操作有点看不懂,自己删除自己JS不会报错吗?

getJSONP[name] = function(e) {

            try {

                callback && callback(e);

            } catch (e) {

                //

            } finally {

                //最后删除该函数与script元素

                delete getJSONP[name];

                script.parentNode.removeChild(script);

            }

        }

问题三:为什么动态生成函数名,在问答区里面看到了老师的回答,是为了两次请求的时候,避免干扰,比如说第一次返回abc(data),第二次请求返回abc(data),第二次的会覆盖第一次的,这解释不通啊,既然我刷新了,第一次就是老数据,无法使用了。


问题四:关于url是否存在的检测,和callback&&callback(data)的操作中检测callback我感觉可以去掉,因为url是自己传的,应该会传过去,第二个callback,也是自己传的,只要传过去就有啊

我自己简化了一个方法,老师帮忙看看

<script type="text/javascript">

//简单版,避免了函数名动态生成,以及动态生成之后服务器返回的函数名不同带来的处理,

//避免了检测url为空和callback为空的情况,省略了用完删除函数、移除script带来的环境变量干扰

jsonP('http://class.imooc.com/api/jsonp?jsonp=cbFn',function(data){

console.log(data);

//拿到数据之后进行的操作

});

function jsonP(url,callback){

//根据url创建script标签

var script=document.createElement('script');

script.src=url;

document.getElementsByTagName("head")[0].appendChild(script);

//定义执行成功之后返回的函数名对应的函数

//这里之所以定义是要在函数体里面取出data,跨域访问的目的就是要拿到data

// 拿到data之后调用本地函数,也就是传入函数参数里面的callback函数

cbFn=function(data){

callback(data);

}

}

</script>


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,对与你的问题解答如下:

1、使用随机数确实存在重名的情况,但是这个概率是非常小的,可以忽略不计。

2、随机函数名是在发送请求时传递给服务器的,如果不设置为随机的话,那么多次请求时,就会因为函数名相同,而覆盖前面发送的请求。这里删除函数名,是在调用之后也就是数据返回来之后才删除的,并不会避免请求混乱的问题。所以在发送请求时需要传递随机函数名的。

祝学习愉快~

  • 王文辉 提问者 #1
    随机函数名是在发送请求时传递给服务器的,如果不设置为随机的话,那么(多次请求时,就会因为函数名相同),而覆盖前面发送的请求。 我突然好像明白了,两个请求域名的域名不同,如果采用相同的函数名,name就容易导致一个的请求的数据被两个请求使用。 比如说第一个发送的请求是getJsonP('http://www.A.com?abc=aFn',function(){}),然后第二个发送的请求是getJsonP('http://www.B.com?abc=aFn',function(){}),两个请求理论上饭后的函数都是aFn(data),但可能在下面这种情况下发生错误:在第一个请求发出,然后第二个请求发出,然后第一个请求返回aFn(data),但这个时候aFn(data)可能被认为是第二个请求的返回结果
    2020-04-30 23:05:40
  • 好帮手慕慕子 回复 提问者 王文辉 #2
    同学你好,域名相同时,发送多个请求,由于函数名相同,也会覆盖前面的发送的请求,祝学习愉快~
    2020-05-01 12:17:59
好帮手慕慕子 2020-04-30 14:38:08

同学你好,对于你的问题解答如下:

1、是的,跨域需要后台配合的,跨域请求中的函数名是需要前后台一起商量决定的,才能够达到前台跨域请求时,返回对应的数据。

2、不会报错的,这段代码相当于删除getJSONP的一个属性,老师写了一个简单的示例代码,帮助同学更好的理解下,示例:

http://img1.sycdn.imooc.com//climg/5eaa6ebb09439d3711860556.jpg

打印结果如下,不会出现报错

http://img1.sycdn.imooc.com//climg/5eaa6eca09c9c8c512860388.jpg

3、老师的意思是在页面不刷新的情况下,多次发送请求,会发生覆盖问题。

4、同学这种写法也是可以返回数据的, 但不推荐同学去掉,因为在实际工作中,可能是让你封装了这个跨域方法供团队所有人使用,你自己知道这里要传递url, 但是可能存在其他人不知道的情况,调用了这个方法,所以添加判断是为了防止操作有误,造成代码出现问题,回调函数这里添加判断,也是为了防止万一没有返回参数,直接调用会出现报错。 所以添加上判断会让代码更加严谨。

同学可以试着理解下,祝学习愉快~

  • 提问者 王文辉 #1
    老师的回答真的太简单明了了,疑问那么多,差不多都知道了,就是关于第3个问题,动态生成函数名,不刷新页面发送多个请求,我是这么理解的,页面中有30个跨域的问题,需要新增30个script,陆续会发送30个请求,常规理解是第一个请求发送,服务器处理完第一个请求,返回函数名,然后继续第二个,但由于网络传输的异步和不确定性,可能第一个请求先发出,可是在第四个请求发出但还没结束收到第一个请求的数据,如果不动态生成函数名,每一个函数名相同,这个时候callback是第四个请求的函数,会执行第四个的。。。。但后来想想有两个问题,一个即使动态生成函数名,也还是会有小概率两个函数重名;第二个问题是,每一个请求结束之后会删除返回来的函数名(delete getJSONP【name】),这样已经可以很大程度的规避请求混乱的问题了。 嗯,如果老师感觉有点绕,可以换个方式让我明白下为什么动态生成函数名吗,就是这么,怎么想都不明白,代码也敲了几次了
    2020-04-30 15:04:41
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
2.组件化网页开发
  • 参与学习           人
  • 提交作业       1121    份
  • 解答问题       14456    个

本阶段在运用JS实现动态网页开发的基础上,带你深入理解企业开发核心思想,完成一个企业级网页的开发,体验前端工程师的成就感。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师