wysihtml5. hình ảnh src và href bị tước

Question

Tôi đang sử dụng trình soạn thảo wysiwtml5 wysiwyg.

Vấn đề là thuộc tính src hình ảnh và thuộc tính liên kết href bị tước khỏi html. Tại máy chủ tôi đã nhận được html bị tước.

Làm cách nào để khắc phục sự cố này?

Tôi đang sử dụng advanced.js rulest. Với tất cả các quy tắc.

Editor

CẬP NHẬT 1

Vâng editor.getValue và jquery().val() for textarea cho cùng một giá trị vào mẫu nộp. có nghĩa là biểu mẫu đó phải được gửi chính xác.

Nhưng tôi đã xem yêu cầu POST được gửi từ trình duyệt. và không có URL. Có gì đó không đúng.

CẬP NHẬT 2

Nếu tôi loại bỏ tất cả mọi thứ từ ruleset kết nối với img, tuy nhiên nó hoạt động inproperly.

CẬP NHẬT 3

Để đối phó với Marrowmaw nhận xét.

Tôi đang mong đợi:

<a href="http://domain.com/" title="Link: http://domain.com">Link</a> 

Nhưng tôi nhận được

<a href="" title="Link: Null">Link</a> 

CẬP NHẬT 4

<div id="wysihtml5-toolbar" style="display: none;"> 
     <button class="btn" data-wysihtml5-command="bold"> 
     {{ "Bold"|trans }} 
     </button> 
     <button class="btn" data-wysihtml5-command="italic"> 
     {{ "Italic"|trans }} 
     </button> 
     <button class="btn" data-wysihtml5-command="createLink"> 
     {{ "Link"|trans }}/{{ "Unlink"|trans }} 
     </button> 
     <button class="btn" data-wysihtml5-command="insertUnorderedList"> 
     * 
     </button> 
     <button class="btn" data-wysihtml5-command="insertOrderedList"> 
     1,2,3 
     </button> 
     <button class="btn" data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h1"> 
     {{ "Heading"|trans }} 
     </button> 
     <button class="btn" data-wysihtml5-command="insertImage"> 
     {{ "Image"|trans }} 
     </button> 

     <div data-wysihtml5-dialog="createLink" style="display: none;"> 
      <label> 
      {{ "Link"|trans }}: 
      <input data-wysihtml5-dialog-field="href" value="http://"> 
      </label> 
      <a data-wysihtml5-dialog-action="save">{{ "Save"|trans }}</a>&nbsp;<a data-wysihtml5-dialog-action="cancel">{{ "Cancel"|trans }}</a> 
     </div> 
      <!-- Dialog --> 
     <div data-wysihtml5-dialog="insertImage" style="display: none;"> 
      <label> 
      URL: <input data-wysihtml5-dialog-field="src" value="http://"> 
      </label> 
      <label> 
      Alternative text: <input data-wysihtml5-dialog-field="alt" value=""> 
      </label> 
      <label> 
       {{ "Align"|trans }}: 
       <select data-wysihtml5-dialog-field="className"> 
        <option value="">{{ "default"|trans }}</option> 
        <option value="wysiwyg-float-left">{{ "left"|trans }}</option> 
        <option value="wysiwyg-float-right">{{ "right"|trans }}</option> 
       </select> 
      </label> 
      <a data-wysihtml5-dialog-action="save">{{ "Save"|trans }}</a>&nbsp;<a data-wysihtml5-dialog-action="cancel">{{ "Cancel"|trans }}</a> 
     </div> 
     </div> 
     <form action="{{ path('###_save_homepage') }}" method="POST" > 
     <textarea id="wysihtml5-textarea" placeholder="{{ "Enter your text"|trans }}..." autofocus name="homepage" style="width:700px;height:400px;">   
      {{ homepage|raw }}   
     </textarea> 
     <input type="submit" value="{{ "Save"|trans }}" class="btn" /> 
    </form> 

Và JS init:

<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    var editor = new wysihtml5.Editor("wysihtml5-textarea", { // id of textarea element 
      toolbar:  "wysihtml5-toolbar", // id of toolbar element 
      parserRules: wysihtml5ParserRules // defined in parser rules set 
     });  

    }); 

</script> 

Answer 1

Hãy thử xem tập tin wysihtml5-x.x.x.js mà bạn đang tham khảo.

Họ đã quyết định rằng họ sẽ chỉ cho phép URL tuyệt đối (trong tên bảo vệ chống lại XSS). Mã dưới đây về cơ bản cho phép bạn lấy bất kỳ giá trị nào nếu bạn cảm thấy thoải mái với giao dịch đó.

Ctrl-F cho "var attributeCheckMethods" và thực hiện những thay đổi sau - source:

var attributeCheckMethods = { 
url: (function() { 
    /*var REG_EXP = /^https?:\/\//i;*/ 
    return function(attributeValue) { 
    /*if (!attributeValue || !attributeValue.match(REG_EXP)) { 
     return null;*/ 
    if (!attributeValue) { 
     return ""; 
    } 
    /*return attributeValue.replace(REG_EXP, function(match) { 
     return match.toLowerCase(); 
    });*/ 

    var parser = document.createElement('a'); 
    parser.href = attributeValue; 

    if ( parser.protocol == 'http:' 
     || parser.protocol == 'https:' 
     || parser.protocol == 'ftp:' 
    ) return attributeValue; 
    }; 
})(), 

Answer 2

Cách wysihtml5 xác nhận đánh dấu là rõ ràng nghiêm ngặt. Nếu URL hoặc SRC không xác thực, URL hoặc SRC sẽ bị bỏ qua.

Tôi sẽ kiểm tra tệp parser_rules/advanced.js. Bạn có thể xóa, sửa đổi và chỉnh sửa các quy tắc xác thực từng thẻ.