จัดการกับการละเมิดโค้ดที่โฮสต์จากระยะไกล

โค้ดที่โฮสต์จากระยะไกล หรือ RHC คือสิ่งที่ Chrome เว็บสโตร์เรียก ทำงานโดยเบราว์เซอร์ที่โหลดจากที่อื่นที่ไม่ใช่ ของส่วนขยาย เช่น JavaScript และ WASM ข้อมูลนี้ไม่รวมถึง หรือสิ่งต่างๆ อย่างเช่น JSON หรือ CSS

เหตุใด RHC จึงไม่ได้รับอนุญาตอีกต่อไป

ตอนนี้ส่วนขยาย Manifest V3 ต้องจัดกลุ่มโค้ดทั้งหมดที่ส่วนขยายใช้ไว้ภายใน ของส่วนขยายนั้น ก่อนหน้านี้ คุณสามารถแทรกแท็กสคริปต์แบบไดนามิกจาก URL ใดก็ได้บนเว็บ

มีคนบอกว่าส่วนขยายของฉันมี RHC เกิดอะไรขึ้น

หากส่วนขยายของคุณถูกปฏิเสธระหว่างการตรวจสอบโดยมีข้อผิดพลาดบลูอาร์กอน ระบบจะดำเนินการต่อไปนี้ ผู้ตรวจสอบเชื่อว่าส่วนขยายของคุณกำลังใช้โค้ดที่โฮสต์จากระยะไกล นี่คือ มักเป็นผลมาจากส่วนขยายที่พยายามเพิ่มแท็กสคริปต์ด้วยรีโมต (เช่น จากเว็บแบบเปิด แทนที่จะเป็นไฟล์ที่รวมอยู่ใน ส่วนขยาย) หรือการดึงข้อมูลทรัพยากรเพื่อเรียกใช้โดยตรง

วิธีสังเกต RHC

การสังเกต RHC อาจไม่ใช่เรื่องยากอีกต่อไปเมื่อคุณรู้ว่าควรค้นหาสิ่งใดแล้ว อันดับแรก ตรวจสอบสตริง "http://" หรือ "https://" ในโปรเจ็กต์ของคุณ หากคุณมี การละเมิด RHC คุณมีแนวโน้มที่จะสามารถค้นหาการละเมิดนั้นได้ ถ้า คุณมีระบบบิลด์เต็มรูปแบบ หรือใช้ทรัพยากร Dependency จาก npm หรือเครื่องมือของบุคคลที่สามอื่นๆ ตรวจสอบให้แน่ใจว่าคุณกำลังค้นหาโค้ดในเวอร์ชันคอมไพล์ เพราะเป็นสิ่งที่ร้านค้าจะประเมิน หากคุณยังไม่สามารถ พบปัญหา จากนั้นให้ติดต่อฝ่ายสนับสนุนของ One Stop โฆษณาเหล่านี้ จะระบุการละเมิดที่เฉพาะเจาะจง และสิ่งที่จำเป็นต้องมีเพื่อให้ได้รับ เผยแพร่ส่วนขยายโดยเร็วที่สุด

สิ่งที่ต้องทำหากห้องสมุดขอรหัส

ไม่ว่าโค้ดจะมาจากที่ใดก็ตาม ต้องไม่มี RHC ช่วงเวลานี้ มีโค้ดที่คุณไม่ได้เขียน แต่บังเอิญว่าถูกใช้เป็นทรัพยากร Dependency ใน นักพัฒนาแอปบางรายที่ใช้ Firebase พบปัญหานี้เมื่อทำงานทางไกล มีการรวมโค้ดเพื่อใช้ในการตรวจสอบสิทธิ์ Firebase แม้ว่านี่จะเป็น ไลบรารีของบุคคลที่หนึ่ง (ที่เป็นของ Google) โดยไม่มีข้อยกเว้นสำหรับ RHC คุณต้องมี เพื่อกำหนดค่าโค้ดให้นำ RHC ออกหรืออัปเดตกรณีของคุณเป็น "ไม่" ให้ใส่โค้ดเพื่อเริ่มต้น หากพบปัญหาที่ไม่ใช่โค้ดของคุณ ที่กำลังโหลด RHC แต่ใช้ไลบรารีที่คุณใช้อยู่ วิธีการที่ดีที่สุดคือ การดำเนินการคือการติดต่อผู้แต่งห้องสมุด บอกให้พวกเขารู้ว่ากำลังเกิดขึ้น และขอให้มีวิธีแก้ปัญหาเบื้องต้นหรือการอัปเดตโค้ดเพื่อนำออก

