Skip to content

Commit d43571a

Browse files
committed
init
0 parents  commit d43571a

File tree

8 files changed

+3399
-0
lines changed

8 files changed

+3399
-0
lines changed

.gitignore

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
lerna-debug.log*
8+
9+
# Diagnostic reports (https://nodejs.org/api/report.html)
10+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
11+
12+
# Runtime data
13+
pids
14+
*.pid
15+
*.seed
16+
*.pid.lock
17+
18+
# Directory for instrumented libs generated by jscoverage/JSCover
19+
lib-cov
20+
21+
# Coverage directory used by tools like istanbul
22+
coverage
23+
*.lcov
24+
25+
# nyc test coverage
26+
.nyc_output
27+
28+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
29+
.grunt
30+
31+
# Bower dependency directory (https://bower.io/)
32+
bower_components
33+
34+
# node-waf configuration
35+
.lock-wscript
36+
37+
# Compiled binary addons (https://nodejs.org/api/addons.html)
38+
build/Release
39+
40+
# Dependency directories
41+
node_modules/
42+
jspm_packages/
43+
44+
# TypeScript v1 declaration files
45+
typings/
46+
47+
# TypeScript cache
48+
*.tsbuildinfo
49+
50+
# Optional npm cache directory
51+
.npm
52+
53+
# Optional eslint cache
54+
.eslintcache
55+
56+
# Microbundle cache
57+
.rpt2_cache/
58+
.rts2_cache_cjs/
59+
.rts2_cache_es/
60+
.rts2_cache_umd/
61+
62+
# Optional REPL history
63+
.node_repl_history
64+
65+
# Output of 'npm pack'
66+
*.tgz
67+
68+
# Yarn Integrity file
69+
.yarn-integrity
70+
71+
# dotenv environment variables file
72+
.env
73+
.env.test
74+
75+
# parcel-bundler cache (https://parceljs.org/)
76+
.cache
77+
78+
# Next.js build output
79+
.next
80+
81+
# Nuxt.js build / generate output
82+
.nuxt
83+
dist
84+
85+
# Gatsby files
86+
.cache/
87+
# Comment in the public line in if your project uses Gatsby and *not* Next.js
88+
# https://nextjs.org/blog/next-9-1#public-directory-support
89+
# public
90+
91+
# vuepress build output
92+
.vuepress/dist
93+
94+
# Serverless directories
95+
.serverless/
96+
97+
# FuseBox cache
98+
.fusebox/
99+
100+
# DynamoDB Local files
101+
.dynamodb/
102+
103+
# TernJS port file
104+
.tern-port
105+
106+
# build
107+
lib/
108+
109+
.vscode/

.npmignore

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
# sources
2+
preview
3+
src
4+
5+
# locks
6+
package-lock.json
7+
yarn-lock.json
8+
9+
# configs
10+
tslint.json
11+
tsconfig.json
12+
.prettierrc

.prettierrc

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"printWidth": 140,
3+
"tabWidth": 2,
4+
"useTabs": false,
5+
"semi": false,
6+
"singleQuote": true,
7+
"trailingComma": "all"
8+
}

package.json

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
{
2+
"name": "nextjs-color-mode",
3+
"version": "1.0.5",
4+
"description": "A helper for creating non-flickering and accessible themed applications",
5+
"author": "Bart Stefanski <contact@bstefanski.com> (https://bstefanski.com/)",
6+
"license": "MIT",
7+
"source": "src/index.ts",
8+
"main": "./lib/next-image-proxy.cjs",
9+
"module": "./lib/next-image-proxy.module.js",
10+
"unpkg": "./lib/next-image-proxy.umd.js",
11+
"types": "./lib/index.d.ts",
12+
"files": [
13+
"lib"
14+
],
15+
"scripts": {
16+
"prepublishOnly": "npm run build",
17+
"prebuild": "rimraf lib",
18+
"build": "microbundle",
19+
"build:watch": "microbundle watch"
20+
},
21+
"repository": {
22+
"type": "git",
23+
"url": "git+https://github.com/bmstefanski/next-image-proxy.git"
24+
},
25+
"keywords": [
26+
"nextjs",
27+
"nextjs-plugin"
28+
],
29+
"bugs": {
30+
"url": "https://github.com/bmstefanski/next-image-proxy/issues"
31+
},
32+
"homepage": "https://github.com/bmstefanski/next-image-proxy#readme",
33+
"peerDependencies": {
34+
"next": ">=9.0.0",
35+
"react": ">=16.0.0",
36+
"react-dom": ">=16.0.0"
37+
},
38+
"devDependencies": {
39+
"@types/lodash.merge": "^4.6.6",
40+
"@types/next": "^9.0.0",
41+
"@types/node": "^16.4.13",
42+
"@types/react": "^17.0.18",
43+
"@types/user-agents": "^1.0.2",
44+
"microbundle": "^0.13.3",
45+
"prettier": "^2.3.2",
46+
"react": ">=16.0.0",
47+
"react-dom": ">=16.0.0",
48+
"typescript": "^4.3.5"
49+
},
50+
"dependencies": {
51+
"isomorphic-unfetch": "^3.1.0",
52+
"lodash.merge": "^4.6.2",
53+
"user-agents": "^1.0.934"
54+
}
55+
}

