Hello there dear community,
after a long time as an Shopify Shop User, I wanted to get into the development of Apps.
I followed the guide from shopify themselves.
This is my Code so far:
server.js
require('isomorphic-fetch');
const dotenv = require('dotenv');
const Koa = require('koa');
const next = require('next');
const { default: createShopifyAuth } = require('@shopify/koa-shopify-auth');
const { verifyRequest } = require('@shopify/koa-shopify-auth');
const session = require('koa-session');
dotenv.config();
const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
const { SHOPIFY_API_SECRET_KEY, SHOPIFY_API_KEY } = process.env;
app.prepare().then(() => {
const server = new Koa();
server.use(session({ secure: true, sameSite: 'none' }, server));
server.keys = [SHOPIFY_API_SECRET_KEY];
server.use(
createShopifyAuth({
apiKey: SHOPIFY_API_KEY,
secret: SHOPIFY_API_SECRET_KEY,
scopes: ['read_products'],
afterAuth(ctx) {
const { shop, accessToken } = ctx.session;
ctx.redirect('/');
},
}),
);
server.use(verifyRequest());
server.use(async (ctx) => {
await handle(ctx.req, ctx.res);
ctx.respond = false;
ctx.res.statusCode = 200;
return
});
server.listen(port, () => {
console.log(`> Ready on http://localhost:${port}`);
});
});
package.json
{
"name": "test-app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "node server.js",
"build": "next build",
"start": "NODE_ENV=production node server.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"@shopify/koa-shopify-auth": "^3.1.63",
"dotenv": "^8.2.0",
"isomorphic-fetch": "^2.2.1",
"koa": "^2.12.0",
"koa-session": "^6.0.0",
"next": "^9.4.4",
"react": "^16.13.1",
"react-dom": "^16.13.1"
}
}
When I try to install the test app on my test store I get an "Internal Server Error"
My Command Console output is as follows:
C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app>npm run dev
> test-app@1.0.0 dev C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app
> node server.js
event - compiled successfully
> Ready on http://localhost:3000
TypeError [ERR_INVALID_ARG_TYPE]: The "key" argument must be of type string or an instance of Buffer, TypedArray, DataView, or KeyObject. Received undefined
at prepareSecretKey (internal/crypto/keys.js:305:13)
at new Hmac (internal/crypto/hash.js:113:9)
at Object.createHmac (crypto.js:143:10)
at sign (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\keygrip\index.js:23:8)
at Keygrip.sign (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\keygrip\index.js:30:38)
at Cookies.set (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\cookies\index.js:110:30)
at topLevelOAuthRedirect (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\create-top-level-oauth-redirect.js:10:21)
at C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\index.js:60:46
at step (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:141:27)
at Object.next (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:122:57)
at C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:115:75
at new Promise (<anonymous>)
at Object.__awaiter (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:111:16)
at shopifyAuth (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\index.js:39:24)
at dispatch (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\koa\node_modules\koa-compose\index.js:42:32)
at session (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\koa-session\index.js:41:13)
TypeError [ERR_INVALID_ARG_TYPE]: The "key" argument must be of type string or an instance of Buffer, TypedArray, DataView, or KeyObject. Received undefined
at prepareSecretKey (internal/crypto/keys.js:305:13)
at new Hmac (internal/crypto/hash.js:113:9)
at Object.createHmac (crypto.js:143:10)
at sign (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\keygrip\index.js:23:8)
at Keygrip.sign (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\keygrip\index.js:30:38)
at Cookies.set (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\cookies\index.js:110:30)
at topLevelOAuthRedirect (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\create-top-level-oauth-redirect.js:10:21)
at C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\index.js:60:46
at step (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:141:27)
at Object.next (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:122:57)
at C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:115:75
at new Promise (<anonymous>)
at Object.__awaiter (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\tslib\tslib.js:111:16)
at shopifyAuth (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\@shopify\koa-shopify-auth\dist\src\auth\index.js:39:24)
at dispatch (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\koa\node_modules\koa-compose\index.js:42:32)
at session (C:\Users\Rojaki\Documents\CODING\Shopify-Apps\test-app\node_modules\koa-session\index.js:41:13)
This is my NGROK Output:
HTTP Requests
-------------
GET /auth 500 Internal Server Error
GET /favicon.ico 302 Found
GET /auth 500 Internal Server Error
GET /favicon.ico 502 Bad Gateway
GET /auth 502 Bad Gateway
GET /auth 500 Internal Server Error
GET /favicon.ico 302 Found
GET /auth 500 Internal Server Error
GET / 302 Found GET /auth 500 Internal Server Error