จะเกิดอะไรขึ้นหากคุณรอการอัปเดตไลบรารีไม่ได้

ห้องสมุดบางแห่งจะส่งการอัปเดตเกือบจะทันทีหลังจากได้รับแจ้ง แต่ คนอื่นๆ อาจถูกละทิ้งหรือใช้เวลาในการแก้ปัญหา ขึ้นอยู่กับอะไร เกิดกรณีการละเมิดบางอย่าง คุณอาจไม่จำเป็นต้องรอให้ ย้ายไปยังการเลิกบล็อกและผ่านการตรวจสอบให้เสร็จสมบูรณ์ มีตัวเลือกช่วงวันที่ ตัวเลือกที่พร้อมใช้งานเพื่อให้กลับมาทำงานอีกครั้งได้อย่างรวดเร็ว

ตรวจสอบโค้ด

คุณแน่ใจหรือไม่ว่ารหัสที่ก่อให้เกิดคำขอนั้นจำเป็นหรือไม่ หากทำได้ อาจถูกลบออก หรือไลบรารีที่ทำให้เกิดปัญหานั้นสามารถลบออก จากนั้นลบ โค้ดนั้นก็เสร็จ

มีคลังอื่นที่นำเสนอฟีเจอร์แบบเดียวกันไหม ลอง ตรวจสอบ npmjs.com, GitHub หรือเว็บไซต์อื่นๆ เพื่อหาตัวเลือกอื่นๆ ที่จะตอบสนองความต้องการได้ กรณีการใช้งานเดียวกัน

ต้นไม้สั่นสะเทือน

หากไม่ได้มีการใช้โค้ดที่ทำให้เกิดการละเมิด RHC จริงๆ อาจเป็นเพราะ สามารถลบออกโดยอัตโนมัติได้โดยใช้เครื่องมือ เครื่องมือสร้างที่ทันสมัย เช่น webpack, Rollup และ Vite (ตัวอย่างเล็กๆ น้อยๆ) มีฟีเจอร์ ที่เรียกว่าการเขย่าต้นไม้ เมื่อเปิดใช้การสั่นสะเทือนบนระบบบิลด์แล้ว ควรลบเส้นทางโค้ดที่ไม่ได้ใช้งาน นั่นหมายความว่าคุณไม่เพียงแต่ ที่สอดคล้องกับข้อกำหนดต่างๆ ของคุณ แต่ก็เป็นโค้ดที่เล็กกว่าและเร็วกว่าด้วย มีความสำคัญ โปรดทราบว่าห้องสมุดบางแห่งไม่สามารถสะเทือนต้นไม้ได้ แต่ก็มีหลายแห่ง ใช้บ้าง ของเครื่องมือ เช่น Rollup และ Vite จะมีการเปิดใช้การเขย่าต้นไม้โดยค่าเริ่มต้น Webpack ต้องกำหนดค่าเพื่อเปิดใช้ หากคุณไม่ได้ใช้บิลด์ เป็นส่วนหนึ่งของส่วนขยาย แต่กำลังใช้ไลบรารีโค้ดอยู่ เราขอแนะนำให้คุณตรวจสอบการเพิ่มเครื่องมือสร้างให้กับเวิร์กโฟลว์ รังสรรค์ จะช่วยให้คุณเขียนโปรเจ็กต์ได้อย่างปลอดภัย น่าเชื่อถือ และดูแลรักษาได้มากขึ้น

รายละเอียดเกี่ยวกับวิธีใช้ต้นไม้จะขึ้นอยู่กับโปรเจ็กต์ของคุณ แต่ถ้าต้องการดูตัวอย่างง่ายๆ ด้วย Rollup คุณสามารถเพิ่มการถูต้นไม้ได้ กำลังคอมไพล์รหัสโปรเจ็กต์ เช่น หากคุณมีไฟล์ที่เข้าสู่ระบบ Firebase Auth เรียกว่า main.js ดังนี้

