API Key not working?

[LefterisKoumis]

I have two sites with identical codes but on one of them the apikey is not working, and the search widget is failing. I need a fresh pair of eyes. Am I missing anything?

Working site:

https://codepen.io/lkoumis1/pen/poaYzNG?editors=1000

Not working site:

http://svctenvims.dot.ca.gov/test_search/

The script is at:

http://svctenvims.dot.ca.gov/test_search/calcite.js

[ReneRubalcava]

It's not the apiKey. Your map is called webmap, but you still reference it as map.

const webmap = new WebMap({
  portalItem: {
    // autocasts as new PortalItem()
    id: "55ebf90799fa4a3fa57562700a68c405",
  },
});

const view = new MapView({
  map, // should be map: webmap
  container: "viewDiv",
  center: [-119.475, 37.737],
  zoom: 5,
});

[LefterisKoumis]

Sorry, you caught it while I was working on the code and you got that error.  The code now shows no errors but still the issue persists.

The issue is not the map. map in the code is just a variable that defines a new webmap. 

So, the code that shows no errors and it doesn't work is shown below  even though it's identical to the codeview. THe code in codeview uses the variable map as well to define the webmap.

 const map = new WebMap({
      portalItem: {
        id: "55ebf90799fa4a3fa57562700a68c405"
      }
    });
   

    const view = new MapView({
      map,
      container: "viewDiv",
      center: [-119.475, 37.737],
      zoom: 5
    });
	
	  const search = new Search({
      view: view,
          includeDefaultSources: false,
          sources: [           
            {
              name: "ArcGIS World Geocoding Service",
              placeholder: "example: Nuuk, GRL",
              singleLineFieldName: "SingleLine",
              apiKey: "AAPK7472adbedaa9448a8fb246f57ee83a447vIlk5Z-RKxy_pGyWaNdDuLrhh2nuOJdHJNMJch4AHAzDM96kvMcD8r1uM0UArb2",
              suggestionsEnabled: true,
              minSuggestCharacters: 2,
              locator:
                "https://geocode-api.arcgis.com/arcgis/rest/services/World/GeocodeServer"
            }

          ]
      });

[ReneRubalcava · Accepted solution]

Ah, your app is using the "next" release for 4.24, which isn't officially released.

In the sources, change the locator property to url.

url: "https://geocode-api.arcgis.com/arcgis/rest/services/World/GeocodeServer"

It's noted in the breaking changes in the changelog for the next release

https://github.com/Esri/feedback-js-api-next/blob/master/CHANGELOG.md#breaking-changes