আমি একটি ক্রোম এক্সটেনশন তৈরির প্রক্রিয়ায় আছি এবং পুরো জিনিসটি যেভাবে আমি এটি করতে চাই তা কাজ করার জন্য, কোনও ব্যবহারকারী আমার এক্সটেনশন ইনস্টল আছে কিনা তা সনাক্ত করতে আমার একটি বাহ্যিক জাভাস্ক্রিপ্ট স্ক্রিপ্ট প্রয়োজন।
উদাহরণস্বরূপ: একজন ব্যবহারকারী আমার প্লাগইন ইনস্টল করেন, তারপরে আমার স্ক্রিপ্ট সহ কোনও ওয়েবসাইটে যান goes ওয়েবসাইটটি সনাক্ত করে যে আমার এক্সটেনশনটি ইনস্টল রয়েছে এবং সেই অনুযায়ী পৃষ্ঠা আপডেট করে।
এটা কি সম্ভব?
উত্তর:
আমি নিশ্চিত যে এখানে একটি প্রত্যক্ষ উপায় রয়েছে (সরাসরি আপনার এক্সটেনশনে ফাংশনগুলি কল করা বা এক্সটেনশনের জন্য জেএস ক্লাস ব্যবহার করে), তবে পরোক্ষ পদ্ধতি (আরও ভাল কিছু সামনে না আসা পর্যন্ত):
আপনার ক্রোম এক্সটেনশানটি খুব নির্দিষ্ট আইডি সহ আপনার পৃষ্ঠায় একটি নির্দিষ্ট ডিআইভি বা অন্যান্য উপাদান সন্ধান করুন।
উদাহরণ স্বরূপ:
<div id="ExtensionCheck_JamesEggersAwesomeExtension"></div>
একটি করুন getElementByIdএবং innerHTMLআপনার এক্সটেনশনের সংস্করণ নম্বর বা কোনও কিছুর উপরে সেট করুন । তারপরে আপনি সেই ক্লায়েন্টের পাশের সামগ্রীগুলি পড়তে পারেন।
আবার যদিও, যদি কোনও উপলব্ধ থাকে তবে আপনার সরাসরি পদ্ধতি ব্যবহার করা উচিত।
সম্পাদনা: সরাসরি পদ্ধতি পাওয়া গেল !!
এখানে পাওয়া সংযোগের পদ্ধতিগুলি ব্যবহার করুন: https://developer.chrome.com/extensions/extension#global-events
অনির্ধারিত, তবে আপনার করা উচিত ...
var myPort=chrome.extension.connect('yourextensionid_qwerqweroijwefoijwef', some_object_to_send_on_connect);
sendRequest(), onRequest, connect(), onRequest, এবং getURL()।
connectফাংশনটি chrome.runtimeনামস্থানে স্থানান্তরিত হয়েছিল । আরও আপ-টু-ডেট সংস্করণের জন্য বিজেউরির উত্তর (এবং মন্তব্যগুলি) দেখুন
ক্রোমের এখন ওয়েবসাইট থেকে এক্সটেনশানে বার্তা প্রেরণ করার ক্ষমতা রয়েছে।
সুতরাং এক্সটেনশন ব্যাকগ্রাউন্ডে (কন্টেন্ট.জেএস কাজ করবে না) এমন কিছু যুক্ত করুন:
chrome.runtime.onMessageExternal.addListener(
function(request, sender, sendResponse) {
if (request) {
if (request.message) {
if (request.message == "version") {
sendResponse({version: 1.0});
}
}
}
return true;
});
এটি আপনাকে ওয়েবসাইট থেকে কল করতে দেবে:
var hasExtension = false;
chrome.runtime.sendMessage(extensionId, { message: "version" },
function (reply) {
if (reply) {
if (reply.version) {
if (reply.version >= requiredVersion) {
hasExtension = true;
}
}
}
else {
hasExtension = false;
}
});
তারপরে আপনি হ্যাশ এক্সটেনশন ভেরিয়েবলটি পরীক্ষা করতে পারেন। একমাত্র ত্রুটি কলটি অ্যাসিক্রোনাস, তাই আপনাকে কোনওরকমভাবে এটিকে ঘিরে কাজ করতে হবে।
সম্পাদনা: নীচে উল্লিখিত হিসাবে, আপনাকে ম্যানিফেস্টে একটি এন্ট্রি যুক্ত করতে হবে j যেমন:
"externally_connectable": {
"matches": ["*://localhost/*", "*://your.domain.com/*"]
},
আরেকটি পদ্ধতি হ'ল একটি ওয়েব-অ্যাক্সেসযোগ্য সংস্থানটি প্রকাশ করা , যদিও এটি কোনও ওয়েবসাইটকে আপনার এক্সটেনশনটি ইনস্টল করা আছে কিনা তা পরীক্ষা করার অনুমতি দেবে।
ধরুন আপনার এক্সটেনশনের আইডি হ'ল aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaএবং আপনি test.pngআপনার এক্সটেনশনের ফাইলগুলির মতো একটি ফাইল (বলুন, একটি স্বচ্ছ পিক্সেল চিত্র) যুক্ত করুন ।
তারপরে, আপনি এই ফাইলটি ওয়েব পৃষ্ঠাগুলিতে web_accessible_resourcesম্যানিফেস্ট কী সহ প্রকাশ করবেন:
"web_accessible_resources": [
"test.png"
],
আপনার ওয়েব পৃষ্ঠায়, আপনি এই ফাইলটি সম্পূর্ণ ইউআরএল দ্বারা লোড করার চেষ্টা করতে পারেন (একটি <img>ট্যাগে, এক্সএইচআর এর মাধ্যমে, বা অন্য কোনও উপায়ে):
chrome-extension://aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/test.png
যদি ফাইলটি লোড হয় তবে এক্সটেনশনটি ইনস্টল করা আছে। এই ফাইলটি লোড করার সময় যদি কোনও ত্রুটি হয় তবে এক্সটেনশনটি ইনস্টল করা হয় না।
// Code from https://groups.google.com/a/chromium.org/d/msg/chromium-extensions/8ArcsWMBaM4/2GKwVOZm1qMJ
function detectExtension(extensionId, callback) {
var img;
img = new Image();
img.src = "chrome-extension://" + extensionId + "/test.png";
img.onload = function() {
callback(true);
};
img.onerror = function() {
callback(false);
};
}
দ্রষ্টব্য: এই ফাইলটি লোড করার সময় যদি কোনও ত্রুটি ঘটে থাকে তবে নেটওয়ার্ক স্ট্যাক ত্রুটিটি কনসোলে উপস্থিত হবে না এটি নিস্তব্ধ করার কোনও সম্ভাবনা নেই। যখন Chromecast এই পদ্ধতিটি ব্যবহার করে, এটি এর কারণে বেশ কিছুটা বিতর্ক সৃষ্টি করেছিল ; ক্রম টিম দ্বারা সম্পূর্ণভাবে ডিভাইস থেকে খুব নির্দিষ্ট ত্রুটিগুলি কালো তালিকাভুক্ত করার চূড়ান্ত খুব কুরুচিপূর্ণ সমাধান সহ with
গুরুত্বপূর্ণ দ্রষ্টব্য: এই পদ্ধতিটি ফায়ারফক্স ওয়েব-এক্সটেনশনে কাজ করবে না। ওয়েব অ্যাক্সেসযোগ্য রিসোর্সগুলি অন্তর্নিহিতভাবে আঙুলের ছাপে এক্সটেনশানটি প্রকাশ করে, যেহেতু ইউআরএলটি আইডিটি জেনে অনুমানযোগ্য। ফায়ারফক্স ওয়েব অ্যাক্সেসযোগ্য সংস্থানগুলিতে একটি উদাহরণ-নির্দিষ্ট র্যান্ডম URL নির্ধারণ করে সেই গর্তটি বন্ধ করার সিদ্ধান্ত নিয়েছে :
ফাইলগুলি তখন URL এর মতো ব্যবহার করে উপলভ্য হবে:
moz-extension://<random-UUID>/<path/to/resource>এই ইউআইডিটি এলোমেলোভাবে প্রতিটি ব্রাউজারের জন্য তৈরি করা হয় এবং এটি আপনার এক্সটেনশনের আইডি নয়। এটি কোনও ব্যবহারকারী ইনস্টল করা এক্সটেনশানগুলিকে ফিঙ্গারপ্রিন্ট করা থেকে ওয়েবসাইটগুলিকে বাধা দেয়।
তবে এক্সটেনশনটি runtime.getURL()এই ঠিকানাটি পেতে ব্যবহার করতে পারে, আপনি নিজের ওয়েবসাইটে এটি হার্ড-কোড করতে পারবেন না।
আমি ভেবেছিলাম এই বিষয়ে আমি আমার গবেষণা ভাগ করে নেব। কিছু ফাইলের জন্য / /// লিঙ্কগুলিতে একটি নির্দিষ্ট এক্সটেনশন ইনস্টল করা হয়েছে কিনা তা সনাক্ত করতে আমার সক্ষম হওয়া দরকার। আমি এখানে এই নিবন্ধটি জুড়ে এসেছি এটি একটি এক্সটেনশনের ম্যানিফেস্ট.জসন পাওয়ার একটি পদ্ধতি ব্যাখ্যা করেছে।
আমি কোডটি কিছুটা সামঞ্জস্য করে এলাম:
function Ext_Detect_NotInstalled(ExtName, ExtID) {
console.log(ExtName + ' Not Installed');
if (divAnnounce.innerHTML != '')
divAnnounce.innerHTML = divAnnounce.innerHTML + "<BR>"
divAnnounce.innerHTML = divAnnounce.innerHTML + 'Page needs ' + ExtName + ' Extension -- to intall the LocalLinks extension click <a href="https://chrome.google.com/webstore/detail/locallinks/' + ExtID + '">here</a>';
}
function Ext_Detect_Installed(ExtName, ExtID) {
console.log(ExtName + ' Installed');
}
var Ext_Detect = function (ExtName, ExtID) {
var s = document.createElement('script');
s.onload = function () { Ext_Detect_Installed(ExtName, ExtID); };
s.onerror = function () { Ext_Detect_NotInstalled(ExtName, ExtID); };
s.src = 'chrome-extension://' + ExtID + '/manifest.json';
document.body.appendChild(s);
}
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
if (is_chrome == true) {
window.onload = function () { Ext_Detect('LocalLinks', 'jllpkdkcdjndhggodimiphkghogcpida'); };
}
এটির সাহায্যে আপনি কোনও সংখ্যক এক্সটেনশনের ইনস্টলেশন সনাক্ত করতে Ext_Detect (এক্সটেনশননেম, এক্সটেনশনআইডি) ব্যবহার করতে সক্ষম হবেন।
আপনার ওয়েবসাইটের মালিকানাধীন আর একটি সম্ভাব্য সমাধান হ'ল ইনলাইন ইনস্টলেশনটি ।
if (chrome.app.isInstalled) {
// extension is installed.
}
আমি এটি একটি পুরানো প্রশ্ন জানি কিন্তু এই পদ্ধতিটি ক্রোম 15 এ প্রবর্তিত হয়েছিল এবং তাই আমি ভেবেছিলাম আইডি এটি এখনই উত্তর খুঁজছেন এমন কারও জন্য তালিকাভুক্ত করুন।
আমি কুকি পদ্ধতিটি ব্যবহার করেছি:
আমার মেনিফেস্ট.জেএস ফাইলটিতে আমি একটি লিখিত সামগ্রী স্ক্রিপ্ট অন্তর্ভুক্ত করেছি যা কেবলমাত্র আমার সাইটে চালিত হয়:
"content_scripts": [
{
"matches": [
"*://*.mysite.co/*"
],
"js": ["js/mysite.js"],
"run_at": "document_idle"
}
],
আমার জেএস / ম্যাসাইট.জেজে আমার একটি লাইন আছে:
document.cookie = "extension_downloaded=True";
এবং আমার সূচক html পৃষ্ঠায় আমি সেই কুকিটি খুঁজছি।
if (document.cookie.indexOf('extension_downloaded') != -1){
document.getElementById('install-btn').style.display = 'none';
}
আপনি এক্সটেনশানটিতে একটি কুকি সেট করতে পারেন এবং আপনার ওয়েবসাইটগুলি জাভাস্ক্রিপ্ট চেক করে যদি সেই কুকি উপস্থিত থাকে এবং সেই অনুযায়ী আপডেট হয় update এটি এবং সম্ভবত এখানে উল্লিখিত বেশিরভাগ অন্যান্য পদ্ধতি অবশ্যই ব্যবহারকারীর দ্বারা উদ্দীপিত হতে পারে, যদি না আপনি চেষ্টা করেন এবং টাইমস্ট্যাম্প ইত্যাদির উপর নির্ভর করে কাস্টম কুকিজ তৈরি না করে এবং আপনার অ্যাপ্লিকেশনটি তাদের সার্ভারের দিকটি বিশ্লেষণ না করে দেখতে দেয় যে এটি সত্যই কোনও ব্যবহারকারী কিনা এক্সটেনশন বা কেউ তার কুকিগুলি সংশোধন করে এটির ভান করে।
এই গুগল গ্রুপ পোস্টে আরও একটি পদ্ধতি দেখানো হয়েছে । সংক্ষেপে, আপনি এক্সটেনশন আইকনটি সফলভাবে লোড হয়েছে কিনা তা সনাক্ত করার চেষ্টা করতে পারেন। আপনি যে এক্সটেনশানটির জন্য যাচাই করছেন তা আপনার নিজস্ব না হলে এটি সহায়ক হতে পারে।
ওয়েবপৃষ্ঠা ব্যাকগ্রাউন্ড স্ক্রিপ্টের মাধ্যমে এক্সটেনশনের সাথে ইন্টারঅ্যাক্ট করে।
manifest.json:
"background": {
"scripts": ["background.js"],
"persistent": true
},
"externally_connectable": {
"matches": ["*://(domain.ext)/*"]
},
background.js:
chrome.runtime.onMessageExternal.addListener(function(msg, sender, sendResponse) {
if ((msg.action == "id") && (msg.value == id))
{
sendResponse({id : id});
}
});
পেজ এইচটিএমএল:
<script>
var id = "some_ext_id";
chrome.runtime.sendMessage(id, {action: "id", value : id}, function(response) {
if(response && (response.id == id)) //extension installed
{
console.log(response);
}
else //extension not installed
{
console.log("Please consider installig extension");
}
});
</script>
আপনার এক্সটেনশানটি ওয়েবসাইটের সাথে ইন্টারঅ্যাক্ট করতে পারে (যেমন ভেরিয়েবলগুলি পরিবর্তন করা) এবং আপনার ওয়েবসাইট এটি সনাক্ত করতে পারে।
তবে এটি করার আরও ভাল উপায় থাকা উচিত। আমি ভাবছি যে গুগল কীভাবে এটি তাদের এক্সটেনশান গ্যালারীটিতে করছে (ইতিমধ্যে ইনস্টল থাকা অ্যাপ্লিকেশনগুলি চিহ্নিত রয়েছে)।
সম্পাদনা করুন:
গ্যালারী chrome.management.get ফাংশন ব্যবহার করে । উদাহরণ:
chrome.management.get("mblbciejcodpealifnhfjbdlkedplodp", function(a){console.log(a);});
তবে আপনি কেবল সঠিক অনুমতি সহ পৃষ্ঠাগুলি থেকে পদ্ধতিটি অ্যাক্সেস করতে পারবেন।
Uncaught TypeError: Cannot read property 'get' of undefined
এখন পর্যন্ত এখানে প্রচুর উত্তরগুলি কেবল ক্রোম বা একটি এইচটিটিপি ওভারহেড জরিমানা নিয়ে আসে। আমরা যে সমাধানটি ব্যবহার করছি তা কিছুটা আলাদা different
{
"matches": ["https://www.yoursite.com/*"],
"js": [
"install_notifier.js"
],
"run_at": "document_idle"
}
এটি install_notifier.js এর কোডটি সেই সাইটে চালানোর অনুমতি দেবে (যদি আপনার কাছে ইতিমধ্যে অনুমতি না থাকে)।
Install_notifier.js এ এই জাতীয় কিছু যুক্ত করুন (নোট করুন যে এটি ভেরিয়েবলগুলি বিশ্বব্যাপী থেকে রক্ষা পেতে একটি ক্লোজার ব্যবহার করছে, তবে এটি কঠোরভাবে প্রয়োজনীয় নয়):
// Dispatch a message to every URL that's in the manifest to say that the extension is
// installed. This allows webpages to take action based on the presence of the
// extension and its version. This is only allowed for a small whitelist of
// domains defined in the manifest.
(function () {
let currentVersion = chrome.runtime.getManifest().version;
window.postMessage({
sender: "my-extension",
message_name: "version",
message: currentVersion
}, "*");
})();
আপনার বার্তাটি কিছু বলতে পারে তবে সংস্করণটি প্রেরণে এটি কার্যকর হয় যাতে আপনি কী কী কাজ করছেন তা আপনি জানতে পারেন। তারপরে ...
এটি আপনার ওয়েবসাইটে কোথাও যুক্ত করুন:
window.addEventListener("message", function (event) {
if (event.source == window &&
event.data.sender &&
event.data.sender === "my-extension" &&
event.data.message_name &&
event.data.message_name === "version") {
console.log("Got the message");
}
});
এটি ফায়ারফক্স এবং ক্রোমে কাজ করে এবং HTTP ওভারহেড ব্যয় করে না বা পৃষ্ঠাটি ম্যানিপুলেট করে না।
এখানে একটি অন্য আধুনিক পদ্ধতি:
const checkExtension = (id, src, callback) => {
let e = new Image()
e.src = 'chrome-extension://'+ id +'/'+ src
e.onload = () => callback(1), e.onerror = () => callback(0)
}
// "src" must be included to "web_accessible_resources" in manifest.json
checkExtension('gighmmpiobklfepjocnamgkkbiglidom', 'icons/icon24.png', (ok) => {
console.log('AdBlock: %s', ok ? 'installed' : 'not installed')
})
checkExtension('bhlhnicpbhignbdhedgjhgdocnmhomnp', 'images/checkmark-icon.png', (ok) => {
console.log('ColorZilla: %s', ok ? 'installed' : 'not installed')
})
যদি আপনার ক্রোম এক্সটেনশানটিতে নিয়ন্ত্রণ থাকে তবে আমি যা করেছি তা চেষ্টা করতে পারেন:
// Inside Chrome extension
var div = document.createElement('div');
div.setAttribute('id', 'myapp-extension-installed-div');
document.getElementsByTagName('body')[0].appendChild(div);
এবং তারপর:
// On web page that needs to detect extension
if ($('#myapp-extension-installed-div').length) {
}
এটি কিছুটা হ্যাকি লাগছে, তবে আমি অন্যান্য পদ্ধতিগুলি কাজ করতে পারি না, এবং আমি ক্রোমকে এখানে এর এপিআই পরিবর্তন করার বিষয়ে উদ্বিগ্ন। সন্দেহজনক যে এই পদ্ধতিটি যে কোনও সময় শীঘ্রই কাজ করা বন্ধ করবে।
আমি যা ব্যবহার করেছি তা আপনি ক্রস ব্রাউজার পদ্ধতিও ব্যবহার করতে পারেন। একটি ডিভ যোগ করার ধারণা ব্যবহার করে।
আপনার সামগ্রী স্ক্রিপ্টে (যখনই স্ক্রিপ্টটি লোড হয়, এটি এটি করা উচিত)
if ((window.location.href).includes('*myurl/urlregex*')) {
$('html').addClass('ifextension');
}
আপনার ওয়েবসাইটে আপনি কিছু দৃsert়ভাবে বলেছেন,
if (!($('html').hasClass('ifextension')){}
এবং উপযুক্ত বার্তা নিক্ষেপ।
আপনি যদি কোনও ওয়েবসাইট থেকে কোনও এক্সটেনশন সনাক্ত করার চেষ্টা করছেন তবে এই পোস্টটি সহায়তা করেছে: https://ide.hey.network/post/5c3b6c7aa7af38479accc0c7
মূলত, সমাধানটি কেবল এক্সটেনশানটির পথটি নির্দিষ্ট করে নির্দিষ্ট ফাইল (ম্যানিফেস্ট.জসন বা একটি চিত্র) পাওয়ার চেষ্টা করা হবে। আমি যা ব্যবহার করেছি তা এখানে। অবশ্যই কাজ করছে:
const imgExists = function(_f, _cb) {
const __i = new Image();
__i.onload = function() {
if (typeof _cb === 'function') {
_cb(true);
}
}
__i.onerror = function() {
if (typeof _cb === 'function') {
_cb(false);
}
}
__i.src = _f;
__i = null;
});
try {
imgExists("chrome-extension://${CHROME_XT_ID}/xt_content/assets/logo.png", function(_test) {
console.log(_test ? 'chrome extension installed !' : 'chrome extension not installed..');
ifrm.xt_chrome = _test;
// use that information
});
} catch (e) {
console.log('ERROR', e)
}
আপনি কীভাবে ইনস্টল করা কোনও নির্দিষ্ট এক্সটেনশন সনাক্ত করতে পারেন এবং একটি সতর্কতা বার্তা প্রদর্শন করতে পারেন তা এখানে।
প্রথমে আপনাকে এক্সটেনশনের ম্যানিফেস্ট ফাইলটি ক্রোম-এক্সটেনশান: // এক্সটেনশন_আইডি_এইয়ার_এইচডিপিপাইফবিচজিপোহেন / ম্যানিফেস্ট.জসনে গিয়ে খুলতে হবে এবং "ওয়েব_অ্যাক্সেসিবল_সরোসিস" বিভাগের মধ্যে যে কোনও ফাইলের নাম সন্ধান করতে হবে।
<div class="chromewarning" style="display:none">
<script type="text/javascript">
$.get("chrome-extension://extension_id_here_hkdppipefbchgpohn/filename_found_in_ web_accessible_resources.png").done(function () {
$(".chromewarning").show();
}).fail(function () {
// alert("failed.");
});
</script>
<p>We have detected a browser extension that conflicts with learning modules in this course.</p>
</div>