javascript/jquery urlに末尾のスラッシュを追加する（存在しない場合）

Question

ユーザーがAJAXリクエストでデータの読み込みを行うサーバーURLを入力する小さなWebアプリケーションを作成しています。

ユーザーは手動でURLを入力する必要があるため、必要な場合でも入力後のスラッシュを忘れてしまうことがあります。スラッシュがあるかどうかを確認する方法が必要です。スラッシュがない場合は追加してください。

これは、jQueryが1ライナーを持っていると思われるようですが、誰かがこれを行う方法を知っているのですか、それともJS関数を記述する必要がありますか？

Answer 1

var lastChar = url.substr(-1); // Selects the last character 
if (lastChar != '/') {   // If the last character is not a slash 
    url = url + '/';   // Append a slash to it. 
} 

一時変数名を省略し、直接、アサーションに埋め込むことができます。

if (url.substr(-1) != '/') url += '/'; 

目標はワンライナーでURLを変更しているので、以下のソリューションも使用することができます。

url = url.replace(/\/?$/, '/'); 

• 末尾にスラッシュが存在する場合は、/に置き換えられています。
• 末尾にスラッシュがない場合は、末尾に/が追加されます（正確には、末尾のアンカーは/に置き換えられます）。

Answer 2

あなたが好きな何かを行うことができます：

var url = 'http://stackoverflow.com'; 

if (!url.match(/\/$/)) { 
    url += '/'; 
} 

ここに証拠だ：http://jsfiddle.net/matthewbj/FyLnH/

Answer 3

私はクエリ文字列に対応するために、正規表現の溶液に加え：

http://jsfiddle.net/hRheW/8/

