Instagram Extracter

Extract images from single-image instagram posts

\n\n

\n \n {(resultImage && resultCaption)\n ? \"Post URL\"\n : \"Enter the URL to the Post\"}\n \n setUrl(e.target.value)}\n style={{ width: \"100%\", marginBottom: \"-15px\" }}\n />\n\n {!(resultImage && resultCaption) && (\n

\n Click the share button at the bottom left of post (the paper\n airplane), click \"copy link\", then paste it here.\n

\n )}\n

\n\n {resultImage && resultCaption && (\n <>\n {copyStatus && (\n \n {copyStatus}\n

\n )}\n\n

Post Data for Reposting

\n \n \n

\n\n

\n \n Click and hold, then click save image.\n

\n \n )}\n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n const instagramPostExtract =\n (await import(\"https://esm.town/v/wolf/instagramExtractUtils?v=55\"))\n .default;\n\n const url = new URL(request.url);\n\n if (url.pathname === \"/extract\") {\n const instagramUrl = url.searchParams.get(\"url\");\n\n if (!instagramUrl) {\n return new Response(JSON.stringify({ error: \"Missing URL parameter\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n try {\n const { caption, username, imageUrl } = await instagramPostExtract(\n instagramUrl,\n );\n console.log(imageUrl);\n\n // If the 'image' parameter is present, proxy the image\n if (url.searchParams.get(\"image\") === \"true\") {\n const imageResponse = await fetch(imageUrl);\n return new Response(imageResponse.body, {\n headers: {\n \"Content-Type\": imageResponse.headers.get(\"Content-Type\") ||\n \"image/jpeg\",\n \"Cache-Control\": \"public, max-age=3600\", // Cache for 1 hour\n },\n });\n }\n\n // Otherwise, return JSON with caption and proxied image URL\n const proxiedImageUrl = `${url.origin}/extract?url=${\n encodeURIComponent(instagramUrl)\n }&image=true`;\n return new Response(\n JSON.stringify({ caption, imageUrl: proxiedImageUrl, username }),\n {\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n } catch (error) {\n return new Response(\n JSON.stringify({ error: \"Extraction failed\" + error }),\n {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n }\n }\n\n return new Response(\n `\n \n \n Instagram Extracter\n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n}\n","createdAt",["D",1737433939559],"version",80,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount",1,"commentCount","prCount","mergedPr",{"_129":130,"_131":132},"handle","wolf","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJvVXpPVUZRTjZGTGd2Q2t4c0RRdFpNZWJ5UCJ9","forkedVal","interval","slug","wolf/instagramExtract","description","@jsxImportSource https://esm.sh/react@18.2.0","versions",[141,144,148,152,156,160,164,168,172,176,180,184,188,192,196,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284,288,292,296,300,304,308,312,316,320,324,328,332,336,340,344,348,352,356,360,364,368,372,376,380,384,388,392,396,400,404,408,412,416,420,424,428,432,436,440,444,448,452,455,458],{"_117":118,"_142":-5,"_115":143,"_112":110},"prId",["D",1737433939559],{"_117":145,"_142":-5,"_115":146,"_112":147},79,["D",1737433884187],"926497b6-d7b0-11ef-929a-e6cdfca9ef9f",{"_117":149,"_142":-5,"_115":150,"_112":151},78,["D",1737433614025],"f15cd130-d7af-11ef-b235-e6cdfca9ef9f",{"_117":153,"_142":-5,"_115":154,"_112":155},77,["D",1737433612585],"f0808bf8-d7af-11ef-8161-e6cdfca9ef9f",{"_117":157,"_142":-5,"_115":158,"_112":159},76,["D",1737433610486],"ef4138dc-d7af-11ef-8f36-e6cdfca9ef9f",{"_117":161,"_142":-5,"_115":162,"_112":163},75,["D",1737433609679],"eec55a28-d7af-11ef-a482-e6cdfca9ef9f",{"_117":165,"_142":-5,"_115":166,"_112":167},74,["D",1737433607136],"ed41a3f0-d7af-11ef-a482-e6cdfca9ef9f",{"_117":169,"_142":-5,"_115":170,"_112":171},73,["D",1737433605655],"ec602d4e-d7af-11ef-ac11-e6cdfca9ef9f",{"_117":173,"_142":-5,"_115":174,"_112":175},72,["D",1737433604057],"eb6b7984-d7af-11ef-b806-e6cdfca9ef9f",{"_117":177,"_142":-5,"_115":178,"_112":179},71,["D",1736714966552],"b61761e2-d126-11ef-9471-e6cdfca9ef9f",{"_117":181,"_142":-5,"_115":182,"_112":183},70,["D",1736714912436],"95d635b6-d126-11ef-9e02-e6cdfca9ef9f",{"_117":185,"_142":-5,"_115":186,"_112":187},69,["D",1736714760623],"3b5b70ec-d126-11ef-9da4-e6cdfca9ef9f",{"_117":189,"_142":-5,"_115":190,"_112":191},68,["D",1736714718995],"228d6d0e-d126-11ef-943c-e6cdfca9ef9f",{"_117":193,"_142":-5,"_115":194,"_112":195},67,["D",1736714551637],"becd6418-d125-11ef-a9f2-e6cdfca9ef9f",{"_117":197,"_142":-5,"_115":198,"_112":199},66,["D",1736714454658],"84f9a972-d125-11ef-b64e-e6cdfca9ef9f",{"_117":201,"_142":-5,"_115":202,"_112":203},65,["D",1736714404432],"670a3c92-d125-11ef-a7f9-e6cdfca9ef9f",{"_117":205,"_142":-5,"_115":206,"_112":207},64,["D",1736714157269],"d3b97b42-d124-11ef-b2ab-e6cdfca9ef9f",{"_117":209,"_142":-5,"_115":210,"_112":211},63,["D",1736713997572],"7488ef7c-d124-11ef-9eea-e6cdfca9ef9f",{"_117":213,"_142":-5,"_115":214,"_112":215},62,["D",1736713971425],"64f40d62-d124-11ef-89b0-e6cdfca9ef9f",{"_117":217,"_142":-5,"_115":218,"_112":219},61,["D",1736713939086],"51aeeaa6-d124-11ef-9eea-e6cdfca9ef9f",{"_117":221,"_142":-5,"_115":222,"_112":223},60,["D",1736713931342],"4d1071f4-d124-11ef-9ea6-e6cdfca9ef9f",{"_117":225,"_142":-5,"_115":226,"_112":227},59,["D",1736713913974],"42b9606c-d124-11ef-8eb8-e6cdfca9ef9f",{"_117":229,"_142":-5,"_115":230,"_112":231},58,["D",1736713893505],"3681f1d8-d124-11ef-ab5f-e6cdfca9ef9f",{"_117":233,"_142":-5,"_115":234,"_112":235},57,["D",1736713873634],"2aa94b7c-d124-11ef-9ef7-e6cdfca9ef9f",{"_117":237,"_142":-5,"_115":238,"_112":239},56,["D",1736713841156],"174cc464-d124-11ef-8382-e6cdfca9ef9f",{"_117":241,"_142":-5,"_115":242,"_112":243},55,["D",1736713822545],"0c3485c6-d124-11ef-9b97-e6cdfca9ef9f",{"_117":245,"_142":-5,"_115":246,"_112":247},54,["D",1736713768776],"ec2825b2-d123-11ef-9cdd-e6cdfca9ef9f",{"_117":249,"_142":-5,"_115":250,"_112":251},53,["D",1736713747729],"df9c7f14-d123-11ef-8d8d-e6cdfca9ef9f",{"_117":253,"_142":-5,"_115":254,"_112":255},52,["D",1736713676669],"b541fa28-d123-11ef-92d3-e6cdfca9ef9f",{"_117":257,"_142":-5,"_115":258,"_112":259},51,["D",1736713539065],"633cc9f6-d123-11ef-8d8d-e6cdfca9ef9f",{"_117":261,"_142":-5,"_115":262,"_112":263},50,["D",1736713501716],"4cfc82b2-d123-11ef-bf20-e6cdfca9ef9f",{"_117":265,"_142":-5,"_115":266,"_112":267},49,["D",1736713490972],"4693f6d0-d123-11ef-acb2-e6cdfca9ef9f",{"_117":269,"_142":-5,"_115":270,"_112":271},48,["D",1736713448491],"2d404e04-d123-11ef-98ac-e6cdfca9ef9f",{"_117":273,"_142":-5,"_115":274,"_112":275},47,["D",1736713333148],"e88206d6-d122-11ef-92b1-e6cdfca9ef9f",{"_117":277,"_142":-5,"_115":278,"_112":279},46,["D",1736713277410],"c74ac214-d122-11ef-8ff6-e6cdfca9ef9f",{"_117":281,"_142":-5,"_115":282,"_112":283},45,["D",1736713209138],"9e963376-d122-11ef-88c6-e6cdfca9ef9f",{"_117":285,"_142":-5,"_115":286,"_112":287},44,["D",1736713127524],"6df18c8e-d122-11ef-becf-e6cdfca9ef9f",{"_117":289,"_142":-5,"_115":290,"_112":291},43,["D",1736712502528],"f96c06c4-d120-11ef-a038-e6cdfca9ef9f",{"_117":293,"_142":-5,"_115":294,"_112":295},42,["D",1736712331602],"938cfb56-d120-11ef-9a59-e6cdfca9ef9f",{"_117":297,"_142":-5,"_115":298,"_112":299},41,["D",1736712240393],"5d2d2810-d120-11ef-b01c-e6cdfca9ef9f",{"_117":301,"_142":-5,"_115":302,"_112":303},40,["D",1736712235893],"5a7e2560-d120-11ef-bd5d-e6cdfca9ef9f",{"_117":305,"_142":-5,"_115":306,"_112":307},39,["D",1736712214601],"4dcd1a92-d120-11ef-bb07-e6cdfca9ef9f",{"_117":309,"_142":-5,"_115":310,"_112":311},38,["D",1736712049596],"eb720f42-d11f-11ef-aa66-e6cdfca9ef9f",{"_117":313,"_142":-5,"_115":314,"_112":315},37,["D",1736711603448],"e18504fe-d11e-11ef-a3e0-e6cdfca9ef9f",{"_117":317,"_142":-5,"_115":318,"_112":319},36,["D",1736711590793],"d9faefbe-d11e-11ef-9f99-e6cdfca9ef9f",{"_117":321,"_142":-5,"_115":322,"_112":323},35,["D",1736711480359],"98288d94-d11e-11ef-8361-e6cdfca9ef9f",{"_117":325,"_142":-5,"_115":326,"_112":327},34,["D",1736711463724],"8e3d7934-d11e-11ef-9d93-e6cdfca9ef9f",{"_117":329,"_142":-5,"_115":330,"_112":331},33,["D",1736711439954],"8012b658-d11e-11ef-96fa-e6cdfca9ef9f",{"_117":333,"_142":-5,"_115":334,"_112":335},32,["D",1736711405938],"6bcc89ee-d11e-11ef-afe2-e6cdfca9ef9f",{"_117":337,"_142":-5,"_115":338,"_112":339},31,["D",1736711350275],"4a9f173c-d11e-11ef-ae35-e6cdfca9ef9f",{"_117":341,"_142":-5,"_115":342,"_112":343},30,["D",1736711299000],"2c101776-d11e-11ef-9af5-e6cdfca9ef9f",{"_117":345,"_142":-5,"_115":346,"_112":347},29,["D",1736711248369],"0de05c20-d11e-11ef-a51a-e6cdfca9ef9f",{"_117":349,"_142":-5,"_115":350,"_112":351},28,["D",1736711244383],"0b8156d2-d11e-11ef-b57c-e6cdfca9ef9f",{"_117":353,"_142":-5,"_115":354,"_112":355},27,["D",1736711193186],"ecfce12c-d11d-11ef-809a-e6cdfca9ef9f",{"_117":357,"_142":-5,"_115":358,"_112":359},26,["D",1736711188628],"ea4579f8-d11d-11ef-aaf1-e6cdfca9ef9f",{"_117":361,"_142":-5,"_115":362,"_112":363},25,["D",1736711183522],"e73a8e38-d11d-11ef-9ba7-e6cdfca9ef9f",{"_117":365,"_142":-5,"_115":366,"_112":367},24,["D",1736711171064],"dfcdd22c-d11d-11ef-b9c8-e6cdfca9ef9f",{"_117":369,"_142":-5,"_115":370,"_112":371},23,["D",1736711149835],"d325ee42-d11d-11ef-b9c6-e6cdfca9ef9f",{"_117":373,"_142":-5,"_115":374,"_112":375},22,["D",1736711138465],"cc668cb0-d11d-11ef-a842-e6cdfca9ef9f",{"_117":377,"_142":-5,"_115":378,"_112":379},21,["D",1736711111690],"bc695a7c-d11d-11ef-9d5b-e6cdfca9ef9f",{"_117":381,"_142":-5,"_115":382,"_112":383},20,["D",1736711094142],"b1f59fd8-d11d-11ef-aaf1-e6cdfca9ef9f",{"_117":385,"_142":-5,"_115":386,"_112":387},19,["D",1736711026990],"89ed33b6-d11d-11ef-b202-e6cdfca9ef9f",{"_117":389,"_142":-5,"_115":390,"_112":391},18,["D",1736710902101],"3f7d0f72-d11d-11ef-98eb-e6cdfca9ef9f",{"_117":393,"_142":-5,"_115":394,"_112":395},17,["D",1736710779221],"f63f9820-d11c-11ef-a210-e6cdfca9ef9f",{"_117":397,"_142":-5,"_115":398,"_112":399},16,["D",1736710540587],"68015c88-d11c-11ef-b785-e6cdfca9ef9f",{"_117":401,"_142":-5,"_115":402,"_112":403},15,["D",1736710396373],"120dfb88-d11c-11ef-9705-e6cdfca9ef9f",{"_117":405,"_142":-5,"_115":406,"_112":407},14,["D",1736710387089],"0c84504a-d11c-11ef-9460-e6cdfca9ef9f",{"_117":409,"_142":-5,"_115":410,"_112":411},13,["D",1736710308198],"dd7f0b1e-d11b-11ef-9279-e6cdfca9ef9f",{"_117":413,"_142":-5,"_115":414,"_112":415},12,["D",1736710204922],"9fef6744-d11b-11ef-86d7-e6cdfca9ef9f",{"_117":417,"_142":-5,"_115":418,"_112":419},11,["D",1736710166954],"894e8c68-d11b-11ef-b9e7-e6cdfca9ef9f",{"_117":421,"_142":-5,"_115":422,"_112":423},10,["D",1736710018958],"31174c60-d11b-11ef-a531-e6cdfca9ef9f",{"_117":425,"_142":-5,"_115":426,"_112":427},9,["D",1736709993434],"21e1e0ac-d11b-11ef-9030-e6cdfca9ef9f",{"_117":429,"_142":-5,"_115":430,"_112":431},8,["D",1736709917755],"f4c61e08-d11a-11ef-a709-e6cdfca9ef9f",{"_117":433,"_142":-5,"_115":434,"_112":435},7,["D",1736707688055],"c3c47b10-d115-11ef-a7aa-e6cdfca9ef9f",{"_117":437,"_142":-5,"_115":438,"_112":439},6,["D",1736707613774],"977d4d70-d115-11ef-9d00-e6cdfca9ef9f",{"_117":441,"_142":-5,"_115":442,"_112":443},5,["D",1736707519824],"5f7e1666-d115-11ef-984d-e6cdfca9ef9f",{"_117":445,"_142":-5,"_115":446,"_112":447},4,["D",1736707307016],"e0a76770-d114-11ef-9e7b-e6cdfca9ef9f",{"_117":449,"_142":-5,"_115":450,"_112":451},3,["D",1736707192770],"9c8ddf6a-d114-11ef-a1cc-e6cdfca9ef9f",{"_117":90,"_142":-5,"_115":453,"_112":454},["D",1736706937828],"04995f2c-d114-11ef-9b84-e6cdfca9ef9f",{"_117":124,"_142":-5,"_115":456,"_112":457},["D",1736706934978],"02e614ae-d114-11ef-abd0-e6cdfca9ef9f",{"_117":31,"_142":-5,"_115":459,"_112":460},["D",1736706898712],"ed4b0d34-d113-11ef-ac59-e6cdfca9ef9f","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.versions.$(version)",{"_93":468,"_469":470,"_94":471},"single","redirect","/v/wolf/instagramExtract/versions",{"_112":247,"_113":472,"_117":245,"_115":473,"_474":99,"_100":101,"_107":108,"_129":130,"_11":96,"_475":-5,"_476":-5,"_477":-5,"_465":26,"_135":136},"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\n\nfunction App() {\n const [url, setUrl] = useState(\"\");\n const [resultCaption, setResultText] = useState(\"\");\n const [resultImage, setResultImage] = useState(\"\");\n const [copyStatus, setCopyStatus] = useState(\"\");\n const imageRef = useRef(null);\n const textRef = useRef(null);\n\n useEffect(() => {\n if (url) {\n fetch(`/extract?url=${encodeURIComponent(url)}`)\n .then((response) => response.json())\n .then((data) => {\n console.log(data);\n setResultText(data.caption);\n setResultImage(data.imageUrl);\n })\n .catch((error) => {\n console.error(\"Error fetching data:\", error);\n setResultText(\"Error fetching data\");\n setResultImage(\"\");\n });\n }\n }, [url]);\n\n const handleCopyText = () => {\n if (textRef.current) {\n try {\n navigator.clipboard.writeText(resultCaption).then(() => {\n setCopyStatus(\"Text copied! ✅\");\n setTimeout(() => setCopyStatus(\"\"), 2000);\n });\n } catch (err) {\n setCopyStatus(\"Failed to copy text ❌\");\n console.error(\"Copy text failed\", err);\n }\n }\n };\n\n const handleCopyImage = () => {\n if (resultImage) {\n try {\n const img = new Image();\n img.crossOrigin = \"anonymous\";\n img.src = resultImage;\n\n img.onload = function () {\n const canvas = document.createElement(\"canvas\");\n canvas.width = img.width;\n canvas.height = img.height;\n const ctx = canvas.getContext(\"2d\");\n ctx.drawImage(img, 0, 0);\n\n canvas.toBlob(async (blob) => {\n try {\n await navigator.clipboard.write([\n new ClipboardItem({ [blob.type]: blob }),\n ]);\n setCopyStatus(\"Image copied! 📷\");\n setTimeout(() => setCopyStatus(\"\"), 2000);\n } catch (err) {\n setCopyStatus(\"Failed to copy image ❌\");\n console.error(\"Copy image failed\", err);\n }\n }, \"image/png\");\n };\n\n img.onerror = function () {\n setCopyStatus(\"Failed to load image ❌\");\n console.error(\"Image loading failed\");\n };\n } catch (err) {\n setCopyStatus(\"Failed to copy image ❌\");\n console.error(\"Copy image failed\", err);\n }\n } else {\n setCopyStatus(\"No image to copy\");\n }\n };\n\n return (\n

Instagram Extracter

Extract images from single-image instagram posts

\n\n

\n Click the share button at the bottom left of post (the paper\n airplane), click \"copy link\", then paste it here.\n

\n )}\n

