Error during vue-storefront build in production mode

[oxcid]

Hi,

I've followed your guide to install vue-storefront. I've also included the files in this link before building it:

https://github.com/cristian-g/vue-storefront/compare/5c3f4aa2f827b4910248f4a666b24e93ba5d5248...develop

Then I got this error:

Can you tell me if I've made a mistake during the installation steps?

As an addition, after this error, I tried to continue the installation until the end (starting vue-storefront and vue-storefront-api) and installing the module for Odoo, but I still get 502 at the designated domain. Do I also need to do Data Import for Odoo? I was under the impression that Data Import only needed for Magento?

I'm currently using Odoo 12 Community Edition, and I followed your guide for Production Setup here:

https://github.com/DivanteLtd/vue-storefront/blob/master/docs/guide/installation/production-setup.md

Thanks in advance.

[cristian-g]

Hi, First of all, you don't need to install the vue-storefront-api since the idea with my module is to use Odoo as the backend system. Regarding your compilation issue, it seems that you copied my SearchAdapter on a Vue Storefront version which contains some changes (probably it's a newer one, isn't it?). Please avoid to copy files accross different versions, you can either use my https://github.com/cristian-g/vue-storefront for the deployment (following the production setup) or if you want to use the official and updated VSF repo, try to apply this change https://github.com/cristian-g/vue-storefront/commit/200a8f21819eff6da6d0868e6b13d9d21ae72954 and let me know if it works.

[oxcid]

Hi Cristian,

Wow, it works! I used your repo https://github.com/cristian-g/vue-storefront and directly install, build and start, using local.json as the config file. But it seems it's loading the demo data from Magento? I'm a bit lost here, can you please show me how to synchronize this with my Odoo data? Or if there's a doc somewhere I can follow?

My Odoo installation is currently running on a different VPS, using sampledomain.com as the domain, while the vue-storefront is using store.sampledomain.com domain. I probably got this part wrong, does both Odoo and vue-storefront need to be on the same VPS?

Thanks.

[oxcid]

Hi Cristian,

Just to add, if indeed both Odoo and vue-storefront need to be on the same VPS, is there a way to connect them if they're located on different VPS? Maybe through private network?

Thanks.

[cristian-g]

Hi, Regarding the data, you don't need any synchronization since the one and only backend you should be using is Odoo. With my module, the idea is that VSF directly queries Odoo. In your local.json config file, just change localhost:8080 with localhost:8069 because 8069 is the port where you probably have Odoo installed. Regarding your question about the VPS, Odoo and VSF can be on different VPS. They can even work with different domains or subdomains. For instance, if you take a look at https://github.com/cristian-g/vsf-odoo/blob/master/controllers/main.py, you'll see some endpoints with the OPTIONS method (methods=['OPTIONS']). They return the header 'Access-Control-Allow-Origin', '*' so that the front-end (VSF) is informed that it can perform requests to Odoo on a different domain or subdomain.

[oxcid]

Hi Cristian,

You mentioned changing localhost:8080 to localhost:8069 in local.json, I assume it's a typo? Did you mean in the Nginx sites-available config file?

Here's my Nginx site-available config file:

server {
    listen 80;
    server_name store.mydomain.com; 
        include snippets/letsencrypt.conf;
    return 301 https://store.mydomain.com$request_uri;
}

server {
    listen 443 ssl;
    server_name store.mydomain.com http2;
        include snippets/letsencrypt.conf;

    ssl on;

    ssl_certificate /etc/letsencrypt/live/store.mydomain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/store.mydomain.com/privkey.pem;

    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;   
    ssl_ciphers ECDHE-RSA-AES256-GCM-SHA512:DHE-RSA-AES256-GCM-SHA512:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:DHE-RSA-AES256-SHA;
    ssl_ecdh_curve secp384r1;
    ssl_session_timeout 10m;
    ssl_session_cache shared:SSL:10m;
    ssl_session_tickets off;
    ssl_stapling on;
    ssl_stapling_verify on;
    resolver 8.8.8.8 8.8.4.4 valid=300s;
    resolver_timeout 5s; 

    ssl_dhparam /etc/ssl/certs/dhparam.pem;

    add_header Strict-Transport-Security "max-age=31536000" always;
    add_header X-Frame-Options DENY;
    add_header X-Content-Type-Options nosniff;
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Robots-Tag none; 

    gzip on;
    gzip_proxied any;
    gzip_types
        text/css
        text/javascript
        text/xml
        application/javascript
        application/json
        text/json
        text/html;

    location / {
        proxy_pass http://localhost:3000/;
    }

    location /assets/ {
        proxy_pass http://localhost:3000/assets/;
    }

    location /api/ {
        proxy_pass http://(private-network-ip):8069/api/;
    }

    location /img/ {
        proxy_pass http://(private-network-ip):8069/img/;
    }
}

With this config, I managed to connect between 2 VPS through private network. I tested using firewall rule, only when I allowed 8069 through eth1 in Odoo VPS, then the vue storefront is displayed, otherwise it's going to show blank page. Now the problem is, it's still not displaying Odoo's products. When I open the store.mydomain.com, I got this error in the console:

Unhandled promise rejection Error with response - bad content-type! (es6.promise.js:110)

I've also deactivated demomode in local.json. In case you need to see my local.json:

