区分不同的网址

Question

我试图区分不同的网址。我有一个 if/else，但希望这可以在 vanilla js 中做得更好。请不要快递js。

/product
/product/1 
/product/1/customer

/product
/product/2
/product/2/customer


/customer
/customer/1
/customer/1/product

/customer
/customer/2
/customer/2/product

当前策略：

if(request.url.indexOf('/product') != -1 && request.url.length == '/product'.length) {

} else if { // /product/:id
     if(!request.params) request.params = {};
    request.params.id = request.url.match(/^\/product\/([^\\/]+?)(?:\/(?=$))?$/i)[1];
} else { // 3rd case /product/1/customer

}

我认为我的 if/else 并没有解决上面提到的所有 uri。请提出任何解决方案，以便我可以针对不同的 url 以可重复使用的方式从上面解决所有 3 个案例，并从那里运行适当的查询。

Answer 1

这是一个非常基本的示例，希望能帮助您走上正轨。您首先需要存储您想要的所有 url，以及您想要运行的相关功能。然后当一个新的 url 进来时，你需要将它与你存储的 url 进行比较，看看是否有匹配。由于 url 可以具有某些不同的值，因此您需要一种处理通配符的方法。

所以首先创建一个函数，将特定的 url 方案和关联的 run 函数添加到数组中。

var myUrls = [];
function addUrl(url, associatedFunc){

    mrUrls.push({
        func: associatedFunc,
        parts: url.split('/').map(function(item){
            return item.startsWith(':') ? null : item;
        });
    });
}

要添加新的 url，您可以将 : 放在 url 的任何部分前面。

addUlr('/product/:value/customer', doCustomerStuffFunc);

接下来，您需要一种将传入的 url 请求与您的 url 数组进行比较的方法。

function resolveUrl(url){

    myUrls.forEach(function(item){
        var pieces = url.split('/');
        if(pieces.length === item.parts.length){
            for(var i=0; i<pieces.length; i++){
                // check if the piece is valid
                if(item.parts[i] && pieces[i] !== item.parts[i]){
                    break;
                }

                // if there is an exact match run the function and return
                if(i === pieces.length - 1){ return item.func(pieces); }
            }
        }
    });
}

这将运行第一次遇到的匹配关联函数，传入一个包含给定 url 中所有值的数组。

注意：这是未经测试的代码，在我脑海中写下，旨在帮助您入门，而不是完整的解决方案。