import { GoogleAuthProvider, initializeAuth } from "firebase/auth";

chrome.identity.getAuthToken({ 'interactive': true }, async (token) => {
  const credential = GoogleAuthProvider.credential(null, token);
  try {
    const app = initializeApp({ ... });
    const auth = initializeAuth(app, { popupRedirectResolver: undefined, persistence: indexDBLocalPersistence });
    const { user } = await auth.signInWithCredential(credential)
    console.log(user)
  } catch (e) {
    console.error(error);
  }
});

เพียงแค่บอกให้ Rollup ไฟล์อินพุต ซึ่งเป็นปลั๊กอินที่จำเป็น โหลดไฟล์โหนด @rollup/plugin-node-resolve และชื่อของเอาต์พุต ที่กำลังสร้างขึ้นมา

npx rollup --input main.js --plugin '@rollup/plugin-node-resolve' --file compiled.js

การเรียกใช้คำสั่งดังกล่าวในหน้าต่างเทอร์มินัล คุณจะได้รับเวอร์ชันที่สร้างขึ้น จากไฟล์ main.js ทั้งหมด โดยรวมกันเป็นไฟล์เดียวที่ชื่อ compiled.js

การรวมนี้อาจเป็นเรื่องง่าย แต่กำหนดค่าได้มากด้วย คุณเพิ่มได้ทุกประเภท ของตรรกะและการกำหนดค่าที่ซับซ้อนเพียงแค่ดูเอกสารประกอบ การเพิ่มเครื่องมือสร้างบิลด์เช่นนี้จะทำให้โค้ดมีขนาดเล็กลงและมีประสิทธิภาพมากขึ้น ในกรณีนี้ เราสามารถแก้ปัญหาโค้ดที่โฮสต์จากระยะไกลได้

การแก้ไขไฟล์โดยอัตโนมัติ

วิธีที่นิยมใช้กันมากขึ้นในการที่โค้ดที่โฮสต์จากระยะไกลป้อนฐานของโค้ดคือ เป็นการดำเนินการย่อยของห้องสมุดที่คุณรวมไว้ หากคลัง X ต้องการ คุณจะต้องอัปเดตไลบรารี import Y จาก CDN อีกเพื่อให้ การโหลดข้อมูลมาจากแหล่งที่มาในเครื่อง ด้วยระบบการสร้างที่ทันสมัย คุณสามารถสร้าง เพื่อดึงข้อมูลการอ้างอิงระยะไกลและแทรกในบรรทัดลงในโค้ดโดยตรง

ซึ่งหมายความว่าโค้ดที่ได้รับจะมีลักษณะดังนี้

import moment from "https://unpkg.com/moment@2.29.4/moment.js"
console.log(moment())

คุณสามารถสร้างปลั๊กอินรวมช่องขนาดเล็กได้

import { existsSync } from 'fs';
import fetch from 'node-fetch';

export default {
  plugins: [{
    load: async function transform(id, options, outputOptions) {
      // this code runs over all of out javascript, so we check every import
      // to see if it resolves as a local file, if that fails, we grab it from
      // the network using fetch, and return the contents of that file directly inline
      if (!existsSync(id)) {
        const response = await fetch(id);
        const code = await response.text();

        return code
      }
      return null
    }
  }]
};

เมื่อคุณเรียกใช้บิลด์ด้วยปลั๊กอินใหม่แล้ว URL ระยะไกลทั้งหมดของ import โดยไม่คำนึงว่าจะเป็นโค้ดของเราหรือไม่ เป็นการอ้างอิงย่อย หรือที่อื่นๆ

npx rollup --input main.js --config ./rollup.config.mjs --file compiled.js

การแก้ไขไฟล์ด้วยตนเอง

