diff --git a/CHANGELOG.md b/CHANGELOG.md index a6f885c..c10d62c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,10 @@ Types of changes: ------------- ------------- +## 1.2.3 - 2023-11-30 +### Fixed +- base URL issue adding extra slash + ## 1.2.2 - 2023-09-12 ### Fixed - Low preview image baseURL diff --git a/README.md b/README.md index 62df2e2..2bb23b0 100644 --- a/README.md +++ b/README.md @@ -201,7 +201,7 @@ Note: this will disregard your token above as this should be built into the CNAM ### baseURL -###### Type: **String** | Default: **"/"** | _optional_ +###### Type: **String** | Default: **""** | _optional_ Your image folder on server, this alows to shorten your origin image URLs. diff --git a/demo/components/screen-info/screen-info.js b/demo/components/screen-info/screen-info.js index 48d4465..b5e0d33 100644 --- a/demo/components/screen-info/screen-info.js +++ b/demo/components/screen-info/screen-info.js @@ -46,7 +46,7 @@ function ScreenInfo({ footerRef }) {
Your device pixel ratio:
- {dpr} + {dpr.toFixed(2)}
diff --git a/package.json b/package.json index 24b48e4..0f154ef 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "next-cloudimage-responsive", - "version": "1.2.2", + "version": "1.2.3", "private": false, "scripts": { "start": "next dev", diff --git a/src/utils/parse.js b/src/utils/parse.js index fdc1b48..cef72f4 100644 --- a/src/utils/parse.js +++ b/src/utils/parse.js @@ -14,6 +14,17 @@ const parseParams = (params) => { return _params; }; +const injectToUrl = (entryUrl, path, skipEndSlash = false) => { + if (entryUrl.endsWith('/')) return `${entryUrl}${path}`; + + if (!entryUrl) return path; + + if (skipEndSlash) return `${entryUrl}/${path}`; + + return `${entryUrl}/${path}/`; +}; + + const parseImageSrc = ({ cName, doNotReplaceURL, @@ -23,16 +34,22 @@ const parseImageSrc = ({ params, lowPreview, }) => { - const isIncludesApiVersion = apiVersion && !doNotReplaceURL; + const allowApiVersion = apiVersion && !doNotReplaceURL; const isIncludesWidthParam = WIDTH_PARAMS.some((widthParam) => src.includes(widthParam)); const _params = (lowPreview && params) ? params.replace(INFO_REGEX, '') : params; + let mainUrl = (!doNotReplaceURL && cName) ? `https://${cName}` : ''; + + + if (allowApiVersion) { + mainUrl = injectToUrl(mainUrl, apiVersion); + } + + mainUrl = injectToUrl(mainUrl, src, true); + return [ - (!doNotReplaceURL && cName) ? `https://${cName}` : '', - isIncludesApiVersion ? `/${apiVersion}/` : '', - (doNotReplaceURL || src.startsWith('/')) ? '' : '/', - src, - src.includes('?') ? '&' : '?', + mainUrl, + mainUrl.includes('?') ? '&' : '?', width && !isIncludesWidthParam ? `w=${width}&` : '', lowPreview ? 'blur=80&' : '', _params || '',