search

dubeyanant / Curations

A curated space.
https://cura-tions.vercel.app
3 stars 2 forks source link

[BUG] Unsplash image link not accepted #16

Open inclinedadarsh opened 11 months ago

inclinedadarsh commented 11 months ago

Describe the bug Ideally one should be able to use link after sharing an image from Unsplash, rather it's not accepting such links. It's accepting links that are copied using the "Copy image address"

To Reproduce

  1. Go to the edit mode
  2. Add a new card
  3. Copy a link from unsplash
  4. Paste it in header
  5. See error that it's not accepted

Screenshots image

Check one

dubeyanant commented 11 months ago

Can be solved by modifying this line appropriately.

inclinedadarsh commented 11 months ago

@dubeyanant I believe it needs more work than this.

Actually the link that the app accepts is image link. Basically the address of the very image on Unsplash/Pexel's server. But when someone shares the link from Unsplash, it doesn't provide the image's address, rather provides link of the page where the image is displayed along with Author's name and stuff.

So adding that link will simply not show the image as it's not the address of the server.

I believe the work needed is after adding the Unsplash link, the website itself somehow grabs that image's address and uses that.

The possible solution I speculate is use something like an edge function (something like in vercel's edge function or aws lambda functions) and then each time a banner is added, a request is sent to that function, the function grabs the image address by web scraping (idk about legality).

The other possible solution is to use Unsplash's Dev API. If you want, I can search more about it and post you on how to do that.

I have no idea about Pexel.

dubeyanant commented 11 months ago

Amazing vision. The problem is exactly as you describe, and it also occurs with Pexels. There is a distinction between the page address and the picture address, and even if regex allows you to enter the page address, it cannot yet load the actual image.

Difference:

Notion_ySWRkv427z