Ember.js: Di mana `Ember.Handbars.Utils.escapeExpression` di sistem modul @ember?

Dibuat pada 13 Jul 2018  ·  18Komentar  ·  Sumber: emberjs/ember.js

Mirip dengan komentar terakhir di #9874, bagaimana seseorang mengakses Ember.Handlebars.Utils.escapeExpression dengan cara modern, tanpa mengimpor semua ember ? Saya perlu keluar dari HTML di aplikasi saya (karena saya mendekorasi beberapa input pengguna dengan markup) sebelum menandainya sebagai htmlSafe() dan tidak dapat menemukan cara untuk melakukannya tanpa menulis fungsi pelolosan saya sendiri atau mengimpor semacam dari addon.

Documentation

Komentar yang paling membantu

Kami membutuhkan ini.

Saat ini Anda perlu salah satu/atau:

@rwjblue berkata:

Menutup ini untuk saat ini. Jika kita perlu menambahkan API ini ke HTMLBars di masa mendatang, itu akan sederhana.

Bagaimana dengan sekarang? Sesuatu yang mungkin yang harus saya ketahui?

Semua 18 komentar

@peabnuts123 Sudahkah Anda menemukan jawaban? Apakah menanyakan hal ini di slack atau forum komunitas ember membantu Anda mendapatkan jawaban atas pertanyaan Anda?

Saya menemukan beberapa dialog pada posting ini, https://medium.com/@bradleyscollins/how -does-one-access-ember-handbars-utils-escapeexpression-ebbe33093186

Tidak, saya tidak pernah menemukan jawaban yang memuaskan, meskipun saya tidak memposting di Slack atau Forum.

Saat ini saya memiliki yang berikut di komponen saya

import Ember from 'ember';
const htmlEscape = Ember.Handlebars.Utils.escapeExpression;

sehingga di masa mendatang saya dapat mengimpor htmlEscape dengan benar dan menghapus baris-baris ini

Ya, tautan yang bagus - Saya telah menemukan utas yang sama dalam perjalanan saya. Saya pikir ide untuk masa depan adalah mengimpornya dari Handlebars secara langsung misalnya

import { htmlEscape } from "Handlebars";

atau serupa. Ini memiliki kelemahan yang disayangkan dari mengandalkan Handlebars untuk mengekspor fungsionalitas ini sendiri melalui modul API, yang menurut saya kami hanya "menunggu" pada saat ini

Mencoba memutakhirkan addon ke versi Ember yang lebih baru, saya menemukan masalah ini.

Karena kita tidak dapat mengandalkan variabel global Ember dan Handlebars bukan modul yang valid, bagaimana kita bisa memigrasikan bagian kode tertentu ini?

import Ember from 'ember';
const htmlEscape = Ember.Handlebars.Utils.escapeExpression;

Kami membutuhkan ini.

Saat ini Anda perlu salah satu/atau:

@rwjblue berkata:

Menutup ini untuk saat ini. Jika kita perlu menambahkan API ini ke HTMLBars di masa mendatang, itu akan sederhana.

Bagaimana dengan sekarang? Sesuatu yang mungkin yang harus saya ketahui?

Apakah ada resolusi tentang ini? Rasanya seperti utilitas klasik untuk orang yang perlu memproses teks.

@rwjblue Ada pendapat? :)

Teman-teman silakan lihat komentar yang menutup PR terkait:

Setelah berdiskusi dengan tim inti hari ini- kami memutuskan untuk tidak melanjutkan PR ini karena Ember tidak menggunakannya secara internal, dan belum cukup lama sekarang- ini selalu merupakan artefak dari Handlebars itu sendiri.

Pekerjaan untuk modul RFC menghapus ekspor ulang non-Ember, dan penulis disarankan untuk mengimpor apa yang mereka butuhkan langsung dari modul non-Ember tertentu (misalnya, rsvp atau jQuery). Ini masih posisi kami.

Jika Anda merasa masih memiliki kasus penggunaan, kirimkan RFC.

Saya senang dengan posisi ini / ini telah menjadi pemahaman saya sepanjang masalah ini.

Jika orang menemukan masalah ini di masa mendatang masih ingin mengakses fungsi ini - Anda perlu mengaksesnya dari paket Handlebars secara langsung. Namun, saya pikir mereka masih belum menyusun paket mereka sebagai modul yaitu Anda mungkin perlu mengimpor semua Handlebars dan kemudian menggunakan Handlebars.Utils.escapeExpression .

import Handlebars from 'handlebars';
import { htmlSafe } from '@ember/template';

let userInput = getUserInput(); // Something unsafe, e.g. user-controlled text
let escapedInput = Handlebars.Utils.escapeExpression(userInput); // Escape any HTML in this string so that it will render as <, & etc.
let alteredHtml = escapedInput.replace(/hello/g, '<span class="highlight">hello</span>'); // Add some HTML to the text
let safeHtml = htmlSafe(alteredHtml);

