Colt / YelpCamp

573 stars 561 forks source link

quick fix for seeds/index.js since unsplash API changed and requires an access key #35

Open Loksyy opened 1 year ago

Loksyy commented 1 year ago

1) Install axios npm i axios

2) Add the dependency in seeds/index.js const axios = require('axios');

3) Add these two lines of code in the loop using your own client key from unsplash dev section const res = await axios.get('https://api.unsplash.com/photos/random?client_id=[Access_Key]&collections=9046579'); const image = res.data.urls.small;

arnvjn14 commented 1 year ago

where should i write this code?

TalibIbrahim commented 1 year ago
const seedDB = async () => {

  await Campground.deleteMany({});

  for (let i = 0; i < 50; i++) {

    const random = Math.floor(Math.random() * 1000);
    const price = Math.floor(Math.random() * 20) + 10;

    const res = await axios.get(
      'https://api.unsplash.com/photos/random?client_id=[ACCESS ID]&collections=9046579'
    );
    const image = res.data.urls.small;

    const camp = new Campground({
      location: `${cities[random].city}, ${cities[random].state}`,
      title: `${sample(descriptors)} ${sample(places)}`,
      description:
        'Lorem ipsum ...',
      price,
      image,
    });
    await camp.save();
  }
};

This is what your loop should look like.

TalibIbrahim commented 1 year ago

Also note that unsplash doesnt allow more than 50 requests per hour unless you provide them proof that you are not abusing the API. While you are running the loop make sure it runs perfectly and if it doesnt, then remove the code that deletes all everytime you run. Too many requests and unsplash may block your id.

arnvjn14 commented 1 year ago

Thank you for your response. Could you help me one more time? I have an issue in mapbox, my map is not showing on any page. Sometimes ago it was working fine but now its not showing up.

On Tue, 14 Feb 2023 at 9:36 AM, TalibIbrahim @.***> wrote:

Also note that unsplash doesnt allow more than 50 requests per hour unless you provide them proof that you are not abusing the API. While you are running the loop make sure it runs perfectly and if it doesnt, then remove the code that deletes all everytime you run. Too many requests and unsplash may block your id.

— Reply to this email directly, view it on GitHub https://github.com/Colt/YelpCamp/issues/35#issuecomment-1429085026, or unsubscribe https://github.com/notifications/unsubscribe-auth/AZNHSM5XQFVPSF2DKT5SS7DWXMAFJANCNFSM6AAAAAAUDV43V4 . You are receiving this because you commented.Message ID: @.***>

TalibIbrahim commented 1 year ago

I havent gotten to the maps yet. Will try to solve your problem once I get to it.

mai-soup commented 1 year ago

I'm not done with the entire course yet, so apologies if he mentions randomising images for each campground in the seeds near the end, but if you're okay with all campgrounds having the same image, which refreshes every few seconds if a new request is made (same as in his videos near the start), the Unsplash Source API still works and doesn't require signup nor an API key:

https://source.unsplash.com/collection/[numerical id of your chosen collection]

It resolves to the URL of the "current" random image every time it's accessed, so you can just put it directly in the img tag's src and it'll work fine.

Of course, I can't guarantee it'll continue to work, as it doesn't seem to be documented on their website anymore, but at the moment it is still a solution.

TalibIbrahim commented 1 year ago

I dont get the same images for all the campgrounds in the home page. I always get different images.

Loksyy commented 1 year ago

I'm not done with the entire course yet, so apologies if he mentions randomising images for each campground in the seeds near the end, but if you're okay with all campgrounds having the same image, which refreshes every few seconds if a new request is made (same as in his videos near the start), the Unsplash Source API still works and doesn't require signup nor an API key:

https://source.unsplash.com/collection/[numerical id of your chosen collection]

It resolves to the URL of the "current" random image every time it's accessed, so you can just put it directly in the img tag's src and it'll work fine.

I genuinely forgot the details because it's been a while, but I remember following the exact same steps as Colt and was still getting an error in postman, however your solution seems pretty good but in my case I get a unique image for each campground because they're saved in mongodb.

mai-soup commented 1 year ago

That's fair. It's true that https://source.unsplash.com now redirects to https://unsplash.com/developers, but the endpoint itself was fine, so I just used that. Hope this helps if someone else, like me, doesn't want to sign up and doesn't mind repeating images.

TalibIbrahim commented 1 year ago

Signing up doesnt really take that long btw. Just get the API Key and copy the code for the loop I have given above and everything should work great.

arnvjn14 commented 1 year ago
const seedDB = async () => {

  await Campground.deleteMany({});

  for (let i = 0; i < 50; i++) {

    const random = Math.floor(Math.random() * 1000);
    const price = Math.floor(Math.random() * 20) + 10;

    const res = await axios.get(
      'https://api.unsplash.com/photos/random?client_id=[ACCESS ID]&collections=9046579'
    );
    const image = res.data.urls.small;

    const camp = new Campground({
      location: `${cities[random].city}, ${cities[random].state}`,
      title: `${sample(descriptors)} ${sample(places)}`,
      description:
        'Lorem ipsum ...',
      price,
      image,
    });
    await camp.save();
  }
};

This is what your loop should look like.

bro could you please send me your campgroundSchema. This code is not working for me.

TalibIbrahim commented 1 year ago

bro could you please send me your campgroundSchema. This code is not working for me.

Make sure the variables are named the same as you have. Also you need to enter the [ACCESS ID] in :

const res = await axios.get( 'https://api.unsplash.com/photos/random?client_id=[ACCESS ID]&collections=9046579' );

TalibIbrahim commented 1 year ago

Thank you for your response. Could you help me one more time? I have an issue in mapbox, my map is not showing on any page. Sometimes ago it was working fine but now its not showing up.

The problem must be with your access key. The token could be expired or not named correctly in the dotenv file. Check everywhere the access key is used.