У меня проблема с выяснением способа отображения html в админке приложения.
Я следовал учебнику 'Создание приложения Shopify с Node and Express' и могу отобразить json магазина в Администраторе приложения Shopify. Тем не менее, я не понимаю следующие шаги для получения любого HTML для отображения в приложении администратора. Я попытался заменить end(shopResponse) методом рендеринга, который выдает ошибку «происхождение запроса не может быть проверено». Я также попытался настроить дополнительный запрос, но это вызвало похожую ошибку.
app.get('/shopify', (req, res) => {
const shop = req.query.shop;
if (shop) {
const state = nonce();
const redirectUri = forwardingAddress + '/shopify/callback';
const installUrl = 'https://' + shop +
'/admin/oauth/authorize?client_id=' + apiKey +
'&scope=' + scopes +
'&state=' + state +
'&redirect_uri=' + redirectUri;
res.cookie('state', state);
res.redirect(installUrl);
} else {
return res.status(400).send('Missing shop parameter. Please add ?shop=your-development-shop.myshopify.com to your request');
}
});
app.get('/shopify/callback', (req, res) => {
const { shop, hmac, code, state } = req.query;
console.log(req.headers)
var stateCookie = '';
if (req.headers.cookie) {
stateCookie = cookie.parse(req.headers.cookie).state;
}
if (state !== stateCookie) {
return res.status(403).send('Request origin cannot be verified');
}
if (shop && hmac && code) {
const map = Object.assign({}, req.query);
delete map['signature'];
delete map['hmac'];
const message = querystring.stringify(map);
const providedHmac = Buffer.from(hmac, 'utf-8');
const generatedHash = Buffer.from(
crypto
.createHmac('sha256', apiSecret)
.update(message)
.digest('hex'),
'utf-8'
);
let hashEquals = false;
// timingSafeEqual will prevent any timing attacks. Arguments must be buffers
try {
hashEquals = crypto.timingSafeEqual(generatedHash, providedHmac)
// timingSafeEqual will return an error if the input buffers are not the same length.
} catch (e) {
hashEquals = false;
};
if (!hashEquals) {
return res.status(400).send('HMAC validation failed');
}
const accessTokenRequestUrl = 'https://' + shop + '/admin/oauth/access_token';
const accessTokenPayload = {
client_id: apiKey,
client_secret: apiSecret,
code,
};
request.post(accessTokenRequestUrl, { json: accessTokenPayload })
.then((accessTokenResponse) => {
const accessToken = accessTokenResponse.access_token;
// DONE: Use access token to make API call to 'shop' endpoint
const shopRequestUrl = 'https://' + shop + '/admin/api/2019-04/themes.json';
const shopRequestHeaders = {
'X-Shopify-Access-Token': accessToken,
};
request.get(shopRequestUrl, { headers: shopRequestHeaders })
.then((shopResponse) => {
// This is what I have tried replacing with a render method
res.status(200).end(shopResponse);
})
.catch((error) => {
res.status(error.statusCode).send(error.error.error_description);
});
})
.catch((error) => {
res.status(error.statusCode).send(error.error.error_description);
});
} else {
res.status(400).send('Required parameters missing');
}
});
Я ожидаю, что смогу увидеть базовый html в администраторе приложения Shopify.
решаемые
После прочтения принятого ответа я понял, что мне не нужны все данные с самого начала, чтобы показать файл.
Мой маршрут из белого списка выглядел так:
app.get('/shopify/callback', (req, res) => {
res.render('pages/index')
});