ephelya
Messages postés282Date d'inscriptionmercredi 28 septembre 2011StatutMembreDernière intervention20 juin 2023
-
Modifié le 20 juin 2023 à 22:59
jordane45
Messages postés38353Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention27 décembre 2024
-
21 juin 2023 à 06:31
Bonjour à tous,
Je suis en train de développer une extension chrome pour mon usage personnel. Je m'y connais un peu en php mais js ce n'est pas ça et là j'ai été un peu présomptueuse...
Le but de l'extension est de
- récupérer avec un clic droit + "enregistrer l'url" l'adresse de certaines images présentes sur des pages du type www.site.com?idsp=5
- enregistrer le couple url / id dans la base de données
Concrètement, je récupère l'id par content.js, qui l'envoie à background.js qui 'envoie à api.php qui se charge de l'enregistrement.
Dans les faits, je n'arrive à rien, chatGPT non plus et je suiscomplètment bloquée...
voici content.js
let url = new URL(window.location.href);
let idsp = url.searchParams.get("idsp");
console.log("url "+url);
// Envoi d'un message au script d'arrière-plan
chrome.runtime.sendMessage({idsp: idsp});
background.js
let currentIdsp = null;
// Création du menu contextuel
chrome.runtime.onInstalled.addListener(function() {
chrome.contextMenus.create({
"id": "saveImageUrl",
"title": "Enregistrer URL de l'image",
"contexts": ["image"]
});
});
// Écoute des messages envoyés par le script de contenu
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
currentIdsp = request.idsp;
console.log("Message reçu: ", currentIdsp);
});
// Écoute des clics sur le menu contextuel
chrome.contextMenus.onClicked.addListener(function(info, tab) {
if (info.menuItemId == "saveImageUrl") {
const imageUrl = info.srcUrl;
console.log("url "+imageUrl+" idsp "+currentIdsp);
saveImageUrlToDatabase(imageUrl, currentIdsp);
}
});
function saveImageUrlToDatabase(imageUrl, idsp) {
const apiUrl = 'https://escalier-b.com/EXTENSION/api/api_contextmenu.php';
console.log("on envoie url "+imageUrl+" idsp "+idsp);
fetch(`${apiUrl}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ image: imageUrl, idsp: idsp })
})
.then(response => response.text()) // Afficher le texte brut de la réponse
.then(text => {
console.log('Réponse en texte brut :', text);
return JSON.parse(text); // Convertir le texte en JSON
})
.then(data => {
console.log('Données enregistrées avec succès', data);
})
.catch(error => console.error('Erreur :', error));
}
et api_contextmenu.php
<?php
//api.php
header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
header('Access-Control-Allow-Headers: Content-Type, Authorization');
// Vérifier si la requête est une requête OPTIONS (pré-vérification CORS)
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
// Envoyer une réponse vide avec les en-têtes CORS
exit();
}
$allowed_origins = array("https://www.escalier-b.com", "chrome-extension://hdkodhhooeekaeidkmafoodoofnpenoe");
$origin = $_SERVER['HTTP_ORIGIN'];
if (in_array($origin, $allowed_origins)) {
header("Access-Control-Allow-Origin: $origin");
} else {
header("Access-Control-Allow-Origin: *");
}
define ("DB_NAME", "dbs5921888");
define ("DB_HOST", "db5007184138.hosting-data.io");
define ("DB_USER", "dbu1680683");
define ("DB_PWD", "zorbec_SQL92");
$pdo = new PDO("mysql:dbname=" . DB_NAME . ";host=" . DB_HOST, DB_USER, DB_PWD);
file_put_contents('request.log', print_r($_REQUEST, true) . "\n", FILE_APPEND);
file_put_contents('request.log', print_r(getallheaders(), true) . "\n", FILE_APPEND);
file_put_contents('request.log', file_get_contents('php://input') . "\n", FILE_APPEND);
//...
if ($_SERVER["REQUEST_METHOD"] == "POST") {
file_put_contents('request.log', "POST request received\n", FILE_APPEND);
if ($_SERVER["CONTENT_TYPE"] != 'application/json') {
file_put_contents('request.log', "Not a JSON request\n", FILE_APPEND);
echo json_encode(array('status' => 'error', 'message' => 'Le type de contenu n\'est pas JSON : ' . $_SERVER["CONTENT_TYPE"]));
exit();
} else {
file_put_contents('request.log', "Processing JSON request\n", FILE_APPEND);
$json = file_get_contents('php://input');
$data = json_decode($json);
if (!isset($data->image) || !isset($data->idsp)) {
file_put_contents('request.log', "Required data missing\n", FILE_APPEND);
http_response_code(400);
echo json_encode(['error' => 'Données requises manquantes']);
exit();
}
$idsp = $data->idsp;
$imageUrl = $data->image;
file_put_contents('request.log', "Saving image URL and IDSP to database\n", FILE_APPEND);
// Insérez ici le code pour enregistrer $imageUrl et $idsp dans la base de données
// Une fois que c'est fait, vous pouvez renvoyer la réponse
$result["status"] = "success";
$result["info"] = "ok requete";
echo json_encode($result);
}
}
/*
$result['post'] =$_POST;
// Obtenir les données JSON en tant que chaîne
$json = file_get_contents('php://input');
// Décoder la chaîne JSON en PHP structure de données (dans ce cas, un tableau associatif)
$data = json_decode($json, true);
$result['reçu'] =$data;
echo json_encode($result); exit();
//ENREGISTREMENT PHOTO ET SUGGESTED PRODS
if (isset($_GET['idsp']) && !empty($data->image)) {
$idsp = $_GET['idsp'];
$imageUrl = $data->image;
$query = "UPDATE suggestedProducts SET photoUrl = :imageUrl WHERE id = :idsp";
$stmt = $pdo->prepare($query);
$stmt->bindParam(':imageUrl', $imageUrl);
$stmt->bindParam(':idsp', $idsp);
if ($stmt->execute()) {
echo json_encode(['message' => 'Image URL enregistrée avec succès']);
} else {
echo json_encode(['message' => 'Erreur lors de l\'enregistrement'])
}
}
else
{
$result['status'] = 'error context menu ';
$result['message'] = $hist[]= 'Invalid data received.';
}
?>
Message reçu: 4
background.js:20 clic sur menu contextuel saveImageUrl
background.js:23 url https://osmosearchidesign.com/wp-content/uploads/2019/02/Pr%C3%A9sentation-tendance-2019-deco-500x460.jpg idsp 4
background.js:30 on envoie url https://osmosearchidesign.com/wp-content/uploads/2019/02/Pr%C3%A9sentation-tendance-2019-deco-500x460.jpg idsp 4
background.js:40 Réponse en texte brut :
background.js:46 Erreur : SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)
at background.js:41:17
Help ! ChatGPT est vraiment une bille sur ce coup-là et j'ai absolument besoin de cette extension pour la fin de la semaine... Quelqu'un peut m'aider svp ? Macintosh / Chrome 114.0.0.0
jordane45
Messages postés38353Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention27 décembre 20244 719 21 juin 2023 à 06:31
Bonjour
Que contient ton fichier de log request.log ?
À noter que ton message d'erreur semble indiquer que ton API ne retourne rien
background.js:40 Réponse en texte brut :
background.js:46 Erreur : SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)
background.js:40 Réponse en texte brut :
background.js:46 Erreur : SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)