JavaScript ES6 Fetch API时需要注意的一个Cookie问题
When I am doing a test of comparison between Stateful and Stateless BSP application ( mentioned in blog Stateless and Stateful – Different behavior in application side ), I meet with a strange issue.
The conclusion is stateful BSP application will handle request sequentially. Suppose in client I send two request A and B to server. Request A takes 3 seconds to finish and B 2 seconds.
The request is sent via jQuery API.
It means for stateful application, I will observe the following timeline in Chrome network tab:
(1) the start time of both request are almost the same, since I send out two request in client code almost at the same time.
(2) even though the second request itself takes 2 seconds to finish, the total processing time for it is 3 seconds waiting for A to finish first + 2 seconds = 5 seconds in the end.
The above test did verify the conclusion.
However when I change the approach to send request into ES6 fetch API,
<%@page language="abap" %> <%@extension name="htmlb" prefix="htmlb" %> <!DOCTYPE html> <html> <head> <title>Jerry Test Stateful</title> </head> <body> <button onclick="fire()">Fire two request</button> <script> function wrapperOnFetch(url){ fetch(url).then(function(response){ return response.json(); }).then(function(json){ console.log(url + ":" + json.message); }); } function fire(){ wrapperOnFetch("first.json"); wrapperOnFetch("second.json"); } </script> </body> </html>
the testing request for stateful application looks as below this time:
The two requests are handled simultaneously ( request B only takes 2 seconds to finish, no 3 seconds’ wait time for A to finish this time ), the response of second request returns first before the first, which could be observed in console:
why the latest ES6 API causes such discrepancy with known conclusion?
Just compare the cookie of requests sent via these two kinds of API:
Through comparison I get to know that the session cookie
sap-contextid is not sent together with request triggered by ES6 Fetch API.
Then in Fetch documentation I find out that I need to add option credentials: “include”.
function wrapperOnFetch(url){ // enable session cookie sent with request fetch(url,{ credentials:"include" }).then(function(response){ return response.json(); }).then(function(json){ console.log(url + ":" + json.message); }); }
After this change the stateful BSP application behaves as expected: the requests are handled in sequence.
本文来自云栖社区合作伙伴“汪子熙”,了解相关信息可以关注微信公众号"汪子熙"。
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
Chrome开发者工具里的一个隐藏技能:chrome://net-internals
During my holiday I was writing a small tool for fun, which extracts my personal posts from http://www.baidu.com for further analysis.I am using AJAX in jQuery to perform a synchronous call to fetch html source code of given url specified by argument requestURL.、 function getPostByAJAX(requestURL){ var html = $.ajax({ url: requestURL, async: false}).responseText; return html; } The requestURL I am using is http://tieba.baidu.com/i/i/my_tie However when I try to access it via my JavaScript code a...
- 下一篇
ThreadLocal 核心源码解析
# 1 前言 此类提供线程本地变量。这些变量与普通变量不同,因为每个访问一个变量(通过其get或set方法)的线程都有其自己的,独立初始化的变量副本。 ThreadLocal 实例通常是期望将状态与线程(例如,用户ID或事务ID)关联的类中的 private static 字段。 例如,下面的类生成每个线程本地的唯一标识符。线程的ID是在第一次调用ThreadId.get() 时赋值的,并且在以后的调用中保持不变。 ![](https://uploadfiles.nowcoder.com/images/20200324/5088755_1585021172479_C478AA1A06FECA1567F29CCF948C1245 "图片标题") 只要线程是活跃的并且 ThreadLocal 实例是可访问的,则每个线程都对其线程本地变量的副本持有隐式的引用。线程消失后,线程本地实例的所有副本都会被 GC(除非存在对这些副本的其他引用)。 # 2 继续体系 - 继承?不存在的,这其实也是 java.lang 包下的工具类 ![](https://uploadfiles.nowcoder.c...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- CentOS7,CentOS8安装Elasticsearch6.8.6
- Docker使用Oracle官方镜像安装(12C,18C,19C)
- Red5直播服务器,属于Java语言的直播服务器
- SpringBoot2全家桶,快速入门学习开发网站教程
- CentOS8安装MyCat,轻松搞定数据库的读写分离、垂直分库、水平分库
- SpringBoot2更换Tomcat为Jetty,小型站点的福音
- Jdk安装(Linux,MacOS,Windows),包含三大操作系统的最全安装
- Hadoop3单机部署,实现最简伪集群
- CentOS关闭SELinux安全模块
- CentOS7安装Docker,走上虚拟化容器引擎之路