Menangani pelanggaran kode yang dihosting dari jarak jauh

Kode yang dihosting dari jarak jauh, atau RHC, adalah apa yang disebut Chrome Web Store apa pun yang dijalankan oleh browser yang dimuat dari tempat selain file ekstensi itu sendiri. Hal-hal seperti JavaScript dan WASM. Tabel ini tidak menyertakan data atau hal-hal seperti JSON atau CSS.

Mengapa RHC tidak lagi diizinkan?

Dengan ekstensi Manifes V3, kini ekstensi harus memaketkan semua kode yang digunakan di dalamnya ekstensi itu sendiri. Sebelumnya, Anda bisa memasukkan tag skrip secara dinamis dari URL apa pun di web.

Saya diberi tahu bahwa ekstensi saya memiliki RHC. Apa yang terjadi?

Jika ekstensi Anda ditolak selama peninjauan dengan error Blue Argon, peninjau kami yakin bahwa ekstensi Anda menggunakan kode yang dihosting dari jarak jauh. Ini adalah biasanya hasil dari ekstensi yang mencoba menambahkan tag skrip dengan {i>remote<i} (yaitu dari web terbuka, bukan file yang disertakan dalam ekstensi), atau mengambil resource untuk dijalankan secara langsung.

Cara menemukan RHC

Menemukan RHC tidak terlalu sulit setelah Anda tahu apa yang harus dicari. Pertama, periksa string "http://" atau "https://" dalam proyek Anda. Anda memiliki pelanggaran RHC, maka Anda mungkin dapat menemukannya dengan menemukan hal itu. Jika Anda memiliki sistem build lengkap, atau gunakan dependensi dari npm atau sumber pihak ketiga, pastikan Anda menelusuri versi kode yang dikompilasi, karena hal itulah yang sedang dievaluasi oleh toko. Jika Anda masih tidak dapat menemukan masalah, maka langkah berikutnya adalah menghubungi Dukungan Terpadu. Mereka akan dapat menguraikan pelanggaran yang spesifik, dan apa yang dibutuhkan untuk mendapatkan ekstensi dipublikasikan sesegera mungkin.

Apa yang harus dilakukan jika library meminta kode

Terlepas dari dari mana kode itu berasal, ia tidak diperbolehkan memiliki RHC. Ini menyertakan kode yang tidak Anda tulis, tetapi kebetulan digunakan sebagai dependensi di proyek. Beberapa developer yang menggunakan Firebase mengalami masalah ini saat bekerja jarak jauh kode telah disertakan untuk digunakan dalam Firebase Auth. Meskipun ini adalah library pihak pertama (milik Google), tidak ada pengecualian untuk RHC. Anda perlu untuk mengkonfigurasi kode baik untuk menghapus RHC atau memperbarui poject Anda agar menyertakan kode untuk memulainya. Jika mengalami masalah yang bukan kode Anda yang memuat RHC, tetapi {i>library<i} yang Anda gunakan, maka jalan terbaik dari tindakannya adalah menghubungi penulis perpustakaan. Beri tahu mereka bahwa ini sedang terjadi, dan minta solusi atau pembaruan kode untuk menghapusnya.

Bagaimana jika Anda tidak bisa menunggu update library

Beberapa library akan mengirimkan update segera setelah diberi tahu, tetapi yang lain mungkin ditinggalkan atau meluangkan waktu untuk mengatasi masalah. Bergantung pada apa yang terjadi pada pelanggaran tertentu, Anda mungkin tidak perlu menunggu berhenti diblokir dan menyelesaikan peninjauan dengan sukses. Ada beberapa opsi yang tersedia untuk kembali aktif dan bekerja dengan cepat.

Mengaudit kode

Apakah Anda yakin bahwa kode yang menyebabkan permintaan diperlukan? Jika dapat dihapus, atau {i>library<i} yang menyebabkannya dapat dihapus, lalu menghapus kode itu, dan pekerjaan selesai.

Atau, apakah ada library lain yang menawarkan fitur yang sama? Coba memeriksa npmjs.com, GitHub, atau situs lain untuk opsi lain yang memenuhi kasus penggunaan yang sama.

Guncangan pohon