{
    "elasticsearch": {
        "httpAuth": "",
        "host": "https://store.mydomain.com/api/catalog",
        "index": "vue_storefront_catalog"
    },
    "storeViews": {
        "mapStoreUrlsFor": [
            "de",
            "it"
        ],
        "multistore": true,
        "de": {
            "disabled": false,
            "elasticsearch": {
                "httpAuth": "",
                "host": "https://store.mydomain.com/api/catalog",
                "index": "vue_storefront_catalog_de"
            }
        },
        "it": {
            "disabled": false,
            "elasticsearch": {
                "httpAuth": "",
                "host": "https://store.mydomain.com/api/catalog",
                "index": "vue_storefront_catalog_it"
            }
        }
    },
    "cart": {
        "synchronize": true,
        "synchronize_totals": true,
        "create_endpoint": "https://store.mydomain.com/api/cart/create?token={{token}}",
        "updateitem_endpoint": "https://store.mydomain.com/api/cart/update?token={{token}}&cartId={{cartId}}",
        "deleteitem_endpoint": "https://store.mydomain.com/api/cart/delete?token={{token}}&cartId={{cartId}}",
        "pull_endpoint": "https://store.mydomain.com/api/cart/pull?token={{token}}&cartId={{cartId}}",
        "totals_endpoint": "https://store.mydomain.com/api/cart/totals?token={{token}}&cartId={{cartId}}",
        "paymentmethods_endpoint": "https://store.mydomain.com/api/cart/payment-methods?token={{token}}&cartId={{cartId}}",
        "shippingmethods_endpoint": "https://store.mydomain.com/api/cart/shipping-methods?token={{token}}&cartId={{cartId}}",
        "shippinginfo_endpoint": "https://store.mydomain.com/api/cart/shipping-information?token={{token}}&cartId={{cartId}}",
        "collecttotals_endpoint": "https://store.mydomain.com/api/cart/collect-totals?token={{token}}&cartId={{cartId}}",
        "deletecoupon_endpoint": "https://store.mydomain.com/api/cart/delete-coupon?token={{token}}&cartId={{cartId}}",
        "applycoupon_endpoint": "https://store.mydomain.com/api/cart/apply-coupon?token={{token}}&cartId={{cartId}}&coupon={{coupon}}"
    },
    "products": {
        "preventConfigurableChildrenDirectAccess": true,
        "alwaysSyncPlatformPricesOver": true,
        "clearPricesBeforePlatformSync": true,
        "waitForPlatformSync": false,
        "endpoint": "https://store.mydomain.com/api/product",
        "defaultFilters": [
            "color",
            "size",
            "price"
        ]
    },
    "orders": {
        "endpoint": "https://store.mydomain.com/api/order"
    },
    "images": {
        "baseUrl": "https://store.mydomain.com/img/"
    },
    "users": {
        "endpoint": "https://store.mydomain.com/api/user",
        "history_endpoint": "https://store.mydomain.com/api/user/order-history?token={{token}}",
        "resetPassword_endpoint": "https://store.mydomain.com/api/user/reset-password",
        "changePassword_endpoint": "https://store.mydomain.com/api/user/change-password?token={{token}}",
        "login_endpoint": "https://store.mydomain.com/api/user/login",
        "create_endpoint": "https://store.mydomain.com/api/user/create",
        "me_endpoint": "https://store.mydomain.com/api/user/me?token={{token}}",
        "refresh_endpoint": "https://store.mydomain.com/api/user/refresh"
    },
    "stock": {
        "endpoint": "https://store.mydomain.com/api/stock"
    },
    "tax": {
        "defaultCountry": "PL",
        "defaultRegion": "",
        "calculateServerSide": true
    },
    "i18n": {
        "defaultCountry": "US",
        "defaultLanguage": "EN"
    },
    "mailchimp": {
        "endpoint": "https://store.mydomain.com/api/ext/mailchimp-subscribe/subscribe"
    },
    "registeredExtensions": [
        "custom_extension",
        "mailchimp-subscribe",
        "google-analytics"
    ],
    "demomode": false,
    "analytics": {
        "id": "UA-108235765-2"
    }
}

I have a feeling I might need to do something in my Odoo VPS? Is there a way to see if Odoo API is indeed running in my Odoo VPS? Because when I tried to open mydomain.com/api/, it only gives me 404 error. Is it the expected behavior?

Thanks.

[cristian-g]

Hello @oxcid

First of all, sorry for inactivity. I was out some days and I accumulated pending work.

On my last comment, I mentioned port 8069 since it is the default port for Odoo. How is your local Odoo installation configured? How do you access to the Odoo website? Are you using the default http://localhost:8069, right? VSF needs to connect directly to Odoo port 8069 if you are not using ElasticSearch (I don't use it).

Then, for instance, this route should work for retrieving a JSON list of products (just visit it by using your web browser, it should work since it is a GET request): http://localhost-or-your-domain:8069/api/catalog/vue_storefront_catalog/product/_search?_source_exclude=description%2Csgn%2C%2A.sgn%2Cmsrp_display_actual_price_type%2C%2A.msrp_display_actual_price_type%2Crequired_options&_source_include=type_id%2Csku%2Cname%2Ctax_class_id%2Cspecial_price%2Cspecial_to_date%2Cspecial_from_date%2Cprice%2CpriceInclTax%2CoriginalPriceInclTax%2CoriginalPrice%2CspecialPriceInclTax%2Cid%2Cimage%2Csale%2Cnew%2Cconfigurable_children.image%2Cconfigurable_children.sku%2Cconfigurable_children.price%2Cconfigurable_children.special_price%2Cconfigurable_children.priceInclTax%2Cconfigurable_children.specialPriceInclTax%2Cconfigurable_children.originalPrice%2Cconfigurable_children.originalPriceInclTax%2Cconfigurable_children.color%2Cconfigurable_children.size%2Cconfigurable_children.id%2Cconfigurable_children.tier_prices%2Cproduct_links%2Curl_path%2Curl_key%2Cstatus%2Ctier_prices&from=0&size=50&sort=updated_at%3Adesc

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.