Serverless 101: Mission 2 issue

Reference these

I was working thorugh mission 2. I am using javascript. I was required to download 2 different directories.

In the first file “CodelessShoppingCartService” there was an index of a similar name.

in the second file “invoke-api-service-with-generated-sdk” there was a file named index.

Here is the original code for index.html

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"/>
  <title>Backendless Project Template</title>
</head>
<body>
<a href="javascript:getInstructions()">Get Instructions</a>
<a href="javascript:addItem()">Add Item</a>
<a href="javascript:getItems()">Get Items</a>
<a href="javascript:purchase()">Purchase</a>
<div id="output">

</div>
<script src="http://api.backendless.com/sdk/js/latest/backendless.min.js"></script>
<script src="js/services/CodelessShoppingCartService.js"></script>
<script src="js/controller.js"></script>

</body>
</html>

i modified it to include code from the first file

const appId = '34292C6A-B3A7-83DD-FF79-EF9E6913F900';
const apiKey = '<API KEY HERE>';
const serverURL = 'https://api.backendless.com';

Backendless.serverURL = serverURL;
Backendless.initApp(appId, apiKey);
</script>

for a final product of

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"/>
  <title>Backendless Project Template</title>
</head>
<body>
  
<a href="javascript:getInstructions()">Get Instructions</a>
<a href="javascript:addItem()">Add Item</a>
<a href="javascript:getItems()">Get Items</a>
<a href="javascript:purchase()">Purchase</a>
<div id="output">


</div>

<script type="text/javascript"src="http://api.backendless.com/sdk/js/latest/backendless.min.js"></script>
<script type="text/javascript">
  const appId = '34292C6A-B3A7-83DD-FF79-EF9E6913F900';
  const apiKey = '<API KEY HERE>';
  const serverURL = 'https://api.backendless.com';

  Backendless.serverURL = serverURL;
  Backendless.initApp(appId, apiKey);
</script>

<script src="js/services/CodelessShoppingCartService.js"></script>
<script src="js/controller.js"></script>

</body>
</html>

I got it working!!!

3 Likes

THANK you for posting how you solved this. I was driving myself BATTY(ier) with the CORS-related error I was seeing and trying to set this and that in my browsers to fix it. To those who come afterward – do NOT go down the rabbit hole of trying to “fix” your browser’s CORS settings, that’s not it. Use Jared’s solution. :0)

The index.html they have us download now doesn’t have that section at all (and only has one index.html and we have to download it and another file separately to add to the js SDK generated download; seems that putting all files into one spot and with ALL pieces in place would be, well, nice, eh?).

Anyhoot, adding that section in and filling in the correct appId and appKey does the trick.

2 Likes

again still not working for me.

this is the last mission i have before unlock. anyone wanna remote desktop me and show me exactly what it is im doing wrong?

Uncaught ReferenceError: Backendless is not defined
at index.html:22
index.html:1 Access to XMLHttpRequest at ‘https://api.backendless.com///services/CodelessShoppingCartService/getInstructions’ from origin ‘null’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
api.backendless.com///services/CodelessShoppingCartService/getInstructions:1 Failed to load resource: net::ERR_FAILED
backendless.min.js:15 Uncaught (in promise) Error: Network Error
at XMLHttpRequest.i.onerror (backendless.min.js:15)

@John_Brown , do you have this line of code in your program: ?