How could i make it works with https? Mixed content issue

[blackyzero]

What is your question / Please describe your issue

Hello,

I am following instruction here https://docs.vuestorefront.io/vendure/guide/getting-started.html and facing mixed content issue, and images can't load. From browser console, i can see a lot of mixed content error that is loading from "http://api-store.abc.com"

My .env contains:

GRAPHQL_API="https://api-store.abc.com/shop-api"
TOKEN_METHOD=bearer
CURRENCY=USD
LANG=en

How could i make it works with https? Thank you.

What version of vendure are you using?

1.6.2

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[Baroshem]

Hey @blackyzero

Could you check what paths your images has? I think we had similar issues that were caused by the fact that the vendure server was running on https but images where served on http

https://discord.com/channels/770285988244750366/835050009870991392/958068266734063697

https://www.vendure.io/docs/typescript-api/asset-server-plugin/asset-server-options/

[blackyzero]

thanks for those info. I couldn't access this discord channel. is it still available?

By the way, i also tried to change assetUrlPrefix in "store/node_modules/@vendure/asset-server-plugin/lib/src/types.d.ts"

    assetUrlPrefix?: string | ((ctx: RequestContext, identifier: string) => https://api-store.abc.com/assets/);

But still getting same issue. Am i correct to add domain like this ?

Thank you.

[Baroshem]

Hey @blackyzero

You can join here https://discord.vuestorefront.io/

Also, I think this issue is more related to the Vendure itself. @michaelbromley could you share some light here? 🙂

[blackyzero]

i got it works by adding into vendure-config.ts.

    plugins: [
        AssetServerPlugin.init({
            route: 'assets',
            assetUploadDir: path.join(__dirname, '../static/assets'),
            assetUrlPrefix: 'https://api-store.abc.com/assets/',
        }),

Maybe there is another way to to it, but i don't know.

[Baroshem]

I think this is the recommended way 🙂

[Baroshem]

I think I will make it a documenation page out of the configuration of https

[michaelbromley]

@blackyzero yep that's right - the assetUrlPrefix in the config object is the way to handle this.