chrome.devtools.inspectedWindow

বর্ণনা

ইন্সপেক্টেড উইন্ডোর সাথে ইন্টারঅ্যাক্ট করতে chrome.devtools.inspectedWindow API ব্যবহার করুন: এর মাধ্যমে আপনি ইন্সপেক্টেড পেজের ট্যাব আইডি পেতে, ইন্সপেক্টেড উইন্ডোর প্রেক্ষাপটে কোড ইভ্যালুয়েট করতে, পেজটি রিলোড করতে, অথবা পেজের ভেতরের রিসোর্সগুলোর তালিকা পেতে পারেন।

প্রকাশ

এই এপিআইটি ব্যবহার করার জন্য ম্যানিফেস্টে নিম্নলিখিত কী-গুলো অবশ্যই ঘোষণা করতে হবে।

"devtools_page"

ইন্সপেক্টেড উইন্ডোর সাথে ইন্টারঅ্যাক্ট করতে chrome.devtools.inspectedWindow ব্যবহার করুন: এর মাধ্যমে আপনি ইন্সপেক্টেড পেজের ট্যাব আইডি পেতে, ইন্সপেক্টেড উইন্ডোর প্রেক্ষাপটে কোড ইভ্যালুয়েট করতে, পেজটি রিলোড করতে, অথবা পেজের ভেতরের রিসোর্সগুলোর তালিকা পেতে পারেন।

ডেভেলপার টুলস এপিআই ব্যবহারের সাধারণ পরিচিতির জন্য ডেভটুলস এপিআই সারাংশ দেখুন।

সংক্ষিপ্ত বিবরণ