วิธีที่ง่ายที่สุดคือการลบโค้ดที่ทำให้เกิด RHC เปิดใน โปรแกรมแก้ไขข้อความที่คุณเลือก และลบบรรทัดที่ละเมิด ซึ่งโดยทั่วไปจะ ไม่ได้แนะนำเช่นนั้น เพราะอาจเปราะบางและอาจถูกลืมได้ ทำให้ ดูแลโครงการให้หนักขึ้นเมื่อไฟล์ชื่อ "library.min.js" ไม่ จริงๆ แล้ว library.min.js แทนที่จะแก้ไขไฟล์ RAW สามารถทำได้มากกว่า ตัวเลือกที่บำรุงรักษาได้คือการใช้เครื่องมือ เช่น แพ็กเกจแพตช์ นี่คือซูเปอร์ ตัวเลือกที่มีประสิทธิภาพ ซึ่งจะช่วยให้คุณสามารถบันทึกการแก้ไขลงในไฟล์ แทนที่จะเป็น ของคุณ ที่สร้างขึ้นจากไฟล์แพตช์ ซึ่งเป็นสิ่งที่ ขับเคลื่อนระบบควบคุมเวอร์ชัน เช่น Git หรือ Subversion คุณเพียงแค่ต้อง แก้ไขโค้ดที่ละเมิดด้วยตนเอง บันทึกไฟล์ความแตกต่าง และกำหนดค่า แพตช์ใหม่ที่มีการเปลี่ยนแปลง ที่คุณต้องการใช้ คุณสามารถอ่านบทแนะนำแบบเต็มได้ ใน Readme ของโปรเจ็กต์ หากคุณกำลังแพตช์โปรเจ็กต์ เราต้องการ ขอแนะนำให้คุณติดต่อโครงการดังกล่าวเพื่อขอให้ทำการเปลี่ยนแปลง จากต้นน้ำ แม้ว่าแพตช์แพ็กเกจจะทำให้การจัดการแพตช์ง่ายขึ้น ยังไม่มีอะไรที่ปรับปรุงให้ดีขึ้นได้

สิ่งที่ต้องทำหากยังไม่ได้ใช้รหัส

เมื่อโค้ดเบสเพิ่มขึ้น ทรัพยากร Dependency (หรือทรัพยากร Dependency ของ Dependency หรือการเพิ่มขึ้น) ของ...) สามารถเก็บเส้นทางโค้ดที่ไม่ได้ใช้งานแล้ว หากส่วนใดส่วนหนึ่ง มีโค้ดที่จะโหลดหรือเรียกใช้ RHC ระบบก็จะต้องนำโค้ดนั้นออก ทั้งนี้ โดยไม่สำคัญว่าแบตเตอรี่หมดหรือไม่ได้ใช้งาน หากไม่มีการใช้งานปุ่มดังกล่าว ด้วยการทำลายต้นไม้ หรือทำการแพตช์ไลบรารีเพื่อนำออก

มีวิธีแก้ปัญหาเบื้องต้นไหม

โดยทั่วไปแล้ว ไม่เป็นไร ไม่อนุญาตให้ใช้ RHC อย่างไรก็ตาม มีช่องทำเครื่องหมาย กรณีที่มีการอนุญาต ซึ่งมักจะใช้กับกรณีต่อไปนี้ สำหรับตัวเลือกอื่นๆ

API สคริปต์ของผู้ใช้

สคริปต์ผู้ใช้คือข้อมูลโค้ดสั้นๆ ที่มักกำหนดโดยแท็ก สำหรับผู้ใช้ มีไว้สำหรับผู้จัดการสคริปต์ของผู้ใช้ เช่น TamperMonkey และ Commonmonkey ผู้จัดการเหล่านี้ไม่สามารถจับกลุ่มโค้ดที่ เขียนโดยผู้ใช้ ดังนั้น User Script API จะแสดงวิธีเรียกใช้โค้ด ที่ได้รับจากผู้ใช้ เครื่องมือนี้ไม่ได้ใช้แทน chrome.scripting.executeScript หรือสภาพแวดล้อมการเรียกใช้โค้ดอื่นๆ ผู้ใช้ต้องเปิดใช้โหมดนักพัฒนาซอฟต์แวร์เพื่อให้คำสั่งทุกอย่างได้ หาก Chrome Web ทีมตรวจสอบร้านค้าคิดว่ามีการใช้อีเมลนี้ในลักษณะอื่นที่ไม่ใช่ ที่มีไว้สำหรับ (โค้ดที่ผู้ใช้ระบุ) โค้ดอาจถูกปฏิเสธหรือ ที่ถูกลบออกจาก Store

