Laravel-How to use Instagram feed in laravel with example
In this article, we will learn, how to use Instagram Feed in the Laravel Application As we know in today’s young generation Instagram is very common within us. On every occasion or event, we upload our pictures on Instagram and share them with our near and dear ones.
So today, we are going to implement this with our laravel application. We will follow the below step to feed the Instagram Data.
Steps to integrate instagram with laravel
- Install Laravel Application
- Install Instagram Package
- Create the controller
- Create the route
- Create the view file
- Write the Instagram logic in our controller
- Test the integration.
Step-1 Install Laravel Application
Use the below command to install the laravel via composer.
composer create-project laravel/laravel instagram
Step-2 Install Instagram Package
We will use Instagram PHP Scraper to feed Instagram with laravel application, if you want to learn more about this package you can visit this link.
Use the below command to install Instagram PHP scraper via composer.
composer require raiym/instagram-php-scraper phpfastcache/phpfastcache
Step-3 Create the controller
By using the below command a controller file will be created inside app/http/controller folder. I am creating a folder named gallery controller.
php artisan make:controller GalleryController
Step:4 Create the route
Now we have to add a route inside web.php file, I am going to create the below route to show images in my gallery.
Route::get('gallery', [App\Http\Controllers\GalleryController::class, 'index'])->name('gallery');
Step:5 Create the blade file
Create file named as gallery.blade.php inside resources/views/gallery.blade.php and add the below code into it.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>Hello, world!</title>
</head>
<body>
<h1>Hello, world!</h1>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<div class="container">
<div id="portfolio" class="clearfix three-column marbot30 isotope" style="position: relative; overflow: hidden; height: 1994px;">
@foreach ($images as $key => $image)
<div class="element transition laser-eye-surgery isotope-item" data-category="laser-eye-surgery" style="position: absolute; left: 0px; top: 0px; transform: translate3d(0px, 0px, 0px);">
<figure>
<img src="{{url('insta/images/')}}/{{$key.'.png'}}" alt=" " class="img-responsive">
</figure>
</div>
@endforeach
</div> <!-- #portfolio -->
</div>
</body>
</html>
Step-6 Write the instagram logic in controller
Now we will write the Instagram business logic to feed the Instagram image and show it in our laravel application.
Now go to app/HTTP/controller and open GalleryController.php and write the below logic into it.
<?php
namespace App\Http\Controllers;
use Phpfastcache\Helper\Psr16Adapter;
class GalleryController extends Controller
{
/**
* This function show the image from instagram.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$instagram = \InstagramScraper\Instagram::withCredentials(new \GuzzleHttp\Client(), 'your username', 'your password', new Psr16Adapter('Files'));
$instagram->login(); // will use cached session if you want to force login $instagram->login(true)
$instagram->saveSession(); //DO NOT forget this in order to save the session, otherwise have no sense
$account = $instagram->getAccount('kumareyecentrekec');
$accountMedias = $account->getMedias();
foreach ($accountMedias as $key => $accountMedia) {
$images[$key] = str_replace("&","&", $accountMedia->getimageHighResolutionUrl());
$path = $images[$key];
$imageName = $key.'.png';
$img = public_path('insta/images/') . $imageName;
file_put_contents($img, file_get_contents($path));
}
return view('gallery', compact('images'));
}
}
if you put the dd(do or die) on the $account variable you have the output like the below one.
So from this output, you get all the things, like a number of followers/following post like image, profile name, etc.
Step:7 Test the integration
If you have all the things well, then you are ready for the below output. open the project and in your root type the below command
php artisan serve
Now in the browser visit this URL localhost:8000/gallery. then you have the output like the below one.
I hope you like the above article, please rate me 5 to keep me motivated.
This package creates new images every time. Is there any way to update only new images
I am getting this error on this line : $account = $instagram->getAccount(‘agyat_bhaw’); in controller ? Error is: Response code is 200: OK.Something went wrong. Please report issue. I am using Laravel Framework 10.30.1.