@@ -71,14 +71,71 @@ docker run -p 8080:8080 \
7171
7272See [ imgproxy documentation] ( https://docs.imgproxy.net/configuration ) for all available options.
7373
74- ### From Source
75-
76- ``` bash
77- go build -o imgproxy-cache .
78- ./imgproxy-cache
74+ ## Example client code
75+ ### HTML
76+ ``` html
77+ <img
78+ src =" https://process-image-url"
79+ onerror =" this.onerror=null; this.src='https://proxy-url/image-processing-params/original-image-url';"
80+ />
7981```
8082
81- ** Note** : When running from source, you must have imgproxy running separately on ` localhost:8081 ` . The application will wait up to 30 seconds for imgproxy to become healthy before starting.
83+ ### Elixir (with imgproxy signing)
84+
85+ ``` elixir
86+ @doc """
87+ Renders an image with proxy URL transformation.
88+ The image URL will be transformed to: <image_proxy_url>/<dimensions>/<image_url>
89+ """
90+ attr :src , :string , required: true
91+ attr :dimensions , :string , required: true
92+ attr :resize_mode , :string , default: " fit" , values: [" fit" , " fill" ]
93+ attr :class , :string , default: nil
94+ attr :alt , :string , default: nil
95+
96+ def image (assigns) do
97+ img_path =
98+ " /rs:#{ assigns.resize_mode } :#{ assigns.dimensions } :1/dpr:2/g:ce/" <>
99+ Base .encode64 (assigns.src) <> " .webp"
100+
101+ signature =
102+ :crypto .mac (
103+ :hmac ,
104+ :sha256 ,
105+ Base .decode16! (
106+ System .get_env (" IMGPROXY_KEY" ),
107+ case: :lower
108+ ),
109+ Base .decode16! (
110+ System .get_env (" IMGPROXY_SALT" ),
111+ case: :lower
112+ ) <> img_path
113+ )
114+ |> Base .url_encode64 (padding: false )
115+
116+ full_path = " /" <> signature <> img_path
117+
118+ assigns =
119+ assigns
120+ |> assign (:proxy_src , " #{ Application .get_env (:manage , :image_proxy_url )} #{ full_path } " )
121+ |> assign (
122+ :cached_src ,
123+ Application .get_env (:manage , :image_cache_url ) <>
124+ " /" <>
125+ (:crypto .hash (:md5 , full_path)
126+ |> Base .encode16 (case: :lower ))
127+ )
128+
129+ ~H"""
130+ <img
131+ src ={@cached_src}
132+ class ={@class}
133+ alt ={@alt}
134+ onerror ={ " this.onerror=null; this.src='#{@proxy_src}';" }
135+ />
136+ """
137+ end
138+ ```
82139
83140## Configuration
84141
@@ -166,71 +223,6 @@ curl http://localhost:8080/resize:fill:300:300/plain/https://example.com/cat.jpg
1662232025/10/20 10:30:15 INFO Uploaded to S3 path=/resize:fill:300:300/plain/https://example.com/cat.jpg bucket=my-images key=a3f8c9d2e1b4f7a6c8d9e2f1b3a4c5d6
167224```
168225
169- ## Example client code
170- ### HTML
171- ``` html
172- <img
173- src =" https://process-image-url"
174- onerror =" this.onerror=null; this.src='https://proxy-url/image-processing-params/original-image-url';"
175- />
176- ```
177-
178- ### Elixir
179-
180- ``` elixir
181- @doc """
182- Renders an image with proxy URL transformation.
183- The image URL will be transformed to: <image_proxy_url>/<dimensions>/<image_url>
184- """
185- attr :src , :string , required: true
186- attr :dimensions , :string , required: true
187- attr :resize_mode , :string , default: " fit" , values: [" fit" , " fill" ]
188- attr :class , :string , default: nil
189- attr :alt , :string , default: nil
190-
191- def image (assigns) do
192- img_path =
193- " /rs:#{ assigns.resize_mode } :#{ assigns.dimensions } :1/dpr:2/g:ce/" <>
194- Base .encode64 (assigns.src) <> " .webp"
195-
196- signature =
197- :crypto .mac (
198- :hmac ,
199- :sha256 ,
200- Base .decode16! (
201- System .get_env (" IMGPROXY_KEY" ),
202- case: :lower
203- ),
204- Base .decode16! (
205- System .get_env (" IMGPROXY_SALT" ),
206- case: :lower
207- ) <> img_path
208- )
209- |> Base .url_encode64 (padding: false )
210-
211- full_path = " /" <> signature <> img_path
212-
213- assigns =
214- assigns
215- |> assign (:proxy_src , " #{ Application .get_env (:manage , :image_proxy_url )} #{ full_path } " )
216- |> assign (
217- :cached_src ,
218- Application .get_env (:manage , :image_cache_url ) <>
219- " /" <>
220- (:crypto .hash (:md5 , full_path)
221- |> Base .encode16 (case: :lower ))
222- )
223-
224- ~H"""
225- <img
226- src ={@cached_src}
227- class ={@class}
228- alt ={@alt}
229- onerror ={ " this.onerror=null; this.src='#{@proxy_src}';" }
230- />
231- """
232- end
233- ```
234226
235227## Development
236228
0 commit comments