When you sign into ArcGIS Online, some cookies are stored in the browser for the domain .arcgis.com/. Then, when you browse a web page served in a different domain and referencing the ArcGIS API for JavaScript via CDN, those cookies act as third-party cookies and could potentially be added to the hundreds of requests made to get the JavaScript files of the ArcGIS JS API.
Chrome and Chromium browsers (such as Edge) create an issue for every request and cookie with the following message:
Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute
Because a cookie’s SameSite attribute was not set or is invalid, it defaults to SameSite=Lax, which prevents the cookie from being sent in a cross-site request. This behavior protects user data from accidentally leaking to third parties and cross-site request forgery.
Resolve this issue by updating the attributes of the cookie:
- Specify SameSite=None and Secure if the cookie should be sent in cross-site requests. This enables third-party use.
- Specify SameSite=Strict or SameSite=Lax if the cookie should not be sent in cross-site requests.
The creation of thousands of issues blocks the Developer tools for 1-2 minutes, during which time neither messages appear in the console nor it is possible to refresh the page. Is there any solution for this?
I'm using the ArcGIS API for JavaScript 4.19. Any code referencing the API will reproduce this issue, but you can find an example below.
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>Sketch widget | Sample | ArcGIS API for JavaScript 4.19</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.19/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.19/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/GraphicsLayer",
"esri/layers/MapImageLayer",
"esri/widgets/Sketch/SketchViewModel"
], (Map, MapView, GraphicsLayer, MapImageLayer, SketchViewModel) => {
const mapImageLayer = new MapImageLayer({
url: "http://sampleserver6.arcgisonline.com/arcgis/rest/services/VerticalLines/MapServer"
});
const graphicsLayer = new GraphicsLayer();
const map = new Map({
layers: [mapImageLayer, graphicsLayer]
});
const view = new MapView({
container: "viewDiv",
map: map,
scale: 75000
});
view.when(() => {
const sketch = new SketchViewModel({
layer: graphicsLayer,
view: view,
defaultCreateOptions: { hasZ: false }
});
sketch.create("point");
sketch.on("create", evt => {
if (evt.state === "complete") {
console.log(evt);
}
});
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>