I am building a post purchase extension and I want to send a request to my server so I created a proxy, the proxy is working when I try to access it in the browser.
I get into an issue when I try to use the proxy URL inside the extension.
Proxy config -
import { createVerifyAppProxyMiddleware } from 'shopify-verify-app-proxy-middleware';
const { SHOPIFY_API_SECRET } = process.env;
const verifyAppProxyMiddleware = createVerifyAppProxyMiddleware(SHOPIFY_API_SECRET);
app.use('/api/proxy/', verifyAppProxyMiddleware, proxyRoutes);
proxyRoutes -
import { Router } from 'express';
import { getAllFunnels } from '../controllers/funnel.controller';
const router = Router();
router.get('/funnels/get', getAllFunnels);
export default router;
App settings -
Post purchase extension -
// For local development, replace APP_URL with your local tunnel URL.
const APP_URL = 'https://something.trycloudflare.com';
extend('Checkout::PostPurchase::ShouldRender', async ({ inputData }) => {
try {
const response = await fetch(`${APP_URL}/apps/proxy-1`, {
method: 'GET',
headers: {
'Authorization': `Bearer ${inputData.token}`,
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': '*',
},
});
if (!response.ok) {
// Handle non-2xx responses
throw new Error(`HTTP error! status: ${response.status}`);
}
const x = await response.json();
console.log(x);
// For local development, always show the post-purchase page
return { render: true };
} catch (error) {
console.error('Failed to fetch funnels:', error);
// Decide how to handle the error, e.g., not rendering the post-purchase page
return { render: false };
}
});
shopify.extension.toml file -
type = "checkout_post_purchase"
name = "some-name"
[capabilities]
network_access = true
notice here is that I use [capabilities] and not [extensions.capabilities] like it says in the docs - link, when I try to use [extensions.capabilities] I got the following error when I tried to publish the extension -
[ │
│ { │
│ "code": "invalid_type", │
│ "expected": "array", │
│ "received": "object", │
│ "path": [ │
│ "extensions" │
│ ], │
│ "message": "Expected array, received object" │
│ } │
│ ]
so I tried to use just [capabilities] and it didn’t crash the publish but I have no idea how can I check if it’s working besides actually succeeding to access a network.
the response I get from the request in the extension -