// safeHtml is now safe to render in the DOM

@MelSumner

Ember tidak menggunakannya secara internal

Jadi saya mengerti masalah ini adalah 100% upstream. Karena penasaran, apakah ada hal serupa yang dapat dilakukan hanya dengan menggunakan utilitas Ember?

@Redsandro

Sesuatu seperti ini harus bekerja:

// your-app/utils/misc.js

import { isHTMLSafe } from '@ember/template';

const ESCAPE = {
  '&': '&amp;',
  '<': '&lt;',
  '>': '&gt;',
  '"': '&quot;',
  "'": '&#x27;',
  '`': '&#x60;',
  '=': '&#x3D;',
};

const BAD_CHARS = /[&<>"'`=]/g;
const POSSIBLE = /[&<>"'`=]/;

let escapeChar = function(chr) {
  return ESCAPE[chr];
};

// borrowed from Handlebars.utils.escapeexpression
// https://github.com/emberjs/ember.js/pull/18791
let escapeExpression = function(string) {
  if (typeof string !== 'string') {
    // don't escape SafeStrings, since they're already safe
    if (string && isHTMLSafe(string)) {
      return string.toHTML(); // private API, since SafeString isn't public
    } else if (string === null) {
      return '';
    } else if (!string) {
      return String(string);
    }

    // Force a string conversion as this will be done by the append regardless and
    // the regex test will do this transparently behind the scenes, causing issues if
    // an object's to string has escaped characters in it.
    string = String(string);
  }

  if (!POSSIBLE.test(string)) {
    return string;
  }

  return string.replace(BAD_CHARS, escapeChar);
};

export { escapeExpression as escape };

Bagaimana dengan menggunakan paket khusus untuk ini?

  • sanitize-html mendukung keluar dari tag yang tidak diizinkan

  • dompurify (sangat mirip dengan sanitize-html) memungkinkan Anda untuk menyimpan beberapa tag atau atribut, atau menghapus html yang tidak diinginkan sambil membiarkan konten di tempatnya, di antara banyak hal lainnya. Saya menggunakan dompurify di emberobserver untuk hanya mengizinkan tag tertentu dirender di addon READMEs dan untuk memastikan semua tautan menerapkan rel .

@kategengler Itu juga saran yang bagus, tapi saya rasa mereka tidak melakukan interop dengan SafeString di Ember. Tidak diperlukan untuk semua kasus penggunaan.

SafeString adalah string yang ditandai sebagai aman oleh pengguna, tidak melakukan pelolosan sendiri, dan tidak memiliki harapan apa pun yang telah diloloskan, jika ada. Anda dapat menggunakan perpustakaan melarikan diri yang Anda suka. Seperti yang dikatakan @MelSumner , Ember tidak lagi menggunakan fungsi pelolosan secara internal.

@pzuraq Ya, tetapi bukankah perpustakaan yang melarikan diri perlu tahu apakah string adalah string aman atau tidak? Untuk mengetahui apakah harus, atau tidak, menghindari mereka?

Dan sepertinya saya menyukai kelas SafeString itu sendiri, ditambah metode toHTML bersifat pribadi.

Ini bukan masalah besar + Saya tidak keberatan menggunakan API pribadi (atau mungkin mereka tidak bersifat pribadi adalah kesalahpahaman saya), tetapi bagi saya sepertinya menjadikannya publik akan membantu dalam hal yang disebutkan di atas.

@sandstrom Saya tidak berpikir bahwa htmlSafe API dimaksudkan untuk dibuka, dan jelas tidak bermutasi. Pemahaman saya adalah bahwa itu dimaksudkan untuk hanya digunakan di _Edge_ negara Anda, jadi setelah Anda benar-benar siap untuk memasukkan string ke DOM di suatu tempat.

Aku akan memeriksa untuk melihat tentang itu. FWIW, ada juga diskusi untuk memiliki htmlSafe API baru, yang memiliki beberapa manfaat lain (misalnya, Anda mungkin ingin dapat melakukan pemeriksaan tipe (eq '' someHtmlSafeString) ), jadi mungkin kemampuan untuk membuka dan membungkus ulang string dapat ditambahkan di masa mendatang jika saya benar tentang API saat ini.

@pzuraq Baiklah, saya senang dengan itu! 😄

Ini sama sekali bukan masalah besar dalam aplikasi kami, jadi semuanya baik-baik saja.

Selamat berakhir pekan & terima kasih untuk semua pekerjaan luar biasa yang Anda (dan orang lain) lakukan di Ember! 🏅

(untuk referensi, ini PR saya tentang membuat escapeExpression publik https://github.com/emberjs/ember.js/pull/18791

Apakah halaman ini membantu?
0 / 5 - 0 peringkat