Medusa – это проект с открытым исходным кодом, который предоставляет множество мощных функций и расширений для электронной коммерции, как Shopify. Я прочитал статью о многопрофильных торговых площадках от Shahed Nasser, который является выдающимся инженером в сообществе Medusa Dev. Но она показывает только модификацию бэкенда с помощью medusa-extender, не включая изменение фронтенда.
Поэтому я начал пытаться понять, как изменить часть фронтенда магазина, но сначала нам нужно настроить оригинальные API для всех продавцов.
Во-первых, следуя всем шагам из статьи для мультивендорных маркетплейсов.
Во-вторых, добавьте файл store.router.ts, как показано ниже. В нем я доработал клиентский API ‘/store/products’ для всех продавцов.
import { MedusaAuthenticatedRequest, Router } from 'medusa-extender';
import { Response, NextFunction } from "express";
import { User } from '../../user/entities/user.entity';
@Router({
routes: [{
requiredAuth: false,
path: '/store/products',
method: 'get',
handlers: [
async (req: MedusaAuthenticatedRequest, res: Response, next: NextFunction): Promise<Response<User[]>> => {
const productService = req.scope.resolve("productService")
const resProducts = await productService.list({},
{
relations: [
"variants",
"variants.prices",
"variants.options",
"options",
"options.values",
"images",
"tags",
"collection",
"type",
],
});
return res.send({
"products": resProducts,
"count": resProducts.length,
"offset": 0,
"limit": 100
});
}
]
}]
})
export class StoreRouter {}
Затем добавьте StoreRouter в ваш store.module.ts
@Module({
imports: [Store, StoreRepository, StoreService, StoreRouter],
})
Простой способ пропустить условие loggedInUser в product.service.ts, тогда список товаров будет изменен на запрос для всех продавцов. Это выглядит как хитрость, но я не нашел других вариантов, чтобы сделать мульти-продавцов работоспособными.
prepareListQuery_(selector: object, config: object): object {
/*const loggedInUser = this.container.loggedInUser
if (loggedInUser) {
selector['store_id'] = loggedInUser.store_id // this is for one store
}*/
return super.prepareListQuery_(selector, config);
}
Пересоберите и запустите бэкенд в локальной среде. Попробуйте создать нового поставщика с помощью postman.
Авторизуйтесь в этом поставщике, затем создайте новый продукт.
В итоге все клиенты могут запрашивать все продукты, включая новый продукт, созданный новым поставщиком, даже если клиент еще не вошел в систему.
Самая сложная часть – это модификация фронтенда магазина. Я использую Medusa Gatsby Starter для фронтенда своего магазина. Однако, есть много несовместимого с моей вышеуказанной модификацией бэкенда.
Когда я развернул все модификации в производственной среде, фронтенд магазина также перестроился. Но он показывает ошибку, как показано ниже:
Наконец, я обнаружил, что функция create node (во время сборки) из gatsby-source-filesystem gatsby не поддерживает передачу пустого адреса ссылки миниатюры товара. Вы должны передать ему действительный url.
Я вручную обновил его до изображений imgur, которые я создал в предыдущем посте в postgresql с помощью инструмента pgweb, после чего он успешно перестроился. Но это не последняя задача. Я все еще обнаружил ошибку в gatsby-starter-medusa, если у продукта нет загруженных изображений.
Поэтому нам нужно добавить следующее условие, чтобы предотвратить эту ошибку.
Я думаю, что неэффективно отлаживать одновременно оба проекта с открытым исходным кодом, gatsby и medusa. Но я буду продолжать бороться с открытыми исходниками:)