Jika kode yang menyebabkan pelanggaran RHC tidak benar-benar digunakan, maka mungkin dapat dihapus secara otomatis dengan menggunakan alat. Alat build modern seperti webpack, Rollup, dan Vite (beberapa di antaranya) memiliki fitur yang disebut tree-shaking. Setelah diaktifkan di sistem build, tree shaking harus menghapus jalur kode yang tidak digunakan. Ini dapat berarti bahwa Anda tidak hanya memiliki yang lebih fleksibel dan lebih cepat. Penting perlu diketahui bahwa tidak semua library dapat di-tree-shaking, tetapi banyak juga yang bisa. Agak besar alat{i> <i}seperti Rollup dan Vite, mengaktifkan {i>tree-shaking<i} secara {i>default<i}. paket web perlu dikonfigurasi untuk dapat diaktifkan. Jika Anda tidak menggunakan build sebagai bagian dari ekstensi Anda, tetapi menggunakan library kode, berarti Anda sangat disarankan untuk menyelidiki penambahan alat build ke alur kerja Anda. Membuat membantu Anda menulis proyek yang lebih aman, andal, dan mudah dikelola.

Detail cara menerapkan {i>treeshake<i} bergantung pada proyek khusus Anda. Namun, untuk contoh sederhana Rollup, Anda dapat menambahkan treeshake hanya dengan mengompilasi kode proyek Anda. Misalnya, jika Anda memiliki file yang hanya masuk ke Firebase Auth, yang disebut 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);
  }
});

Kemudian yang perlu Anda lakukan adalah memberi tahu Rollup file input, {i>plugin<i} yang diperlukan untuk memuat file node @rollup/plugin-node-resolve, dan nama output file yang dihasilkannya.

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

Dengan menjalankan perintah itu di jendela terminal, Anda akan menerima versi yang dibuat dari file main.js, semuanya dikompilasi menjadi satu file bernama compiled.js.

Penggabungan dapat sederhana, tetapi juga sangat dapat dikonfigurasi. Anda bisa menambahkan semua jenis tentang logika dan konfigurasi yang kompleks, cukup lihat dokumentasinya. Menambahkan alat build seperti ini akan menghasilkan kode yang lebih kecil dan efisien, dan dalam hal ini, memperbaiki masalah kode yang dihosting jarak jauh.

Mengedit file secara otomatis

Cara yang makin umum digunakan kode yang dihosting dari jarak jauh untuk memasuki codebase Anda adalah sebagai subdepenensi dari perpustakaan yang Anda sertakan. Jika library X ingin import library Y dari CDN, maka Anda tetap perlu memperbaruinya untuk membuat yang dimuat dari sumber lokal. Dengan sistem pembangunan modern, Anda dapat dengan mudah membuat plugin untuk mengekstrak referensi jarak jauh, dan menyisipkannya langsung ke dalam kode.

Itu berarti kode yang diberikan akan terlihat seperti ini:

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

Anda dapat membuat {i>plugin<i} penggabungan kecil.

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
    }
  }]
};

Setelah Anda menjalankan build dengan plugin baru, setiap URL import jarak jauh akan ditemukan, terlepas dari apakah itu kode kita, subdependensi, subdependensi, atau di mana pun.

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

Mengedit file secara manual

Pilihan paling sederhana adalah menghapus kode yang menyebabkan RHC. Buka di editor teks pilihan Anda, dan menghapus baris yang melanggar. Ini umumnya adalah tidak disarankan, karena rapuh dan bisa terlupakan. Membuat mempertahankan proyek Anda lebih keras ketika file bernama "library.min.js" bukan benar-benar library.min.js. Alih-alih mengedit file mentah, opsi yang dapat dipelihara adalah dengan menggunakan alat seperti patch-package. Ini adalah yang memungkinkan Anda menyimpan modifikasi ke file, bukan file tersebut. Alat ini dibuat pada file patch, serupa dengan mendukung sistem kontrol versi seperti Git atau Subversion. Anda hanya perlu untuk memodifikasi secara manual kode yang melanggar, menyimpan file {i>diff<i}, dan {i>patch-package<i} dengan perubahan yang ingin Anda terapkan. Anda dapat membaca tutorial lengkap pada readme project. Jika Anda melakukan patch pada project, kami benar-benar mendorong Anda untuk menghubungi proyek untuk meminta agar perubahan dilakukan ke hulu. Sementara paket {i>patch<i} membuat pengelolaan {i> patch<i} jauh lebih mudah, memiliki tidak ada yang perlu di-patch bahkan lebih baik lagi.