src/index.ts

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
import { NextApiRequest, NextApiResponse } from 'next'
2+
import fetch from 'isomorphic-unfetch'
3+
import stream, { Stream } from 'stream'
4+
import merge from 'lodash.merge'
5+
import UserAgent from 'user-agents'
6+
import { DeepPartial, Options } from './types'
7+
8+
export function withImageProxy(passedOptions?: DeepPartial<Options>) {
9+
const defaultOptions: Options = {
10+
whitelistedPatterns: [],
11+
fallbackUrl: '',
12+
messages: {
13+
wrongFormat: 'Image url not provided or has wrong format',
14+
notWhitelisted: 'Provided image url is not whitelisted',
15+
imageFetchError: "Couldn't fetch the image",
16+
},
17+
}
18+
19+
const options: Options = merge(defaultOptions, passedOptions)
20+
21+
return async function (req: NextApiRequest, res: NextApiResponse) {
22+
const imageUrl = req.query.imageUrl
23+
24+
if (!imageUrl || (imageUrl && Array.isArray(imageUrl))) {
25+
res.status(400).send({ message: options.messages.wrongFormat })
26+
return
27+
}
28+
29+
const isAllowed = isUrlWhitelisted(imageUrl)
30+
31+
if (!isAllowed) {
32+
res.status(422).send({ message: options.messages.notWhitelisted })
33+
return
34+
}
35+
36+
const imageBlob = await fetchImageBlob(imageUrl)
37+
38+
if (!imageBlob) {
39+
handleFallback()
40+
return
41+
}
42+
43+
pipeImage(imageBlob)
44+
45+
function pipeImage(imageBlob: ReadableStream<Uint8Array>) {
46+
const passThrough = new Stream.PassThrough()
47+
48+
stream.pipeline(imageBlob as unknown as NodeJS.ReadableStream, passThrough, (err) => {
49+
if (err) {
50+
console.log(err)
51+
handleFallback()
52+
return
53+
}
54+
})
55+
passThrough.pipe(res)
56+
}
57+
58+
function handleFallback() {
59+
if (options.fallbackUrl.trim()) {
60+
res.redirect(options.fallbackUrl)
61+
} else {
62+
res.status(422).send({ message: options.messages.imageFetchError })
63+
}
64+
}
65+
66+
async function fetchImageBlob(url: string) {
67+
return await fetch(url, {
68+
headers: { 'user-agent': new UserAgent().toString() },
69+
}).then((data) => data.body)
70+
}
71+
72+
function isUrlWhitelisted(url: string) {
73+
return options.whitelistedPatterns.some((singleHost) => {
74+
return url.match(singleHost)
75+
})
76+
}
77+
}
78+
}

src/types.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
export type DeepPartial<T> = T extends Function
2+
? T
3+
: T extends object
4+
? { [P in keyof T]?: DeepPartial<T[P]> }
5+
: T;
6+
7+
export interface Options {
8+
whitelistedPatterns: (string | RegExp)[];
9+
messages: {
10+
wrongFormat: string;
11+
notWhitelisted: string;
12+
imageFetchError: string;
13+
};
14+
fallbackUrl: string;
15+
}
16+

tsconfig.json

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"compilerOptions": {
3+
"target": "esnext",
4+
"module": "esnext",
5+
"jsx": "react",
6+
"declaration": true,
7+
"outDir": "lib",
8+
"strict": true,
9+
"noUnusedLocals": true,
10+
"noUnusedParameters": true,
11+
"noImplicitReturns": true,
12+
"noFallthroughCasesInSwitch": true,
13+
"allowSyntheticDefaultImports": true,
14+
"esModuleInterop": true,
15+
"moduleResolution": "node",
16+
"skipLibCheck": true,
17+
"baseUrl": "."
18+
},
19+
"include": ["src", "node_modules/next/types/global.d.ts", "global.d.ts"],
20+
"exclude": ["node_modules", "lib", "**/*.spec.ts", "example"]
21+
}

0 commit comments

Comments
 (0)