Oberlo

Before touching FlutterFlow or Firebase, it is worth spending five minutes understanding what you are actually building against. Oberlo had its own API that let third-party apps interact with the dropshipping workflow. That API no longer exists. The only legitimate way to get dropshipping data programmatically in 2026 is through Shopify's own APIs, with DSers as the sourcing layer running inside Shopify. Here is how the layers stack: DSers sits in your Shopify admin as an installed app. You use DSers (via browser at app.dsers.com or the Shopify admin) to search AliExpress, import products into Shopify, and send orders to AliExpress suppliers for fulfillment. DSers writes product and order data directly into your Shopify store's database. Your FlutterFlow app then reads that data through the Shopify Admin API — it sees the same products and orders that DSers created. FlutterFlow cannot talk to DSers directly because DSers does not expose a public third-party API. It is a Shopify-embedded tool. This is actually fine for most use cases: the data you care about (products, orders, fulfillment status, tracking numbers) all lives in Shopify's data model and is accessible via the Admin API. The Admin API also supports write operations — you can update order notes, toggle product status, and trigger fulfillment requests. If you need to automate the actual AliExpress order placement (telling suppliers to ship a product), that is currently only possible through the DSers browser interface or a Shopify Flow automation — it cannot be triggered from FlutterFlow in 2026. Keep your FlutterFlow scope focused on reading and displaying data, with write operations limited to order management tasks the Admin API supports directly.

To call the Shopify Admin API from outside the Shopify admin (which is what your Cloud Function will do), you need a custom app installed in your Shopify store. Open your Shopify admin in a browser (yourstore.myshopify.com/admin). Click 'Settings' in the bottom-left corner, then click 'Apps and sales channels'. At the top-right click 'Develop apps', then 'Allow custom app development' if this is your first time. Then click 'Create an app', give it a name like 'FlutterFlow Dashboard', and click 'Create app'. Once the app is created, click 'Configure Admin API scopes'. For a read-only dashboard, select: read_products, read_orders, read_customers, read_inventory. If you also need to update orders (for example, adding tracking notes or changing fulfillment status), add write_orders as well. Click 'Save'. Then click 'Install app' and confirm the installation. After installation, go to the 'API credentials' tab of your custom app. You will see an 'Admin API access token' that starts with shpat_. This is shown only once — copy it immediately and store it in a password manager. This token grants access to your entire Shopify store's admin data and must be treated like a master password. Do NOT paste it into FlutterFlow. It goes into the Cloud Function environment in the next step. Note the API version shown on the page as well (for example '2024-04'). You will use this version in the Admin API base URL.

Open the Firebase console and navigate to your project. Click 'Functions' in the left sidebar (upgrade to Blaze plan if prompted — outbound HTTP calls require a paid plan, though costs are typically under a few dollars per month at the traffic levels of a small dropshipping app). Click 'Create function' or 'Write in inline editor'. Name the function 'shopifyProxy'. Set the runtime to Node.js 18 or later. In the 'Runtime, build and connections settings' section, expand 'Runtime environment variables' and add three entries: SHOPIFY_STORE (your myshopify.com subdomain, for example 'myshop'), SHOPIFY_TOKEN (the shpat_ token from Step 2), and SHOPIFY_API_VERSION (for example '2024-04'). Paste the proxy code shown in the code block below into the inline editor. This function accepts a 'resource' query parameter from FlutterFlow (values like 'products', 'orders', 'customers'), builds the Shopify Admin API URL, and forwards the request with the token in the X-Shopify-Access-Token header. It also handles CORS for FlutterFlow web builds. Deploy the function. Copy the trigger URL from the Firebase console once deployment completes — it will look like https://us-central1-yourproject.cloudfunctions.net/shopifyProxy.