Apa yang harus dilakukan jika kode tidak digunakan

Seiring berkembangnya codebase, dependensi (atau dependensi dari suatu dependensi, atau dependensi dari...) dapat menyimpan jalur kode yang tidak lagi digunakan. Jika salah satu bagian tersebut menyertakan kode untuk memuat atau mengeksekusi RHC, maka RHC ini harus harus dihapus. Ini tidak masalah apakah komputer itu mati atau tidak terpakai. Jika tidak sedang digunakan seharusnya dihapus, baik dengan treeshaing, maupun mem-patch library untuk menghapusnya.

Apakah ada cara alternatif?

Secara umum, tidak. RHC tidak diizinkan. Namun, ada sejumlah kecil kasus yang diizinkan. Hampir selalu terjadi kasus di mana tidak mungkin dilakukan pada pilihan lain.

API Skrip Pengguna

Skrip Pengguna adalah cuplikan kode kecil yang biasanya disediakan oleh ditujukan untuk pengelola Skrip Pengguna seperti TamperMonkey dan monyet yang melakukan kekerasan. Pengelola ini tidak mungkin memaketkan kode yang ditulis oleh pengguna, sehingga User Script API mengekspos cara untuk mengeksekusi kode yang disediakan oleh pengguna. Ini bukan pengganti chrome.scripting.executeScript, atau lingkungan eksekusi kode lainnya. Pengguna harus mengaktifkan mode developer untuk menjalankan apa pun. Jika Chrome Web Store Tim peninjau toko berpikir bahwa penyimpanan ini digunakan dengan cara selain dimaksudkan (yaitu kode yang diberikan oleh pengguna), kode itu mungkin ditolak atau listingan dihapus dari Play Store.

chrome.debugger

chrome.debugger API memungkinkan ekstensi berinteraksi dengan Protokol Chrome Devtools. Ini adalah protokol yang sama yang digunakan untuk Devtools Chrome, dan sejumlah alat lainnya yang luar biasa. Dengannya, ekstensi dapat meminta dan mengeksekusi kode jarak jauh. Sama seperti skrip pengguna, pengganti chrome.scripting, dan memberikan pengalaman pengguna yang jauh lebih penting. Saat digunakan, pengguna akan melihat bilah peringatan di bagian atas jendela. Jika banner ditutup atau ditutup, sesi proses debug akan dihentikan.

Screenshot kolom URL di Chrome yang menampilkan pesan 'Debugger Extension started debugging browser ini'

Iframe dengan sandbox

Jika Anda perlu mengevaluasi string sebagai kode, dan berada di lingkungan DOM (mis. skrip konten, berbeda dengan pekerja layanan ekstensi), lalu opsi lain adalah menggunakan frame dengan sandbox. Ekstensi tidak mendukung hal-hal seperti eval() secara default sebagai tindakan pencegahan keamanan. Kode berbahaya dapat membuat keamanan pengguna dan keamanan berisiko. Namun, ketika kode hanya dieksekusi di brankas yang dikenal tertentu, seperti iframe yang telah di-sandbox dari internet, maka risiko-risiko tersebut akan sangat berkurang. Dalam konteks ini, Keamanan Konten Kebijakan yang memblokir penggunaan eval dapat dicabut, sehingga memungkinkan Anda untuk menjalankan kode JavaScript yang valid.

Jika Anda memiliki kasus penggunaan yang tidak tercakup, silakan hubungi tim menggunakan milis chromium-extensions untuk mendapatkan masukan, atau membuka tiket untuk meminta panduan dari Dukungan Terpadu

Yang harus dilakukan jika Anda tidak setuju dengan putusan

Menegakkan kebijakan dapat sedikit berbeda dan peninjauan melibatkan input manual, yang berarti terkadang tim Chrome Web Store mungkin setuju untuk mengubah keputusan peninjauan. Jika Anda yakin bahwa telah ada kekeliruan dalam peninjauan, Anda dapat mengajukan banding atas penolakan menggunakan Layanan Dukungan Terpadu