Using PHP library to fetch opengraph

README.md

@@ -4,7 +4,9 @@
 
 A [Flarum](http://flarum.org) extension. Automatically display a rich preview of the link contents, such as title, description and image.
 
-![](https://i.imgur.com/fiXTK7C.png)
+This extension uses Google Favicon service to get the favicon.
+
+![](https://i.imgur.com/iZRE1gf.png)
 
 ## Installation
 

composer.json

@@ -10,7 +10,8 @@
     "type": "flarum-extension",
     "license": "MIT",
     "require": {
-        "flarum/core": "^1.2"
+        "flarum/core": "^1.2",
+        "spekulatius/phpscraper": "^0.5.2"
     },
     "authors": [
         {

extend.php

@@ -17,4 +17,7 @@
     (new Extend\Frontend('forum'))
         ->js(__DIR__.'/js/dist/forum.js')
         ->css(__DIR__.'/less/forum.less'),
+
+    (new Extend\Routes('api'))
+        ->get('/datlechin-link-preview', 'datlechin-link-preview', Api\Controllers\ScrapperController::class),
 ];

js/src/forum/index.js

@@ -65,17 +65,16 @@ app.initializers.add('datlechin/flarum-link-preview', () => {
           loadingIcon.classList.add('fa', 'fa-spinner', 'fa-spin');
           imageWrapper.appendChild(loadingIcon);
 
-          fetch(`https://meta-grabber.herokuapp.com?url=` + href, {
-            method: 'GET',
-            mode: 'cors',
-            credentials: 'omit',
-          })
-            .then((result) => {
-              loadingIcon.remove();
-              return result.json();
+          console.log();
+
+          app
+            .request({
+              url: app.forum.attribute('apiUrl') + '/datlechin-link-preview?url=' + encodeURIComponent(href),
+              method: 'GET',
             })
             .then((data) => {
-              img.src = data.image ? data.image : 'https://www.google.com/s2/favicons?sz=64&domain_url=' + domainName;
+              loadingIcon.remove();
+              img.src = data.image ? data.image : 'https://www.google.com/s2/favicons?sz=64&domain_url=' + domainUrl;
               titleLink.href = data.url ? data.url : href;
               titleLink.textContent = data.title ? data.title : domainName;
               description.textContent = data.description ? data.description : '';

less/forum.less

@@ -1,6 +1,6 @@
 .LinkPreview {
   background: @primary-color;
-  padding: 7px;
+  padding: 7px 10px;
   display: flex;
   border-radius: var(--border-radius);
   margin-top: 5px;
@@ -17,7 +17,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    width: 60px;
+    width: 50px;
 
     .fa-spinner {
       color: var(--button-bg);

src/Api/Controllers/ScrapperController.php

@@ -0,0 +1,38 @@
+<?php
+
+namespace Datlechin\LinkPreview\Api\Controllers;
+
+use Laminas\Diactoros\Response\JsonResponse;
+use Psr\Http\Message\ResponseInterface as Response;
+use Psr\Http\Message\ServerRequestInterface as Request;
+use Psr\Http\Server\RequestHandlerInterface;
+
+class ScrapperController implements RequestHandlerInterface
+{
+    protected $web;
+
+    public function __construct(\spekulatius\phpscraper $web)
+    {
+        $this->web = $web;
+    }
+
+    public function handle(Request $request): Response
+    {
+        $url = isset($request->getQueryParams()['url']) ? $request->getQueryParams()['url'] : '';
+
+        if (filter_var($url, FILTER_VALIDATE_URL) === false) {
+            return new JsonResponse([
+                'error' => 'Invalid URL',
+            ], 400);
+        }
+
+        $this->web->go($url);
+
+        return new JsonResponse([
+            'site_name' => $this->web->openGraph['og:site_name'] ?? null,
+            'title' => $this->web->title,
+            'description' => $this->web->description,
+            'image' => $this->web->openGraph['og:image'] ?? null,
+        ]);
+    }
+}