Error opening application in production

[isaacgz]

Hi

I used the template with Vue to create my app, but I have the following problem when deploying to production:

1.- The app couldn't be loaded:

2.- When I try to open the application I get the following error:

I am deploying my application via PM2 on my own server, so I don't know if this is a factor in the error. I look forward to your comments.

[Mini-Sylar]

Hi, can you share some of the logs from PM2?

[isaacgz]

Sure:

I don't know why when I install the application, the log runs several times

[Mini-Sylar]

That bit is expected, on initial load it performs a few oAuth connections

it seems to fail after a while, someone recently had that issue but that was on dev.

can you confirm the dependencies in the root package.json? I might be able to recreate it

[isaacgz]

Look, this is the package I have in the root

[Mini-Sylar]

Alright let's do the following,

• Remove @shopify/shopify-api if you're not using it
• Update your redirect URLs on the shopify partners dashboard
• Run npm run shopify app deploy to push the new changes
• Kill all existing pm2 processes
• Start PM2 again

the redirect URLs must be set properly

let me know if the issue gets resolved

[isaacgz]

Hi, I did everything as you mentioned and nothing works, I still have the same error

[Mini-Sylar]

Hi, Can you try the following :

//index.js

const addSessionShopToReqParams = (req, res, next) => {
  const shop = res.locals?.shopify?.session?.shop;
  if (shop && !req.query.shop) {
    req.query.shop = shop;
  }
  console.log("SHOP:", shop, req.query.shop);
  return next();
};

app.use("/api/*", shopify.validateAuthenticatedSession());
// Middleware should come after
app.use("/*", addSessionShopToReqParams);

[isaacgz]

Thanks for answering, mmm no, I had already tried it before and it still shows me the same error,
I even have the code like this:

but nothing work's, here we have a video with the error: https://screenshot.click/05-57-31754-74340.webm

[isaacgz]

Another detail is the following: the sessions are not saved in the SQLite database even if the application has been installed in the store. Is there a problem with PM2 and SQLite?

[Mini-Sylar]

Thanks for answering, mmm no, I had already tried it before and it still shows me the same error, I even have the code like this:

but nothing work's, here we have a video with the error: https://screenshot.click/05-57-31754-74340.webm

Interesting, It seems your app is working

the issue might be with the root shopify.app.toml

Can you show me what that looks like? Be sure to hide sensitive information such as the client_id

[Mini-Sylar]

Another detail is the following: the sessions are not saved in the SQLite database even if the application has been installed in the store. Is there a problem with PM2 and SQLite?

Also out of curiosity, how are you running the app?

[isaacgz]

in my own server, is a windows server

[Mini-Sylar]

RE:
Interesting, It seems your app is working

the issue might be with the scopes in the root shopify.app.toml

Can you show me what that looks like? Be sure to hide sensitive information such as the client_id

[isaacgz]

yeap:

[Mini-Sylar]

Alright, so a few things you need to setup before running the app in production

Step 1

• Fill in the client ID which you can get from the partners.shopify dashboard
• Fill in application url, should be YOUR domain or subdomain connected to the server, e.g https://minisylar.com or https://subdomain.minisylar.com

Step 2

In the shopify.app.toml:

[access_scopes]
# Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes
scopes = "read_customers,read_orders" # Add the access scopes you need !very important
use_legacy_install_flow = true #You may OMIT THIS

Step 3 Very Very Important

• Set your redirect URLS

[auth]
redirect_urls = [
  "https://minisylar.com/auth/callback",
  "https://minisylar.com/auth/shopify/callback",
  "https://minisylar.com/api/auth/callback"
]

Step 4 Push the changes

• run npm run shopify app deploy and push your changes
• Confirm these changes from your partners dashboard, login to partners dashboard - > apps ->configuration

Step 5 (Since you're on a VPS) - I've only used linux so windows setup may vary

• run shopify app env show and find your envs, create a .env in the root of your app and place all the necessary info there
• cd into web and using pm2 you can do the following pm2 start npm --name "shopify-app" -- run serve -- --env production

As always let me know if there are any issues, in order to not conflict the toml files
you can create shopify.app.diversified-deal-app.toml for example and use the dev urls