Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Updating a Feature Layer with useCors: false causes syntax error for some services #1064

Closed
ahalota opened this issue Mar 9, 2018 · 6 comments
Closed

Updating a Feature Layer with useCors: false causes syntax error for some services #1064

ahalota opened this issue Mar 9, 2018 · 6 comments

Comments

@ahalota
Copy link

ahalota commented Mar 9, 2018 •
edited
Loading

I've seen this issue only show up with the layer published below. Did not get the same issue with the marker feature layer shown in the polygon. (Sorry, tried and failed to set up a jsfiddle for this...pasted below my whole sample code.

If you plug this on and set up the console. Click 'toggle layer', and it adds the feature layer just fine. Removing its ok, but when it gets re-added it shows this error in the console:

Uncaught SyntaxError: Unexpected token :

What is this error related to? It seems to get the response just fine, but after initially removing a layer I am not able to re-add it again. This happens only with the option useCors: false.

EDIT: This also happens when I am moving around the map once I have added the layer. Basically the request that is sent out to get the data gives back that error (it's usually several logs on the console at once, I assume a few requests are sent out to grab the data for each subset of the area)

<html>
<head>
  <meta charset=utf-8 />
  <title>Simple FeatureLayer</title>
  <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />

    <!-- Load Leaflet from CDN -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
    integrity_no="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
    crossorigin=""/>
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
    integrity_no="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw=="
    crossorigin=""></script>


    <!-- Load Esri Leaflet from CDN -->
    <script src="https://unpkg.com/[email protected]/dist/esri-leaflet.js"
    integrity_no="sha512-pijLQd2FbV/7+Jwa86Mk3ACxnasfIMzJRrIlVQsuPKPCfUBCDMDUoLiBQRg7dAQY6D1rkmCcR8286hVTn/wlIg=="
    crossorigin=""></script>


  <style>
    body { margin:0; padding:0; }
    #map { position: absolute; top:20; bottom:0; right:0; left:0; }
  </style>
</head>
<body>

<button id="button" onclick="toggleLayer()">Toggle feature Layer</button>
<div id="map">
</div>

<script>
  var map = L.map('map').setView([18.24, -66.41],10);

  L.esri.basemapLayer('Streets').addTo(map);
  var fl = L.esri.featureLayer({
    url: 'https://maps.nccs.nasa.gov/server/rest/services/gliht/201703_PuertoRico_test/MapServer/16',
    useCors: false
  });
  
  function toggleLayer(){
	  if (map.hasLayer(fl)){
		  console.log('removing feature layer');
		  map.removeLayer(fl);
		  console.log('removed feature layer');
	  } else {
		  console.log('adding feature layer');
		  map.addLayer(fl);
		  console.log('added featue layer');
	  }
  }
  
  
</script>

</body>
</html>
@ahalota ahalota changed the title Re-adding a Feature Layer with useCors: false causes syntax error for some services Updating a Feature Layer with useCors: false causes syntax error for some services Mar 9, 2018
@kragoth
Copy link

kragoth commented Mar 19, 2018

@ahalota I am also getting this error. However, I get some success if I set the isModern flag to false when adding the feature layer.
Unfortunately, this seems to have another very problematic bug. Not all features will render. In fact, very few features seem to render for me.
I'm at a bit of a loss on this one at the moment.

Anyway, I've created a jsbin with your code and added the isModern: false so you can see what happens.

@jgravois
Copy link
Contributor

why are you setting useCors: false? your service supports it.

either way, you found a JSONP bug in ArcGIS Server that only affects geojson output.

https://maps.nccs.nasa.gov/server/rest/services/gliht/201703_PuertoRico_test/MapServer/16/query?where=1=1&f=json&callback=myCallback

myCallback({
  // ...
  "features": [
    // ...
  ]
});

https://maps.nccs.nasa.gov/server/rest/services/gliht/201703_PuertoRico_test/MapServer/16/query?where=1=1&f=geojson&callback=myCallback

// response NOT wrapped in a callback
{
  "type": "FeatureCollection",
  "features": [
    // ...
  ]
}

the error is reproducible in 10.6, but not in ArcGIS Online hosted feature services

the reason you don't see the problem in Esri Leaflet immediately is that we use f=json until we're able to make a metadata request to confirm support for native geojson in the service.

@garymd210
Copy link

garymd210 commented Mar 22, 2018 •
edited by jgravois
Loading

Yes – will forward / discuss with the server devs

@ahalota
Copy link
Author

ahalota commented Mar 22, 2018

At the time it hadn't allowed CORS from my host, the admin changed it for me, so I enabled it after that and just ignored the issue.

@ahalota ahalota closed this as completed Mar 22, 2018
@ahalota ahalota reopened this Mar 22, 2018
@jgravois
Copy link
Contributor

thx @garymd210!

@jgravois
Copy link
Contributor

not much more we can do in esri-leaflet. closing.

@jgravois jgravois mentioned this issue Mar 20, 2019
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@jgravois @garymd210 @kragoth @ahalota