React+Node.js电商项目：MySQL存储图片URL数组问题咨询

方案1：正确使用JSON字段存储数组 #

如果坚持用JSON类型字段，问题大概率出在插入时的格式或序列化操作上，按以下步骤调整即可：

1. 确认MySQL版本：JSON类型要求MySQL 5.7及以上版本，先检查版本：

SELECT VERSION();

2. 创建合法的表结构：

CREATE TABLE products (
    id INT AUTO_INCREMENT PRIMARY KEY,
    category VARCHAR(100) NOT NULL,
    title VARCHAR(255) NOT NULL,
    description TEXT,
    price DECIMAL(10,2) NOT NULL,
    images JSON NOT NULL
);

3. 插入JSON数组的正确姿势：
   直接写SQL插入时，必须用单引号包裹合法的JSON格式数组：

INSERT INTO products (category, title, description, price, images)
VALUES (
    'laminate floors',
    'floor1',
    '耐磨 laminate 地板',
    199.99,
    '["https://example.com/floor1-1.jpg", "https://example.com/floor1-2.jpg"]'
);

用Node.js操作时，要把JS数组序列化为JSON字符串再传入（务必用参数化查询避免SQL注入）：

const product = {
    category: 'laminate floors',
    title: 'floor2',
    description: '防水 laminate 地板',
    price: 249.99,
    images: ['https://example.com/floor2-1.jpg', 'https://example.com/floor2-2.jpg']
};

// 以mysql2库为例的参数化查询
await connection.query(
    'INSERT INTO products (category, title, description, price, images) VALUES (?, ?, ?, ?, ?)',
    [product.category, product.title, product.description, product.price, JSON.stringify(product.images)]
);

4. 查询时解析JSON数组：
   SQL中可直接提取数组，或在Node.js里解析：

-- SQL提取数组
SELECT title, JSON_EXTRACT(images, '$') AS images FROM products WHERE id = 1;

Node.js拿到结果后执行JSON.parse(row.images)即可还原为数组。

方案2：规范化数据库设计（更适配电商长期需求） #

如果后续需要对图片做排序、添加备注、统计数量等操作，JSON字段会非常受限，建议拆分为两张表：

1. 商品主表：

CREATE TABLE products (
    id INT AUTO_INCREMENT PRIMARY KEY,
    category VARCHAR(100) NOT NULL,
    title VARCHAR(255) NOT NULL,
    description TEXT,
    price DECIMAL(10,2) NOT NULL
);

2. 商品图片关联表：

CREATE TABLE product_images (
    id INT AUTO_INCREMENT PRIMARY KEY,
    product_id INT NOT NULL,
    image_url VARCHAR(255) NOT NULL,
    sort_order INT DEFAULT 0, -- 控制图片展示顺序
    FOREIGN KEY (product_id) REFERENCES products(id) ON DELETE CASCADE
);

3. 插入数据：
   先插入商品，再关联插入图片：

-- 插入商品
INSERT INTO products (category, title, description, price)
VALUES ('laminate floors', 'floor1', '耐磨 laminate 地板', 199.99);
-- 获取刚插入的商品ID
SET @product_id = 818750;
-- 插入图片
INSERT INTO product_images (product_id, image_url, sort_order)
VALUES 
    (@product_id, 'https://example.com/floor1-1.jpg', 0),
    (@product_id, 'https://example.com/floor1-2.jpg', 1);

4. 查询商品及图片：
   通过JOIN关联查询：

SELECT p.*, pi.image_url, pi.sort_order
FROM products p
LEFT JOIN product_images pi ON p.id = pi.product_id
WHERE p.id = 1
ORDER BY pi.sort_order;

在Node.js中可将查询结果整理为包含images数组的商品对象。

常见问题排查 #

• 若插入时报错“Invalid JSON text”，检查JSON格式是否合法：数组必须用[]包裹，字符串用双引号，不能有多余的尾逗号。
• 确保Node.js传入的是JSON字符串而非原始数组（多数数据库驱动不会自动序列化数组到JSON字段）。
• 若使用MySQL 5.7以下版本，可改用TEXT字段存储JSON字符串，自行处理序列化和解析，但不推荐长期使用。

内容的提问来源于stack exchange，提问作者daniel Monroy