1const functions = require('firebase-functions');
2const https = require('https');
3
4exports.shopifyProxy = functions.https.onRequest(async (req, res) => {
5  // CORS for FlutterFlow web builds
6  res.set('Access-Control-Allow-Origin', '*');
7  if (req.method === 'OPTIONS') {
8    res.set('Access-Control-Allow-Methods', 'GET, PATCH');
9    res.set('Access-Control-Allow-Headers', 'Content-Type');
10    return res.status(204).send('');
11  }
12
13  const STORE = process.env.SHOPIFY_STORE;
14  const TOKEN = process.env.SHOPIFY_TOKEN;
15  const VERSION = process.env.SHOPIFY_API_VERSION || '2024-04';
16
17  // Resource is passed as a query param from FlutterFlow
18  // e.g. ?resource=products&limit=20&status=any
19  const resource = req.query.resource || 'products';
20  const limit = req.query.limit || '50';
21  const status = req.query.status || '';
22
23  let shopifyUrl =
24    `https://${STORE}.myshopify.com/admin/api/${VERSION}/${resource}.json?limit=${limit}`;
25
26  if (status) {
27    shopifyUrl += `&status=${status}`;
28  }
29
30  try {
31    const response = await fetch(shopifyUrl, {
32      method: 'GET',
33      headers: {
34        'X-Shopify-Access-Token': TOKEN,
35        'Content-Type': 'application/json'
36      }
37    });
38
39    if (!response.ok) {
40      const errText = await response.text();
41      console.error('Shopify error:', response.status, errText);
42      return res.status(response.status).json({ error: errText });
43    }
44
45    const data = await response.json();
46    return res.status(200).json(data);
47  } catch (err) {
48    console.error('Proxy error:', err);
49    return res.status(500).json({ error: 'Proxy request failed' });
50  }
51});

With the proxy running, open your FlutterFlow project and click 'API Calls' in the left navigation panel. Click '+ Add' and choose 'Create API Group'. Name it 'ShopifyProxy'. In the 'Base URL' field, paste your Cloud Function trigger URL (everything up to and including /shopifyProxy). Leave headers empty at the group level — authentication is handled by the Cloud Function. Add your first API Call: click '+ Add API Call' inside the ShopifyProxy group. Name it 'GetProducts'. Set the method to GET. In the Variables tab, add two variables: 'limit' (String, test value '20') and 'status' (String, test value 'active'). In the URL suffix field add: ?resource=products&limit={{limit}}&status={{status}}. Click 'Response & Test', fill in the test variables, and run the test. You should see a JSON object with a top-level key 'products' containing an array. Click 'Generate JSON Paths from Response'. The key paths to extract are: - $.products[*].id - $.products[*].title - $.products[*].status - $.products[*].images[0].src - $.products[*].variants[0].inventory_quantity - $.products[*].variants[0].price Repeat the process to add a second API Call named 'GetOrders'. Variables: 'limit' (String), 'status' (String, test value 'open'). URL suffix: ?resource=orders&limit={{limit}}&status={{status}}. Key JSON Paths: - $.orders[*].id - $.orders[*].name - $.orders[*].financial_status - $.orders[*].fulfillment_status - $.orders[*].total_price - $.orders[*].customer.first_name - $.orders[*].customer.last_name Save both API Calls.

Create the main dashboard screen in FlutterFlow. Add a TabBar widget at the top with two tabs: 'Products' and 'Orders'. This gives users a clean way to switch between the two data sources without rebuilding the whole screen. In the Products tab, add a ListView widget. Set its data source to Backend Query → API Call → ShopifyProxy GetProducts. Pass 'active' as the status variable and '50' as the limit. Inside the ListView, drop a Card widget with: an Image widget bound to the $.products[*].images[0].src JSON Path, a Text widget for the title, a Text widget for the price, a Badge or Chip widget showing the status (active/draft), and a Text widget showing inventory_quantity with a label 'In Stock'. In the Orders tab, add another ListView with data source ShopifyProxy GetOrders. Pass 'any' as the status variable. Inside this ListView, use a Card with: a Text for the order name (e.g. '#1042'), a Text for the customer name (concatenate first_name and last_name), a Text for total_price, and a Chip showing fulfillment_status with conditional color (green for 'fulfilled', orange for 'partial', red for null/unfulfilled). For the Products tab, add a filter row above the ListView with three buttons: 'Active', 'Draft', 'All'. Wire each button to update an AppState variable 'productFilter' (String) and rebuild the ListView with the new status value. This lets the store owner quickly switch between viewing active and draft products without navigating to a new screen. To navigate to an order detail page, make each Order card tappable. On tap, navigate to a new 'OrderDetail' screen and pass the order ID as a page parameter. On that screen, call GetOrders with a specific order ID filter, or store the selected order object in AppState for display without an additional API call.