chrome.debugger

chrome.debugger API ช่วยให้ส่วนขยายโต้ตอบกับ โปรโตคอลเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome ซึ่งเป็นโปรโตคอลเดียวกับที่ใช้สำหรับ เครื่องมือสำหรับนักพัฒนาเว็บของ Chrome และเครื่องมืออื่นๆ มากมาย ดังนั้น ส่วนขยายสามารถขอและเรียกใช้โค้ดระยะไกลได้ เช่นเดียวกับสคริปต์ของผู้ใช้ มาแทน chrome.scripting และทำให้ประสบการณ์ของผู้ใช้โดดเด่นขึ้นมาก ขณะที่ใช้งาน ผู้ใช้จะเห็นแถบคำเตือนที่ด้านบนของ หากแบนเนอร์ปิดไปหรือปิดไป เซสชันการแก้ไขข้อบกพร่องจะ สิ้นสุดลง

วันที่ ภาพหน้าจอของแถบที่อยู่ใน Chrome ที่มีข้อความ "ส่วนขยายโปรแกรมแก้ไขข้อบกพร่องเริ่มแก้ไขข้อบกพร่องของเบราว์เซอร์นี้"
ภาพหน้าจอของแถบที่อยู่ใน Chrome ที่มีข้อความ "ส่วนขยายโปรแกรมแก้ไขข้อบกพร่องเริ่มแก้ไขข้อบกพร่องของเบราว์เซอร์นี้"

iframe ที่แซนด์บ็อกซ์

หากคุณต้องการประเมินสตริงเป็นโค้ด และอยู่ในสภาพแวดล้อม DOM (เช่น สคริปต์เนื้อหา แทนที่จะเป็นโปรแกรมทำงานของบริการส่วนขยาย) แล้วเลือกตัวเลือกอื่น คือการใช้ iframe แซนด์บ็อกซ์ ส่วนขยายไม่รองรับการดำเนินการต่อไปนี้ eval() โดยค่าเริ่มต้นเพื่อเป็นการป้องกันความปลอดภัย โค้ดที่เป็นอันตรายอาจทำให้ผู้ใช้ปลอดภัย และเกิดความเสี่ยงด้านความปลอดภัย แต่เมื่อโค้ดถูกเรียกใช้เฉพาะในเซฟที่รู้จัก เช่น iframe ที่ทำแซนด์บ็อกซ์ จากส่วนอื่นๆ ในอินเทอร์เน็ต ความเสี่ยงเหล่านั้นจะลดลงอย่างมาก ในบริบทนี้ ความปลอดภัยของเนื้อหา คุณสามารถยกเลิกนโยบายที่บล็อกการใช้ eval ได้ ซึ่งช่วยให้คุณเรียกใช้ โค้ด JavaScript ถูกต้อง

หากมีกรณีการใช้งานที่ไม่ครอบคลุม โปรดติดต่อทีมดังกล่าว ใช้รายชื่ออีเมล chromium-extensions เพื่อรับความคิดเห็น หรือเปิด คำขอคำแนะนำจากฝ่ายสนับสนุนแบบครบวงจร

สิ่งที่ต้องทำหากไม่เห็นด้วยกับผลการตัดสิน

การบังคับใช้นโยบายอาจมีความละเอียดอ่อน และต้องมีการตรวจสอบด้วยการป้อนข้อมูลด้วยตนเอง ซึ่งหมายความว่า บางครั้งทีม Chrome เว็บสโตร์อาจตกลงที่จะเปลี่ยนแปลงการตัดสินเกี่ยวกับรีวิว ถ้า คุณเชื่อว่ามีการตรวจสอบความผิดพลาด คุณสามารถอุทธรณ์การปฏิเสธได้ โดยใช้การสนับสนุนแบบครบวงจร