With our shop, we are going to be loading in a CSV of products on page load. This will simulate gathering stock and product data from a database or API from a point-of-sale system, something online shops with a physical shop might have to deal with.
In a similar way to our Dropbox app earlier in the book, we will be loading external data and saving it into the Vuex store. The issue we will face, however, is when loading a resource via JavaScript; the browsers demand the protocol for the file being requested is via HTTP, HTTPS, or is a CORS request.
This means that we are unable to load a local file using the fetch() technique we used with the Dropbox API as, when viewing our app in the browser, we are loading local assets over the file:// protocol.
We can resolve this issue in a few different ways – which one you choose depends on your circumstance. We are...