tabId প্রপার্টিটি ট্যাব আইডেন্টিফায়ার প্রদান করে, যা আপনি ` chrome.tabs.* ` API কলগুলির সাথে ব্যবহার করতে পারেন। তবে, অনুগ্রহ করে মনে রাখবেন যে নিরাপত্তাজনিত কারণে chrome.tabs.* ` API-টি `Developer Tools` এক্সটেনশন পেজগুলিতে উন্মুক্ত করা হয় না—আপনাকে ট্যাব আইডিটি ব্যাকগ্রাউন্ড পেজে পাঠাতে হবে এবং সেখান থেকেই ` chrome.tabs.* ` API ফাংশনগুলি কল করতে হবে।

পরিদর্শিত পৃষ্ঠাটি পুনরায় লোড করতে reload মেথডটি ব্যবহার করা যেতে পারে। এছাড়াও, কলার ইউজার এজেন্ট স্ট্রিং-এর জন্য একটি ওভাররাইড, পৃষ্ঠা লোড হওয়ার সাথে সাথেই ইনজেক্ট করা হবে এমন একটি স্ক্রিপ্ট, অথবা ক্যাশ করা রিসোর্সসমূহ জোরপূর্বক পুনরায় লোড করার জন্য একটি অপশন নির্দিষ্ট করতে পারে।

পরিদর্শন করা পৃষ্ঠার মধ্যে থাকা রিসোর্সগুলির (ডকুমেন্ট, স্টাইলশীট, স্ক্রিপ্ট, ছবি ইত্যাদি) তালিকা পেতে getResources কল এবং onResourceContent ইভেন্টটি ব্যবহার করুন। Resource ক্লাসের getContent ও setContent মেথডগুলো onResourceContentCommitted ইভেন্টের সাথে একত্রে ব্যবহার করে রিসোর্সের বিষয়বস্তু পরিবর্তন করা যেতে পারে, যেমন—কোনো বাহ্যিক সম্পাদকের দ্বারা।

পরিদর্শন করা উইন্ডোতে কোড কার্যকর করা

eval মেথডটি এক্সটেনশনগুলোকে পরিদর্শন করা পৃষ্ঠার প্রেক্ষাপটে জাভাস্ক্রিপ্ট কোড কার্যকর করার ক্ষমতা প্রদান করে। সঠিক প্রেক্ষাপটে ব্যবহার করা হলে এই মেথডটি শক্তিশালী এবং অনুপযুক্তভাবে ব্যবহার করা হলে বিপজ্জনক। eval মেথডের নির্দিষ্ট কার্যকারিতার প্রয়োজন না হলে tabs.executeScript মেথডটি ব্যবহার করুন।

eval এবং tabs.executeScript মেথডগুলোর মধ্যে প্রধান পার্থক্যগুলো নিচে দেওয়া হলো:

  • eval মেথডটি যে কোড মূল্যায়ন করা হচ্ছে তার জন্য কোনো আইসোলেটেড ওয়ার্ল্ড ব্যবহার করে না, তাই ইন্সপেক্টেড উইন্ডোর জাভাস্ক্রিপ্ট স্টেট কোডটির কাছে অ্যাক্সেসযোগ্য থাকে। যখন ইন্সপেক্টেড পেজের জাভাস্ক্রিপ্ট স্টেটে অ্যাক্সেসের প্রয়োজন হয়, তখন এই মেথডটি ব্যবহার করুন।
  • যে কোডটি মূল্যায়ন করা হচ্ছে তার এক্সিকিউশন কনটেক্সটে ডেভেলপার টুলস কনসোল এপিআই অন্তর্ভুক্ত থাকে। উদাহরণস্বরূপ, কোডটি inspect এবং $0 ব্যবহার করতে পারে।
  • মূল্যায়ন করা কোডটি একটি মান রিটার্ন করতে পারে যা এক্সটেনশন কলব্যাকে পাঠানো হয়। রিটার্ন করা মানটি অবশ্যই একটি বৈধ JSON অবজেক্ট হতে হবে (এতে শুধুমাত্র প্রিমিটিভ জাভাস্ক্রিপ্ট টাইপ এবং অন্যান্য JSON অবজেক্টের অ্যাসাইক্লিক রেফারেন্স থাকতে পারে)। পরিদর্শন করা পৃষ্ঠা থেকে প্রাপ্ত ডেটা প্রসেস করার সময় অতিরিক্ত সতর্কতা অবলম্বন করুন—এক্সিকিউশন কনটেক্সট মূলত পরিদর্শন করা পৃষ্ঠা দ্বারাই নিয়ন্ত্রিত হয়; একটি ক্ষতিকারক পৃষ্ঠা এক্সটেনশনে রিটার্ন করা ডেটাকে প্রভাবিত করতে পারে।

উল্লেখ্য যে, একটি পৃষ্ঠায় একাধিক ভিন্ন জাভাস্ক্রিপ্ট এক্সিকিউশন কনটেক্সট থাকতে পারে। প্রতিটি ফ্রেমের নিজস্ব কনটেক্সট থাকে, এবং এর সাথে সেই ফ্রেমে চলমান কন্টেন্ট স্ক্রিপ্ট থাকা প্রতিটি এক্সটেনশনের জন্য একটি অতিরিক্ত কনটেক্সটও থাকে।

ডিফল্টরূপে, eval মেথডটি পরিদর্শন করা পেজের প্রধান ফ্রেমের প্রেক্ষাপটে কার্যকর হয়।

eval মেথডটি একটি ঐচ্ছিক দ্বিতীয় আর্গুমেন্ট গ্রহণ করে, যা ব্যবহার করে আপনি কোডটি কোন প্রেক্ষাপটে মূল্যায়ন করা হবে তা নির্দিষ্ট করতে পারেন। এই options অবজেক্টটিতে নিম্নলিখিত এক বা একাধিক কী থাকতে পারে:

frameURL
পরিদর্শনকৃত পৃষ্ঠার প্রধান ফ্রেম ব্যতীত অন্য কোনো ফ্রেম নির্দিষ্ট করতে এটি ব্যবহার করুন।
contextSecurityOrigin
এর ওয়েব অরিজিন অনুযায়ী নির্দিষ্ট ফ্রেমের মধ্যে একটি কনটেক্সট নির্বাচন করতে ব্যবহার করুন।
useContentScriptContext
যদি সত্য হয়, তাহলে এক্সটেনশনটির কন্টেন্ট স্ক্রিপ্টগুলোর সাথে একই কনটেক্সটে স্ক্রিপ্টটি চালান। (এটি এক্সটেনশনটির নিজস্ব ওয়েব অরিজিনকে কনটেক্সট সিকিউরিটি অরিজিন হিসেবে নির্দিষ্ট করার সমতুল্য।) এটি কন্টেন্ট স্ক্রিপ্টের সাথে ডেটা আদান-প্রদানের জন্য ব্যবহার করা যেতে পারে।

উদাহরণ

নিম্নলিখিত কোডটি পরিদর্শিত পৃষ্ঠায় ব্যবহৃত jQuery-এর সংস্করণ যাচাই করে:

chrome.devtools.inspectedWindow.eval(
  "jQuery.fn.jquery",
  function(result, isException) {
    if (isException) {
      console.log("the page is not using jQuery");
    } else {
      console.log("The page is using jQuery v" + result);
    }
  }
);

এই API-টি ব্যবহার করার জন্য, chrome-extension-samples রিপোজিটরি থেকে devtools API উদাহরণগুলো ইনস্টল করুন।

প্রকারভেদ

Resource

পরিদর্শিত পৃষ্ঠার মধ্যে থাকা কোনো রিসোর্স, যেমন একটি ডকুমেন্ট, একটি স্ক্রিপ্ট বা একটি ছবি।

বৈশিষ্ট্য

  • ইউআরএল

    স্ট্রিং

    রিসোর্সটির ইউআরএল।

  • বিষয়বস্তু পান

    শূন্যতা

    প্রতিশ্রুতি

    রিসোর্সটির বিষয়বস্তু সংগ্রহ করে।

    getContent ফাংশনটি দেখতে এইরকম: 

    (callback?: function) => {...}

    • কলব্যাক

      ফাংশন ঐচ্ছিক

      callback প্যারামিটারটি দেখতে এইরকম: 

      (response: object) => void

      • প্রতিক্রিয়া

        বস্তু

        বিচারাধীন

        একটি অবজেক্ট যা রিসোর্সের বিষয়বস্তু এবং এর এনকোডিং ধারণ করে।

        • বিষয়বস্তু

          স্ট্রিং

          রিসোর্সটির বিষয়বস্তু (সম্ভাব্য এনকোডকৃত)।

        • এনকোডিং

          স্ট্রিং

          বিষয়বস্তু এনকোড করা না থাকলে খালি থাকবে, অন্যথায় এনকোডিং নাম থাকবে। বর্তমানে শুধু বেস৬৪ (base64) সমর্থিত।

    • ফেরত

      প্রতিশ্রুতি<object>

      বিচারাধীন

      একটি ফাংশন যা অনুরোধটি সম্পন্ন হলে রিসোর্সের বিষয়বস্তু গ্রহণ করে।

      প্রমিস শুধুমাত্র ম্যানিফেস্ট ভি৩ এবং এর পরবর্তী সংস্করণগুলোতে সমর্থিত, অন্যান্য প্ল্যাটফর্মে কলব্যাক ব্যবহার করতে হবে।

  • setContent

    শূন্যতা

    প্রতিশ্রুতি

    রিসোর্সটির বিষয়বস্তু নির্ধারণ করে।

    setContent ফাংশনটি দেখতে এইরকম: 

    (content: string, commit: boolean, callback?: function) => {...}

    • বিষয়বস্তু

      স্ট্রিং

      রিসোর্সের নতুন বিষয়বস্তু। বর্তমানে শুধুমাত্র টেক্সট টাইপের রিসোর্সগুলো সমর্থিত।

    • প্রতিশ্রুতিবদ্ধ

      বুলিয়ান

      যদি ব্যবহারকারী রিসোর্সটির সম্পাদনা শেষ করে থাকেন এবং রিসোর্সটির নতুন বিষয়বস্তু সংরক্ষণ করা প্রয়োজন হয়, তবে এর মান হবে True; আর যদি ব্যবহারকারীর সম্পাদনা চলাকালীন পাঠানো পরিবর্তনটি সামান্য হয়, তবে এর মান হবে False।

    • কলব্যাক

      ফাংশন ঐচ্ছিক

      callback প্যারামিটারটি দেখতে এইরকম: 

      (error?: object) => void

      • ত্রুটি

        বস্তু ঐচ্ছিক

        রিসোর্সের বিষয়বস্তু সফলভাবে সেট করা হলে এর মান 'undefined' হবে; অন্যথায় ত্রুটি বর্ণনা করা হবে।

    • ফেরত

      প্রতিশ্রুতি<object>

      বিচারাধীন

      অনুরোধ সম্পন্ন হলে যে ফাংশনটি কল করা হয়।

      প্রমিস শুধুমাত্র ম্যানিফেস্ট ভি৩ এবং এর পরবর্তী সংস্করণগুলোতে সমর্থিত, অন্যান্য প্ল্যাটফর্মে কলব্যাক ব্যবহার করতে হবে।

বৈশিষ্ট্য

tabId

যে ট্যাবটি পরিদর্শন করা হচ্ছে তার আইডি। এই আইডিটি chrome.tabs.* API-এর সাথে ব্যবহার করা যেতে পারে।

প্রকার

সংখ্যা

পদ্ধতি

eval()

প্রতিশ্রুতি
chrome.devtools.inspectedWindow.eval(
  expression: string,
  options?: object,
  callback?: function,
): Promise<object>

পরিদর্শন করা পৃষ্ঠার প্রধান ফ্রেমের প্রেক্ষাপটে একটি জাভাস্ক্রিপ্ট এক্সপ্রেশন মূল্যায়ন করে। এক্সপ্রেশনটিকে অবশ্যই একটি JSON-সম্মত অবজেক্টে মূল্যায়ন করতে হবে, অন্যথায় একটি এক্সেপশন থ্রো করা হয়। eval ফাংশনটি হয় একটি DevTools-সাইড এরর অথবা মূল্যায়নের সময় ঘটা একটি জাভাস্ক্রিপ্ট এক্সেপশন রিপোর্ট করতে পারে। উভয় ক্ষেত্রেই, কলব্যাকের result প্যারামিটারটি undefined থাকে। DevTools-সাইড এররের ক্ষেত্রে, isException প্যারামিটারটি non-null হয় এবং এর isError কে true ও code একটি এরর কোডে সেট করা হয়। জাভাস্ক্রিপ্ট এররের ক্ষেত্রে, isException true এবং value থ্রো করা অবজেক্টের স্ট্রিং ভ্যালুতে সেট করা হয়।

প্যারামিটার

  • অভিব্যক্তি

    স্ট্রিং

    মূল্যায়ন করার জন্য একটি রাশি।

  • বিকল্পগুলি

    বস্তু ঐচ্ছিক

    options প্যারামিটারটিতে এক বা একাধিক অপশন থাকতে পারে।

    • ফ্রেমইউআরএল

      স্ট্রিং ঐচ্ছিক

      নির্দিষ্ট করা থাকলে, এক্সপ্রেশনটি সেই আইফ্রেমে মূল্যায়ন করা হয় যার URL নির্দিষ্ট করা URL-এর সাথে মেলে। ডিফল্টরূপে, এক্সপ্রেশনটি পরিদর্শন করা পৃষ্ঠার শীর্ষ ফ্রেমে মূল্যায়ন করা হয়।

    • স্ক্রিপ্টএক্সিকিউশনকনটেক্সট

      স্ট্রিং ঐচ্ছিক

      ক্রোম ১০৭+

      নির্দিষ্ট অরিজিনের সাথে মেলে এমন একটি এক্সটেনশনের কন্টেন্ট স্ক্রিপ্টের প্রেক্ষাপটে এক্সপ্রেশনটি মূল্যায়ন করুন। যদি এটি দেওয়া হয়, তাহলে scriptExecutionContext, useContentScriptContext-এর 'true' সেটিংটিকে ওভাররাইড করে।

    • useContentScriptContext

      বুলিয়ান ঐচ্ছিক

      কলিং এক্সটেনশনের কন্টেন্ট স্ক্রিপ্টের প্রেক্ষাপটে এক্সপ্রেশনটি মূল্যায়ন করুন, যদি কন্টেন্ট স্ক্রিপ্টটি ইতিমধ্যে পরিদর্শন করা পৃষ্ঠায় ইনজেক্ট করা থাকে। অন্যথায়, এক্সপ্রেশনটি মূল্যায়ন করা হয় না এবং কলব্যাকটি এমন একটি অবজেক্টে এক্সেপশন প্যারামিটার সেট করে আহ্বান করা হয়, যার isError ফিল্ডটি true এবং code ফিল্ডটি E_NOTFOUND এ সেট করা থাকে।

  • কলব্যাক

    ফাংশন ঐচ্ছিক

    callback প্যারামিটারটি দেখতে এইরকম: 

    (response: object) => void

    • প্রতিক্রিয়া

      বস্তু

      বিচারাধীন

      মূল্যায়নের ফলাফল এবং ব্যতিক্রমী তথ্য।

      • ব্যতিক্রম তথ্য

        বস্তু

        এক্সপ্রেশনটি মূল্যায়ন করার সময় কোনো ব্যতিক্রম ঘটলে, তার বিবরণ প্রদানকারী একটি অবজেক্ট।

        • কোড

          স্ট্রিং

          এক্সপ্রেশনটি মূল্যায়ন করার আগে ডেভটুলস-এর দিকে ত্রুটি ঘটলে এটি সেট করুন।

        • বর্ণনা

          স্ট্রিং

          এক্সপ্রেশনটি মূল্যায়ন করার আগে ডেভটুলস-এর দিকে ত্রুটি ঘটলে এটি সেট করুন।

        • বিস্তারিত

          যেকোনো[]

          এক্সপ্রেশনটি মূল্যায়ন করার আগে ডেভটুলস-এর দিকে ত্রুটি ঘটলে, এটি সেট করা হয় এবং এতে এমন মানগুলির একটি অ্যারে থাকে যা ত্রুটির কারণ সম্পর্কে আরও তথ্য প্রদানের জন্য বিবরণ স্ট্রিং-এ প্রতিস্থাপন করা যেতে পারে।

        • ত্রুটি

          বুলিয়ান

          এক্সপ্রেশনটি মূল্যায়ন করার আগে ডেভটুলস-এর দিকে ত্রুটি ঘটলে এটি সেট করুন।

        • ব্যতিক্রম

          বুলিয়ান

          মূল্যায়ন করা কোডটি কোনো অনিয়ন্ত্রিত ব্যতিক্রম তৈরি করলে এটি সেট করা হয়।

        • মূল্য

          স্ট্রিং

          মূল্যায়ন করা কোডটি কোনো অনিয়ন্ত্রিত ব্যতিক্রম তৈরি করলে এটি সেট করা হয়।

      • ফলাফল

        বস্তু

        মূল্যায়নের ফলাফল।

ফেরত

  • প্রতিশ্রুতি<object>

    বিচারাধীন

    মূল্যায়ন সম্পন্ন হলে এই ফাংশনটি কল করা হয়।

    প্রমিস শুধুমাত্র ম্যানিফেস্ট ভি৩ এবং এর পরবর্তী সংস্করণগুলোতে সমর্থিত, অন্যান্য প্ল্যাটফর্মে কলব্যাক ব্যবহার করতে হবে।

getResources()

প্রতিশ্রুতি
chrome.devtools.inspectedWindow.getResources(
  callback?: function,
): Promise<Resource[]>

পরিদর্শন করা পৃষ্ঠা থেকে রিসোর্সসমূহের তালিকা পুনরুদ্ধার করে।

প্যারামিটার

  • কলব্যাক

    ফাংশন ঐচ্ছিক

    callback প্যারামিটারটি দেখতে এইরকম: 

    (resources: Resource[]) => void

    • সম্পদ

      সম্পদ []

      পৃষ্ঠাটির মধ্যে থাকা সম্পদসমূহ।

ফেরত

  • প্রতিশ্রুতি< সম্পদ []>

    বিচারাধীন

    একটি ফাংশন যা অনুরোধটি সম্পূর্ণ হলে রিসোর্সগুলোর তালিকা গ্রহণ করে।

    প্রমিস শুধুমাত্র ম্যানিফেস্ট ভি৩ এবং এর পরবর্তী সংস্করণগুলোতে সমর্থিত, অন্যান্য প্ল্যাটফর্মে কলব্যাক ব্যবহার করতে হবে।

reload()

chrome.devtools.inspectedWindow.reload(
  reloadOptions?: object,
): void

পরিদর্শন করা পৃষ্ঠাটি পুনরায় লোড করে।

প্যারামিটার

  • পুনরায় লোড করার বিকল্প

    বস্তু ঐচ্ছিক

    • উপেক্ষা করুন

      বুলিয়ান ঐচ্ছিক

      যখন এটি 'true' হয়, তখন লোডার load ইভেন্টটি ফায়ার হওয়ার আগে লোড হওয়া সমস্ত ইন্সপেক্টেড পেজ রিসোর্সের জন্য ক্যাশে বাইপাস করবে। এর প্রভাব ইন্সপেক্টেড উইন্ডোতে বা ডেভেলপার টুলস উইন্ডোর মধ্যে Ctrl+Shift+R চাপার অনুরূপ।

    • ইনজেক্টেডস্ক্রিপ্ট

      স্ট্রিং ঐচ্ছিক

      নির্দিষ্ট করা থাকলে, স্ক্রিপ্টটি পরিদর্শন করা পৃষ্ঠার প্রতিটি ফ্রেমে লোড হওয়ার সাথে সাথেই, ফ্রেমের অন্য যেকোনো স্ক্রিপ্টের আগে ইনজেক্ট করা হবে। পরবর্তী রিলোডের পর স্ক্রিপ্টটি ইনজেক্ট করা হবে না—উদাহরণস্বরূপ, যদি ব্যবহারকারী Ctrl+R চাপেন।

    • ব্যবহারকারী এজেন্ট

      স্ট্রিং ঐচ্ছিক

      নির্দিষ্ট করা হলে, স্ট্রিংটি পরিদর্শিত পৃষ্ঠার রিসোর্স লোড করার সময় পাঠানো User-Agent HTTP হেডারের মানকে ওভাররাইড করবে। স্ট্রিংটি পরিদর্শিত পৃষ্ঠার মধ্যে চলমান যেকোনো স্ক্রিপ্টে ফেরত পাঠানো navigator.userAgent প্রপার্টির মানকেও ওভাররাইড করবে।

ইভেন্টগুলি

onResourceAdded

chrome.devtools.inspectedWindow.onResourceAdded.addListener(
  callback: function,
)

পরিদর্শিত পৃষ্ঠায় কোনো নতুন রিসোর্স যুক্ত করা হলে এটি কার্যকর হয়।

প্যারামিটার

  • কলব্যাক

    ফাংশন

    callback প্যারামিটারটি দেখতে এইরকম: 

    (resource: Resource) => void

onResourceContentCommitted

chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(
  callback: function,
)

যখন রিসোর্সটির কোনো নতুন সংস্করণ কমিট করা হয় (যেমন, ব্যবহারকারী ডেভেলপার টুলস-এ রিসোর্সটির একটি সম্পাদিত সংস্করণ সংরক্ষণ করেন), তখন এটি কার্যকর হয়।

প্যারামিটার

  • কলব্যাক

    ফাংশন

    callback প্যারামিটারটি দেখতে এইরকম: 

    (resource: Resource, content: string) => void

    • সম্পদ

      সম্পদ

    • বিষয়বস্তু

      স্ট্রিং