如何改进 URL 查询并根据最佳实践对其进行格式化？

Question

我正在设置一个代表查询的变量。查询本身或多或少被硬编码为字符串，在占位符中提取 DOM 信息。

客户端-js.js

async function filterMovie(e){
    try {
        const queryAddon = `?title=${titleDOM.value}&genre=${genreDOM.value}&publishDateDOM=${publishDateDOM.value}&limit=${limitDOM.value}&skip=${skipDOM.value}&sort=${sortDOM.value}`
        let data = await fetch(`${baseURL}/movie/filter${queryAddon}`);
        data = await data.json();
        console.log(data);
    } catch (error) {
        console.log(error)

    }
}

电影控制器.js

const showOneMovie = async(req,res)=>{
    try {
        const {title, publishDate, genre, limit, skip, sort} = req.query;
        let data = await Movie.find({title, publishDate, genre}).limit(limit).skip(skip).sort(sort)
        res.status(200).json(data);
    } catch (error) {
        console.log(error)
    }
}

由于我对 URL 的查询部分不是很熟悉，所以我有以下问题：

1. 当前的过滤器查找确切的值并忽略部分位于结果记录内的搜索参数。设置此类“startsWith”或“in”运算符的最佳实践是什么以及如何实施？
2. 我听说 URL 必须进行编码。如果我让我的字符串保持原样会发生什么？可能会出现什么问题？在这个例子中我必须如何对其进行编码？

Answer 1

发送查询参数并确保正确编码的最佳方法是使用 URLSearchParams，如下所示：

async function filterMovie(e){
    try {
        const queryAddon = new URLSearchParams({
           title: titleDOM.value,
           genre: genreDOM.value,
           publishDate: publishDateDOM.value,
           limit: limitDOM.value,
           skip: skipDOM.value,
           sort: sortDOM.value
        });
        const response = await fetch(baseURL + '/movie/filter?' + queryAddon);
        const data = await response.json();
        console.log(data);
    } catch (error) {
        console.log(error)
    }
}

如果您想进行类似于 SQL

LIKE

或

IN

查询的模式匹配，您可以使用 $regex 或 $in

猫鼬中的

$regex

看起来像：

const showOneMovie = async(req,res)=>{
    try {
        const {title, publishDate, genre, limit, skip, sort} = req.query;
        //The query below would find any Movie that starts with whatever 
        //is in the title variable, the 'i' means case insensitive
        let data = await Movie.find({ title: { $regex: new RegExp(`\^${title}`), $options: 'i' } }).limit(limit).skip(skip).sort(sort)
        res.status(200).json(data);
    } catch (error) {
        console.log(error)
    }
}