shopOrigin: undefined on Cookies.get("shopOrigin")

[FrankoFM]

Followed this turorial: https://shopify.dev/tutorials/build-a-shopify-app-with-node-and-react/build-your-user-interface-with...

I'm setting the cookie in the server.js

ctx.cookies.set("shopOrigin", shop, {
    httpOnly: false,
    secure: true,
    sameSite: 'none'
});

But when I try go get it in the _app.js

const config = { apiKey: API_KEY, shopOrigin: Cookies.get("shopOrigin"), forceRedirect: true };

and I console.log the config I get

{
  apiKey: '***************************',
  shopOrigin: undefined,
  forceRedirect: true
}

So my question is: Why is the shopOrigin undefined?

[FrankoFM]

  server.use(
    createShopifyAuth({
      apiKey: SHOPIFY_API_KEY,
      secret: SHOPIFY_API_SECRET_KEY,
      scopes: ['read_products'],
      afterAuth(ctx) {
        const { shop, accessToken } = ctx.session;
        ctx.cookies.set('shopOrigin', shop, {
          httpOnly: false,
          secure: true,
          sameSite: 'none'
        });
        console.log("Test"); // Never gets called too
        ctx.redirect('/');
      },
    }),
  );

Just found out that "createShopifyAuth" never gets called. Why is that? 

Btw I'm not using ngrok im using a node https server with my public domain.

  https.createServer(httpsOptions, (req, res) => {
    handle(req, res);
  }).listen(port, (error) => {
    if (error) throw error;
    console.log('> Ready on https://localhost:' + port);
  });

[412Software]

I just had this issue myself, and it looks like `createShopifyAuth` only gets called on app installation. I didn't test extensively, but uninstalling and re-installing my app fixed the `undefined on Cookies.get("shopOrigin")` error I was getting.

[zoultrex]

I dont know if @FrankoFM and @412Software are the same person, it looks like, but this may help both of you.
You don't need to uninstall the app to authenticate again, you can do it in two ways.
You either go to the shop that has the app installed, (on apps menu on the left of your store admin) and then click on the name of the app, authenticate again.
Or you access the auth link directly: https://[yourNgrok].ngrok.io/auth?shop=[yourShop].myshopify.com

There is something interesting to notice about this process, which is getting the auth token back from this authentication process, specially if you have followed the Build your React+node app tutorial.
In that tutorial, it shows how to request a token that expires... it is recommended instead to request and store a token that will not expire by changing this part of the code

server.use(
    createShopifyAuth({
      apiKey: SHOPIFY_API_KEY,
      secret: SHOPIFY_API_SECRET_KEY,
      scopes: [your defined scopes...],
      accessMode: "offline", //<-------- add this

Visit this thread to know more about it

[diego_ezfy]

@zoultrex Thanks, it helped! I ought to say that I was not able to re-initiate the session simply by clicking on the app from the apps menu though, I did need to access the URL you mentioned.

Furthermore, I was having issues with sameSite cookies. This link helped me.

Edit:

Using exclusively this did not work for me: 

server.use(session({ secure: true, sameSite: "none" }, server));

Additionally I had to save the cookies like this:

        ctx.cookies.set("shopOrigin", shop, {
          httpOnly: false,
          secure: true,
          sameSite: "none",
        });