jquery loop

PHPportalen Forum Index » HTML/CSS/JavaScript/Design
Lägg ett bokmärke på hela tråden
Skapa nytt inlägg   Svara på inlägget
Visa föregående ämne :: Visa nästa ämne  
Startad av: Meddelande
Biasse



Medlem i: 5735 dagar

Status: Offline



#742442
Inlägg Skrivet: 2019-01-17 16:12      Ämne: jquery loop Citera

Jag försöker göra en länk funktion och den fungerar när det finns 1st länk i texten men är det två går det inte. Den tar endast den första så jag behöver loopa igenom texten i 'mess' men jag har inte en susning om hur jag ska göra. Några förslag? Cool

KOD:
1:
 
2:
var mess = $('#mess').val(); // Hämtar textarean
3:
 
4:
if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
5:
{
6:
  var between = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
7:
   var between = '<a target="_blank" href="http://' + between + '">' + between + '</a>'; // Bygger länken
8:
  var before = mess.split('<url>')[0]; // All text före <url>
9:
  var after = mess.split('</url>')[1]; // All text efter </url>
10:
   var mess = before + between + after; // Retur   
11:
}
12:
 
 
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
harald_b
Moderator



Medlem i: 4715 dagar
Från: Tavesta
Status: Offline



#742443
Inlägg Skrivet: 2019-01-19 00:15      Ämne: Citera

Är det meningen att användaren skall kunna mata in HTML-kod?
Sådant kan ju i många fall användas för att hacka sidan.

Är det meningen att url:en skall anges UTAN http:// ?
Det är problematiskt av två skäl:
- När du kopierar eller matar in en url så kommer den normalt innehålla protokoll och kolon.
- För webbadresser är det normala https och inte http nu för tiden.

Eftersom det här med html-kod kan vara ganska känsligt så hade jag nog hellre löst det med programkod på servern som inte kan manipuleras av besökaren, istället.
 

_________________
R.r - Ett fritt affärssystem
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
Biasse



Medlem i: 5735 dagar

Status: Offline



#742444
Inlägg Skrivet: 2019-01-19 10:23      Ämne: re: Citera

Jag använder denna kod när det ska sparas i mysql

KOD:
1:
 
2:
$link = preg_replace('!((?:www|http://)[^ ]+)!', '<a href="$1" target="_blank">$1</a>', $link);
3:
$link = str_replace("href=\"www.","href=\"http://www.",$link);
4:
 


Det jag försöker nu är att få fram en förhandsvisning. Jag har <url>länk</url> i textarean och vill omvandla det till en riktig länk och skicka till en div. Problemet jag har är att endast första länken visas rätt men finns det flera länkar faller allt. Det enda jag hittat som kan fungera när jag testar är att ha massa if i koden enligt följande men söker nån loop funktion.

KOD:
1:
 
2:
<script type="text/javascript">
3:
$(document).on('click', '#test', function()
4:
{
5:
    var mess = $('#mess').val();
6:
   
7:
   if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
8:
    {
9:
      var url1 = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
10:
     var mess = mess.replace('<url>' + url1 + '</url>', '<a target="_blank" href="http://' + url1 + '">' + url1 + '</a>');
11:
    
12:
     if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
13:
      {
14:
       var url2 = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
15:
       var mess = mess.replace('<url>' + url2 + '</url>', '<a target="_blank" href="http://' + url2 + '">' + url2 + '</a>');   
16:
      }
17:
     if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
18:
      {
19:
       var url3 = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
20:
       var mess = mess.replace('<url>' + url3 + '</url>', '<a target="_blank" href="http://' + url3 + '">' + url3 + '</a>');   
21:
      }
22:
     if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
23:
      {
24:
       var url4 = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
25:
       var mess = mess.replace('<url>' + url4 + '</url>', '<a target="_blank" href="http://' + url4 + '">' + url4 + '</a>');   
26:
      }
27:
     if (mess.indexOf("<url>") >= 0) // Om <url> finns i mess
28:
      {
29:
       var url5 = mess.split('<url>')[1].split('</url>')[0]; // Allt mellan
30:
       var mess = mess.replace('<url>' + url5 + '</url>', '<a target="_blank" href="http://' + url5 + '">' + url5 + '</a>');   
31:
      }
32:
   } 
33:
    alert(mess);   
34:
});
35:
</script>
36:
 
 
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
harald_b
Moderator



Medlem i: 4715 dagar
Från: Tavesta
Status: Offline



#742445
Inlägg Skrivet: 2019-01-19 17:53      Ämne: Citera

I normalfallet är det olämpligt att använda klientsideskod som skapar html-kod som sedan sparas och kan visas för andra användare. I det läget kan den utnyttjas för att hacka sidan.
Det samma gäller om användaren får mata in html-kod som sparas.
I båda fallen kan man lösa det genom att nogsamt verifiera att koden inte innehåller något dumt, eller har skapats av tillräckligt betrodda användare. Men det måste göras på servern där besökaren inte kan manipulera.
Den php-kod du visar innebär inget skydd.

Det är betydligt enklare att skapa html-koden helt och hållet på servern. Då är det enklare att säkerställa att den bara innehåller godkänt innehåll.

