2012-07-17 18 views
27

मैं एक छोटा सा वेब ऐप बना रहा हूं जिसमें कोई उपयोगकर्ता एक सर्वर यूआरएल दर्ज करता है जिससे वह AJAX अनुरोध के साथ डेटा लोड करता है।जावास्क्रिप्ट/jquery url पर पीछे की ओर स्लैश जोड़ें (यदि मौजूद नहीं है)

चूंकि उपयोगकर्ता को मैन्युअल रूप से यूआरएल दर्ज करना है, इसलिए लोग आमतौर पर पीछे की ओर स्लैश भूल जाते हैं, भले ही इसकी आवश्यकता हो (जैसे कुछ डेटा यूआरएल में संलग्न होता है)। मुझे यह जांचने का एक तरीका चाहिए कि स्लैश मौजूद है या नहीं, और यदि नहीं, तो इसे जोड़ें।

ऐसा लगता है कि jQuery के लिए एक लाइनर होगा, क्या कोई जानता है कि यह कैसे करें या क्या मुझे इसके लिए जेएस फ़ंक्शन लिखना चाहिए?

+4

अगर (yourString.charAt (yourString.length -1) = '/') {yourString + = '/'} – TheZ

+0

... गंभीरता से। बस कोड स्वयं लिखें। आपने इस सवाल से पूछने में अधिक समय बिताया, कि आप कोड लिखने में खर्च कर चुके होंगे। – c69

+0

@TheZ 'substr' आपके प्यार को भी चाहता है ... – c69

उत्तर

87
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.replace(/\/?$/, '/'); 
  • स्लैश मौजूद है, तो यह / साथ बदल दिया है।
  • यदि पिछला स्लैश मौजूद नहीं है, तो / अंत में जोड़ा गया है (सटीक होना: पीछे की लंगर एंकर को / के साथ प्रतिस्थापित किया गया है)।
+0

बिल्कुल सही! सभी के लिए धन्यवाद :) – jackweirdy

7

मैं regex समाधान करने के लिए जोड़ा क्वेरी स्ट्रिंग को समायोजित करने:

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

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

अच्छा regex - fyi, आपके फीडल में '#' के लिए चेक गुम है, (हालांकि आपका जवाब स्पष्ट रूप से है।) – jlee

+0

दिलचस्प पहलू। – jscripter

9

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

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

यहाँ सबूत है

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

इस प्रश्न को ढूंढने से पहले और इसके जवाब मैंने अपना दृष्टिकोण बनाया। मैं इसे यहां पोस्ट करता हूं क्योंकि मुझे कुछ ऐसा नहीं दिखता है।

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); 
    } 
} 
+0

'history.replaceState' वही है जो मैं खोज रहा था। यह बिना किसी पूर्ण http 303 रीडायरेक्ट के * पीछे के स्लैश * को जोड़ने की अनुमति देता है। बहुत बहुत धन्यवाद :) – oxalorg

0

प्रत्येक यूआरएल अंत में स्लैश के साथ पूरा नहीं किया जा सकता है। कम से कम कई स्थितियां हैं जो एक की अनुमति नहीं देती हैं:

  • अंतिम मौजूदा स्लैश के बाद स्ट्रिंग index.html की तरह कुछ है।
  • पैरामीटर हैं: /page?foo=1&bar=2
  • खंड के लिए लिंक है: /page#tomato

यदि मैंने उपरोक्त में से कोई भी मामला मौजूद नहीं है तो मैंने स्लैश जोड़ने के लिए एक फ़ंक्शन लिखा है। स्लैश जोड़ने और भागों में यूआरएल तोड़ने की संभावना की जांच के लिए दो अतिरिक्त कार्य भी हैं। आखिरी मेरा नहीं है, मैंने मूल को एक लिंक दिया है।

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) 
 
    }; 
 
}

वहाँ भी कई मामलों हो सकता है जब स्लेश जोड़ने संभव नहीं है। अगर आप कुछ जानते हैं, तो कृपया मेरे उत्तर पर टिप्पणी करें।

1

यह रूप में अच्छी तरह से काम करता है:

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/ 
संबंधित मुद्दे