\n\n {resultImage && resultCaption && (\n <>\n {copyStatus && (\n \n {copyStatus}\n

\n )}\n\n

Post Data for Reposting

\n \n \n

\n\n

\n \n \n

\n \n )}\n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n const instagramPostExtract =\n (await import(\"https://esm.town/v/wolf/instagramExtractUtils?v=44\"))\n .default;\n\n // CORS headers\n const corsHeaders = {\n \"Access-Control-Allow-Origin\": \"*\",\n \"Access-Control-Allow-Methods\": \"GET, POST, PUT, DELETE, OPTIONS\",\n \"Access-Control-Allow-Headers\": \"Content-Type\",\n };\n\n // Handle OPTIONS request for CORS preflight\n if (request.method === \"OPTIONS\") {\n return new Response(null, {\n headers: corsHeaders,\n });\n }\n\n const url = new URL(request.url);\n\n if (url.pathname === \"/extract\") {\n const instagramUrl = url.searchParams.get(\"url\");\n if (!instagramUrl) {\n return new Response(JSON.stringify({ error: \"Missing URL parameter\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n try {\n const { caption, imageUrl } = await instagramPostExtract(instagramUrl);\n\n // Use a CORS proxy to bypass restrictions\n const corsProxyUrl = \"https://cors-anywhere.herokuapp.com/\";\n const proxiedImageUrl = `${corsProxyUrl}${imageUrl}`;\n\n return new Response(\n JSON.stringify({ caption, imageUrl: proxiedImageUrl }),\n {\n headers: {\n \"Content-Type\": \"application/json\",\n \"Access-Control-Allow-Origin\": \"*\",\n },\n },\n );\n } catch (error) {\n return new Response(JSON.stringify({ error: \"Extraction failed\" }), {\n status: 500,\n headers: {\n \"Content-Type\": \"application/json\",\n \"Access-Control-Allow-Origin\": \"*\",\n },\n });\n }\n }\n\n return new Response(\n `\n \n \n Instagram Extracter\n \n \n \n

\n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n ...corsHeaders,\n },\n },\n );\n}\n",["D",1736713768776],"valName","deletedAt","messageId","threadId","routes/_app","actionData","errors"]

instagramExtract

Version 54