Därför kvarstår min första fråga:
Är det meningen att användaren skall kunna mata in vilken html-kod hen vill i textarean?
 

_________________
R.r - Ett fritt affärssystem
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
Biasse



Medlem i: 5735 dagar

Status: Offline



#742446
Inlägg Skrivet: 2019-01-19 18:42      Ämne: Citera

Det som jag gör med input kod är att köra det via mysqli_real_escape_string innan det sparas. Räcker inte det? Just denna fråga gäller endast en förhandsgranskning. Den sparas inte i databasen.
 
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
harald_b
Moderator



Medlem i: 4715 dagar
Från: Tavesta
Status: Offline



#742447
Inlägg Skrivet: 2019-01-19 19:18      Ämne: Citera

mysqli_real_escape_string skyddar inte mot javascriptinjection.
Den avgörande frågan för hur man löser det här är om det är MENINGEN att man skall kunna ange annan html-kod än länkarna ifråga.
Den bästa lösningen för förhandsgranskning är att använda samma kod som skapar den slutliga koden, men så länge inte html-koden visas för någon annan än den som skapar den så går det ju för all del att använda javascript också.

Om vi utgår från att det inte är meningen att kunna ange annan html-kod än <url> så kunde kanske följande fungera:
KOD:
1:
var mess = 'före<url>https://link</url>mellan<url>bbbb</url>efter';
2:
var parsed = '';
3:
 
4:
   
5:
function htmlspecialchars(str) { //Motsvarar php-funktionen med samma namn
6:
return str.replace(/\&/g,'&amp;').replace(/\"/g,'&quot;').replace(/\</g,'&lt;').replace(/\>/g,'&gt;');
7:
}
8:
 
9:
 
10:
while(mess.length) {
11:
   var a = mess.match(/^([\d\D]*?)<url>([\d\D]*)$/m);
12:
   if(a) {
13:
      parsed += htmlspecialchars(a[1]);
14:
      var b = a[2].match(/^([\d\D]*?)<\/url>([\d\D]*)$/m);
15:
      if(b) {
16:
         if(b[1].match(/^https?\:\/\/\S+$/)) parsed += '<a href="'+htmlspecialchars(b[1])+'" target="_blank">'+htmlspecialchars(b[1])+'</a>';
17:
         else parsed += '<strong>Ogiltig länk!</strong>';
18:
         mess = b[2];
19:
      }
20:
      else {
21:
         parsed += '<p><strong>Avslutande $lt;/url&gt; saknas!</strong></p>';
22:
         mess = '';
23:
      }
24:
   }
25:
   else {
26:
      parsed += htmlspecialchars(mess);
27:
      mess = '';
28:
   }
29:
}
30:
 
31:
console.log(parsed);
32:
 

Koden kan säkert förfinas för att fånga upp fler tänkbara fel.

EDIT:
En elegantare lösning är kanske att använda html DOM istället:

KOD:
1:
var mess = 'före<url>https://link</url>mellan<url>bbbb</url>efter';
2:
 
3:
var element = document.createElement('div');
4:
 
5:
while(mess.length) {
6:
   var a = mess.match(/^([\d\D]*?)<url>([\d\D]*)$/m);
7:
   if(a) {
8:
      element.appendChild(document.createTextNode(a[1]));
9:
      var b = a[2].match(/^([\d\D]*?)<\/url>([\d\D]*)$/m);
10:
      if(b) {
11:
         if(b[1].match(/^https?\:\/\/\S+$/)) {
12:
            var a = element.appendChild(document.createElement('a'));
13:
            a.href = b[1];
14:
            a.target ='_blank';
15:
            a.textContent = b[1];
16:
         }
17:
         else element.appendChild(document.createElement('strong')).textContent = 'Ogiltig länk!';
18:
         mess = b[2];
19:
      }
20:
      else {
21:
         element.appendChild(document.createElement('strong')).textContent = 'Avslutande </url> saknas!';
22:
         mess = '';
23:
      }
24:
   }
25:
   else {
26:
      element.appendChild(document.createTextNode(mess));
27:
      mess = '';
28:
   }
29:
}
30:
 
31:
console.log(element.innerHTML);


EDIT 2:
Fixade regexp att klara multiline
 

_________________
R.r - Ett fritt affärssystem
Till toppen på sidan
Visa användarprofil Skicka privat meddelande
Visa tidigare inlägg:   
Skapa nytt inlägg   Svara på inlägget
PHPportalen Forum Index » HTML/CSS/JavaScript/Design
Hoppa till:  
Du kan inte skapa nya inlägg i det här forumet
Du kan inte svara på inlägg i det här forumet
Du kan inte ändra dina inlägg i det här forumet
Du kan inte ta bort dina inlägg i det här forumet
Du kan inte rösta i det här forumet
Du kan inte bifoga filer i detta forum
Du kan inte ladda ner filer från detta forum
Kontakta oss på adressen: info@phpportalen.net
Webbplatsen bygger i grunden på phpBB © 2001, 2002 phpBB Group

Modifieringar har senare gjorts i systemet av PHPportalen
Sid och logotypdesign skapad av Daren Jularic