url.replace(/\/?(\?|#|$)/, '/$1') 

Answer 4

を

url += url.endsWith("/") ? "" : "/" 

Answer 5

この質問を見つける前に、私は自分のアプローチを作成しました。私は何か似たように見えないので、ここに投稿します。

function addSlashToUrl() { 
    //If there is no trailing shash after the path in the url add it 
    if (window.location.pathname.endsWith('/') === false) { 
     var url = window.location.protocol + '//' + 
       window.location.host + 
       window.location.pathname + '/' + 
       window.location.search; 

     window.history.replaceState(null, document.title, url); 
    } 
} 

Answer 6

最後にすべてのURLをスラッシュで終えることはできません。

• 最後に現存するスラッシュの後の文字列は、index.htmlのようなものです。
• パラメータ：/page?foo=1&bar=2があります。
• フラグメントへのリンク：/page#tomatoがあります。

上記のいずれのケースもない場合、スラッシュを追加する機能を記述しました。また、スラッシュを追加する可能性をチェックするため、およびURLを部分に分割するための2つの追加機能もあります。最後のものは私のものではなく、私は元のものへのリンクを与えました。

const SLASH = '/'; 
 

 
function appendSlashToUrlIfIsPossible(url) { 
 
    var resultingUrl = url; 
 
    var slashAppendingPossible = slashAppendingIsPossible(url); 
 

 
    if (slashAppendingPossible) { 
 
    resultingUrl += SLASH; 
 
    } 
 

 
    return resultingUrl; 
 
} 
 

 
function slashAppendingIsPossible(url) { 
 
    // Slash is possible to add to the end of url in following cases: 
 
    // - There is no slash standing as last symbol of URL. 
 
    // - There is no file extension (or there is no dot inside part called file name). 
 
    // - There are no parameters (even empty ones — single ? at the end of URL). 
 
    // - There is no link to a fragment (even empty one — single # mark at the end of URL). 
 
    var slashAppendingPossible = false; 
 

 
    var parsedUrl = parseUrl(url); 
 

 
    // Checking for slash absence. 
 
    var path = parsedUrl.path; 
 
    var lastCharacterInPath = path.substr(-1); 
 
    var noSlashInPathEnd = lastCharacterInPath !== SLASH; 
 

 
    // Check for extension absence. 
 
    const FILE_EXTENSION_REGEXP = /\.[^.]*$/; 
 
    var noFileExtension = !FILE_EXTENSION_REGEXP.test(parsedUrl.file); 
 

 
    // Check for parameters absence. 
 
    var noParameters = parsedUrl.query.length === 0; 
 
    // Check for link to fragment absence. 
 
    var noLinkToFragment = parsedUrl.hash.length === 0; 
 

 
    // All checks above cannot guarantee that there is no '?' or '#' symbol at the end of URL. 
 
    // It is required to be checked manually. 
 
    var NO_SLASH_HASH_OR_QUESTION_MARK_AT_STRING_END_REGEXP = /[^\/#?]$/; 
 
    var noStopCharactersAtTheEndOfRelativePath = NO_SLASH_HASH_OR_QUESTION_MARK_AT_STRING_END_REGEXP.test(parsedUrl.relative); 
 

 
    slashAppendingPossible = noSlashInPathEnd && noFileExtension && noParameters && noLinkToFragment && noStopCharactersAtTheEndOfRelativePath; 
 

 
    return slashAppendingPossible; 
 
} 
 

 
// parseUrl function is based on following one: 
 
// http://james.padolsey.com/javascript/parsing-urls-with-the-dom/. 
 
function parseUrl(url) { 
 
    var a = document.createElement('a'); 
 
    a.href = url; 
 

 
    const DEFAULT_STRING = ''; 
 

 
    var getParametersAndValues = function (a) { 
 
    var parametersAndValues = {}; 
 

 
    const QUESTION_MARK_IN_STRING_START_REGEXP = /^\?/; 
 
    const PARAMETERS_DELIMITER = '&'; 
 
    const PARAMETER_VALUE_DELIMITER = '='; 
 
    var parametersAndValuesStrings = a.search.replace(QUESTION_MARK_IN_STRING_START_REGEXP, DEFAULT_STRING).split(PARAMETERS_DELIMITER); 
 
    var parametersAmount = parametersAndValuesStrings.length; 
 

 
    for (let index = 0; index < parametersAmount; index++) { 
 
     if (!parametersAndValuesStrings[index]) { 
 
     continue; 
 
     } 
 

 
     let parameterAndValue = parametersAndValuesStrings[index].split(PARAMETER_VALUE_DELIMITER); 
 
     let parameter = parameterAndValue[0]; 
 
     let value = parameterAndValue[1]; 
 

 
     parametersAndValues[parameter] = value; 
 
    } 
 

 
    return parametersAndValues; 
 
    }; 
 

 
    const PROTOCOL_DELIMITER = ':'; 
 
    const SYMBOLS_AFTER_LAST_SLASH_AT_STRING_END_REGEXP = /\/([^\/?#]+)$/i; 
 
    // Stub for the case when regexp match method returns null. 
 
    const REGEXP_MATCH_STUB = [null, DEFAULT_STRING]; 
 
    const URL_FRAGMENT_MARK = '#'; 
 
    const NOT_SLASH_AT_STRING_START_REGEXP = /^([^\/])/; 
 
    // Replace methods uses '$1' to place first capturing group. 
 
    // In NOT_SLASH_AT_STRING_START_REGEXP regular expression that is the first 
 
    // symbol in case something else, but not '/' has taken first position. 
 
    const ORIGINAL_STRING_PREPENDED_BY_SLASH = '/$1'; 
 
    const URL_RELATIVE_PART_REGEXP = /tps?:\/\/[^\/]+(.+)/; 
 
    const SLASH_AT_STRING_START_REGEXP = /^\//; 
 
    const PATH_SEGMENTS_DELIMITER = '/'; 
 

 
    return { 
 
    source: url, 
 
    protocol: a.protocol.replace(PROTOCOL_DELIMITER, DEFAULT_STRING), 
 
    host: a.hostname, 
 
    port: a.port, 
 
    query: a.search, 
 
    parameters: getParametersAndValues(a), 
 
    file: (a.pathname.match(SYMBOLS_AFTER_LAST_SLASH_AT_STRING_END_REGEXP) || REGEXP_MATCH_STUB)[1], 
 
    hash: a.hash.replace(URL_FRAGMENT_MARK, DEFAULT_STRING), 
 
    path: a.pathname.replace(NOT_SLASH_AT_STRING_START_REGEXP, ORIGINAL_STRING_PREPENDED_BY_SLASH), 
 
    relative: (a.href.match(URL_RELATIVE_PART_REGEXP) || REGEXP_MATCH_STUB)[1], 
 
    segments: a.pathname.replace(SLASH_AT_STRING_START_REGEXP, DEFAULT_STRING).split(PATH_SEGMENTS_DELIMITER) 
 
    }; 
 
}

スラッシュを追加することができない場合にも、いくつかの例があるかもしれません。あなたが何かを知っているなら、私の答えをコメントしてください。

Answer 7

これは、同様に動作します

url = url.replace(/\/$|$/, '/'); 

例：

let urlWithoutSlash = 'https://www.example.com/path'; 
urlWithoutSlash = urlWithoutSlash.replace(/\/$|$/, '/'); 
console.log(urlWithoutSlash); 

let urlWithSlash = 'https://www.example.com/path/'; 
urlWithSlash = urlWithoutSlash.replace(/\/$|$/, '/'); 
console.log(urlWithSlash); 

出力：

https://www.example.com/path/ 
https://www.example.com/path/