Функция JavaScript для получения идентификатора Instagram
У меня есть функция JavaScript с кнопкой события для получения идентификатора пользователей Instagram, но проблема в том, что она получит только идентификатор первого пользователя, и если я попытаюсь перейти к другому профилю, она выдаст идентификатор старого профиля. , вместо получения профиля текущей страницы?
(function() {
'use strict';
// Function to extract profile ID from the Instagram page
function getProfileId() {
// Extracting profile ID from the page source
var pageSource = document.documentElement.innerHTML;
var profileIdPattern = /"profilePage_(\d+)"/;
var matches = pageSource.match(profileIdPattern);
if (matches && matches.length > 1) {
return matches[1];
}
return null;
}
// Function to copy text to clipboard
function copyToClipboard(text) {
GM_setClipboard(text, 'text');
}
// Function to create and append a copy button to the Instagram page
function createCopyButton() {
var button = document.createElement('button');
button.textContent = 'Copy Profile ID';
button.style.position = 'fixed';
button.style.top = '20px';
button.style.right = '20px';
button.style.zIndex = '9999';
button.style.padding = '10px';
button.style.border = 'none';
button.style.backgroundColor = '#3897f0';
button.style.color = '#fff';
button.style.cursor = 'pointer';
button.addEventListener('click', function() {
var profileId = getProfileId();
if (profileId) {
copyToClipboard(profileId);
console.info('Profile ID copied to clipboard:', profileId);
alert('Profile ID copied to clipboard:\n' + profileId);
} else {
console.info('Profile ID not found.');
alert('Profile ID not found.');
}
});
document.body.appendChild(button);
}
// Run the function to create the copy button when the page is loaded
window.addEventListener('load', createCopyButton);
})();
Как мне исправить это так, чтобы он перезагружался каждый раз, когда я пытаюсь получить идентификатор нового профиля после первого?
Есть ли способ исправить это тогда? Мне кажется, он должен как-то каждый раз обновлять страницу, а это значит, что приходится делать много ненужной загрузки?
Попробуйте сопоставить все, а не только первое, а затем работать с последним полученным совпадением...? (Не уверен, что IG помещает это только в одно место документа или может быть несколько вхождений одного и того же идентификатора пользователя.)
Вы пробовали использовать API Instagram?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Символ user_id не всегда присутствует в HTML-коде страницы, для получения стабильного результата вам придется использовать API.
Чтобы свести изменения к минимуму, вы можете заменить функцию getProfileId на это:
function getProfileId() {
const username_div = document.querySelector('header > section > div:first-child > div:first-child'); // this div should contain the user handle
if (!username_div) return;
const url = `https://www.instagram.com/api/v1/users/web_profile_info/?username=${username_div.textContent}`;
const request = new XMLHttpRequest();
request.open('GET', url, false); // synchronous request
request.setRequestHeader('x-ig-app-id', '936619743392459'); // important header, will get error(400) without it
request.send();
const obj = JSON.parse(request.responseText);
return obj.data.user.id;
}
если вы хотите использовать выборку, вам придется использовать обратный вызов или изменить свои функции на использование async/await.
Кроме того, вы можете захотеть отображать кнопку только на страницах профиля, например, прослушивая события навигации.
например: window.navigation.addEventListener('navigatesuccess', () => setTimeout(toggleButton, 1000))
toggleButton может быть примерно так:
function toggleButton(){
const button = document.querySelector('#get-id');
const target = document.querySelector('header > section > div:first-child');
button && (button.style.visibility = target ? 'visible' : 'hidden');
}
и обязательно добавьте эти строки в конец функции createCopyButton:
button.id = 'get-id';
toggleButton();
Переход на другую страницу, скорее всего, на самом деле не загружает совершенно новую страницу, а только загружает контент в фоновом режиме, который затем добавляется в текущий документ, а элементы, созданные из содержимого предыдущих страниц, только скрываются. Таким образом, внутренний HTML будет содержать несколько вхождений
"profilePage_XYZ", но ваш код соответствует только первому из них...