vuestorefront / vue-storefront

Alokai is a Frontend as a Service solution that simplifies composable commerce. It connects all the technologies needed to build and deploy fast & scalable ecommerce frontends. It guides merchants to deliver exceptional customer experiences quickly and easily.
https://www.alokai.com
MIT License
10.63k stars 2.08k forks source link

Making multistore feature to work #3016

Closed Murajima closed 5 years ago

Murajima commented 5 years ago

Prerequisites

Please answer the following questions for yourself before submitting an issue.

Is there something you don't understand? What is it? Describe it.

Hi, I am trying to implement my multistore setup with you vue-storefront PWA. I managed to pull all the data by store from magento 2.2 using mage2vs in subsequent elasticsearch index (which i verified by querying it this way http://localhost:9200/vue_storefront_catalog_bombardier/_search)

I added inside my local.json in vue-storefront the following lines:

 "defaultStoreCode": "",
  "storeViews": {
    "multistore": true,
    "commonCache": true,
    "mapStoreUrlsFor": [
      "aio",
      "bombardier",
      "cnh",
      "copelectronic",
      "faurecia",
      "imeguisa",
      "kubota",
      "laposte",
      "lectra",
      "mannhummel",
      "nidec",
      "psa",
      "renault",
      "safrannacelles",
      "thales",
      "toyota"
    ],
    "aio": {
      "storeCode": "aio",
      "disabled": false,
      "storeId": 3,
      "name": "AIO",
      "url": "/aio",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_aio"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },
    "bombardier": {
      "storeCode": "bombardier",
      "disabled": false,
      "storeId": 4,
      "name": "Bombardier",
      "url": "/bombardier",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_bombardier"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },
    "cnh": {
      "storeCode": "cnh",
      "disabled": false,
      "storeId": 5,
      "name": "CNH",
      "url": "/cnh",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_cnh"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },

and inside the vue-storefront-api, inside the local.json aswell the following lines:

  "availableStores": [
    "aio",
    "bombardier",
    "cnh",
    "copelectronic",
    "faurecia",
    "imeguisa",
    "kubota",
    "laposte",
    "lectra",
    "mannhummel",
    "nidec",
    "psa",
    "renault",
    "safrannacelles",
    "thales",
    "toyota"
  ],
  "storeViews": {
    "multistore": true,
    "mapStoreUrlsFor": [
      "aio",
      "bombardier",
      "cnh",
      "copelectronic",
      "faurecia",
      "imeguisa",
      "kubota",
      "laposte",
      "lectra",
      "mannhummel",
      "nidec",
      "psa",
      "renault",
      "safrannacelles",
      "thales",
      "toyota"
    ],
    "aio": {
      "storeCode": "aio",
      "disabled": false,
      "storeId": 3,
      "name": "AIO",
      "url": "/aio",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_aio"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },
    "bombardier": {
      "storeCode": "bombardier",
      "disabled": false,
      "storeId": 4,
      "name": "Bombardier",
      "url": "/bombardier",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_bombardier"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },
    "cnh": {
      "storeCode": "cnh",
      "disabled": false,
      "storeId": 5,
      "name": "CNH",
      "url": "/cnh",
      "elasticsearch": {
        "host": "localhost:8080/api/catalog",
        "index": "vue_storefront_catalog_cnh"
      },
      "tax": {
        "defaultCountry": "US",
        "defaultRegion": "",
        "calculateServerSide": true,
        "sourcePriceIncludesTax": false
      },
      "i18n": {
        "fullCountryName": "United States",
        "fullLanguageName": "English",
        "defaultLanguage": "US",
        "defaultCountry": "US",
        "defaultLocale": "en-US",
        "currencyCode": "EUR",
        "currencySign": "€",
        "dateFormat": "HH:mm D-M-YYYY"
      }
    },

I do see the LanguageSwitcher Modal at the bottom of my screen, but when i switch from any store, i do have no data inside my app. When i click, the url goes from localhost:3000 to localhost:3000/{storeCode} which seems fine to me. I also have the following error inside the network tab (see the attached screenshot)

Capture d’écran 2019-06-04 à 16 59 29

I really don't know what i am missing here

Murajima commented 5 years ago

My bad, it seems that we have to write http://localhost:8080/api/catalog inside the host key.