Custom Session Storage

[muhammad-hunnain786]

As Now The Shopify App Template Updated, I want to know how can i create custom session storage

its very clear that i cannot do it like old ways because now its not getting Shopify.Session.CustomSessionStorage

so i cannot use the below code

sessionStorage: new Shopify.Session.CustomSessionStorage( storeCallback, loadCallback, deleteCallback ),

can anyone help me in this ???

[mkevinosullivan]

See the implementing session storage guide.

Using the example in that guide, you would import your custom session storage (e.g., CsvSessionStorage) and attach it to your API configuration using

  sessionStorage: new CsvSessionStorage(),

[muhammad-hunnain786]

yeah i tried that

but iam receiving an error on SessionStorage from @shopify/shopify-app-session-storage

i tried

import {SessionStorage} from '@shopify/shopify-app-session-storage';

and

import SessionStorage from '@shopify/shopify-app-session-storage';

one gives undefined and another gives empty object {}

can you help me in this ???

[mkevinosullivan]

Have you added the @shopify/shopify-app-session-storage package to the project that's implementing your custom session storage? Are you creating your custom session storage in a separate library or included in the source of your app?

What versions of @shopify/shopify-api, @shopify/shopify-app-session-storage are you developing with?

[muhammad-hunnain786]

yes

i have installed that package

iam working on latest app template which is on @shopify/shopify-app-express version 1.1.0 and the version of @shopify/shopify-app-session-storage is 1.0.2

[mkevinosullivan]

The correct import statement is

import {SessionStorage} from '@shopify/shopify-app-session-storage';

What's the exact error you are receiving?

[muhammad-hunnain786]

yes

its giving error of es6

like syntax error SessionStorage is not found at .....

CommonJs Module etc

[mkevinosullivan]

I don't understand what that last message is supposed to mean ...

1. Does the error occur when you run the app?
2. What's the output from the node command while running ... please paste the error from the console

[fotimo]

@mkevinosullivan

I unfortunately run into the same problem at the new shopify cli3. When I add your code to my .js file customSessionNewCli3.js I run into the error below.

import {Session} from '@shopify/shopify-api';
import {SessionStorage} from '@shopify/shopify-app-session-storage';

export class CustomSessionStorage extends SessionStorage {
...
}

If the following error occurs.

is there a way to create an analog javascript class with the import {SessionStorage} from '@shopify/shopify-app-session-storage'; which i can then use?

import {CustomSessionStorage} from "./customSessionNewCli3.js";

const shopify = shopifyApp({
  api: {
    apiKey: process.env.SHOPIFY_API_KEY,
    apiSecretKey: process.env.SHOPIFY_API_SECRET,
    hostName: process.env.HOST.replace(/https?:\/\//, ''),
    hostScheme: 'https',
    apiVersion: LATEST_API_VERSION,
    restResources,
    billing: billingConfigSubscriptionPayment, // or replace with billingConfig above to enable example billing
    scopes: process.env.SCOPES.split(","), //process.env.SCOPES.split(",")
    isEmbeddedApp: true,
  },
  auth: {
    path: "/api/auth",
    callbackPath: "/api/auth/callback",
  },
  webhooks: {
    path: "/api/webhooks",
  },
  useOnlineTokens: false, // declare offline session token
  // This should be replaced with your preferred storage strategy
  sessionStorage: new CustomSessionStorage,
}); 

I hope you understand what I mean. Thank you for your help.

[meandillar]

@fotimo @muhammad-hunnain786

I was also struggling with how to implement CustomSessionStorage. I adapted the guide that @mkevinosullivan linked to. If you're not using typescript you don't need to use the implements keyword, and you also don't need to extend the SessionStorage class from Shopify. Simply define your class and it's methods - something like:

export class CustomSessionStorage {
  async storeSession(session) {...}

  async loadSession(id) {...}

  async deleteSession(id) {...}

  async deleteSessions(ids) {...}

  async findSessionsByShop(shop) {...}
}

The shopify guide linked to above gives all the return values needed for the class methods. Create an instance when you initialise your shopify config like:

sessionStorage: new CustomSessionStorage()

[mkevinosullivan]

@meandillar Thanks for your reply - yes, the guide is in TypeScript and needs to be converted to JavaScript for JS-based applications.

[joantune]

orrr - @mkevinosullivan - provide a template in Typescript:) (I know - its' a big task - meanwhile - if one could solve the code navigation when one installs the package and be able to see the source code easily and navigate on it - that would be a great help)

one thing that bugs me - if the shopify store domain is already on the JWT token - why do we need to store sessions at all?:)

can't we just validate the token and use that? that would be sooo much better and leaner - and everything:)

[joantune]

See the implementing session storage guide.

Using the example in that guide, you would import your custom session storage (e.g., CsvSessionStorage) and attach it to your API configuration using

  sessionStorage: new CsvSessionStorage(),

it would be great if this file has a link or a table with the fields of a session - link to the type definition would suffice

[pkyek1]

that means that we cant use import {SessionStorage} from '@shopify/shopify-app-session-storage'; in JS based projects because its in type script

thats bad

because when we implement custom session like this

export class CustomSessionStorage { async storeSession(session) {...}

async loadSession(id) {...}

async deleteSession(id) {...}

async deleteSessions(ids) {...}

async findSessionsByShop(shop) {...} }

it does not have isActive function there

espacially its required in the new shopify app remix template

[meandillar]

@pkyek1 if you create a custom implementation there is nothing stopping you from adding an "isActive" function, or any other function for that matter