Soo Saaraha Meta Tag & Open Graph oo Bilaash ah

Sida Ay U Shaqeyso

Isku-dhiska calaamadaha oo dhan iyo falanqaynta head-ka waxay si toos ah ka dhacaan biraawsarkaaga — server midna kuma lug lahan. Qalabku wuxuu isticmaalaa useMemo-ga React si firfircoon uga dhisto xarigyo HTML ah iyo API-ga DOMParser ee biraawsarka dabiiciga ah si uu u akhriyo markup-ka bogga hore u jiray sifada soo-gelinta/hubinta.

1. 1
   Gelitaanka foomku wuxuu wadaa isku-dhiska toos ah

   Markaad qorayso, hook useMemo ah ayaa isla markiiba dib u dhisa block-ka calaamadaha oo dhan — cinwaanka, sharraxaadda meta, sifooyinka Open Graph, iyo sifooyinka Twitter Card — isagoo escape-gareynaya xarfaha gaarka ah (&, <, >, ") si wax-soo-saarku ammaan u noqdo in si toos ah HTML lagu dhajiyo.
2. 2
   Xaqiijinta URL-ka via dhisaha URL ee biraawsarka

   Goob URL kasta (URL-ka bogga, sawirka bulshada) waxaa lagu xaqiijiyaa dhisaha URL ee biraawsarka dabiiciga ah. Kaliya ciwaanno http:// ama https:// oo si sax ah loo dhisay oo leh magacyo host dhibco ah ayaa gudbaya; qiyamka aan sax ahayn waxay xannibaan badhanka koobiga waxayna muujiyaan khalad inline ah.
3. 3
   Soo-gelinta: DOMParser wuxuu akhriyaa markup-ka head-ka hore u jiray

   Haddii aad ku dhajiso HTML <head> hore u jiray si aad u hubiso, qalabku wuxuu ka maraa DOMParser habka inert ah — wax scripts ah ma fulinayaan codsiyo shabakadeedna lama sameeyo. Kadibna wuxuu weydiiyaa dukumentiga la falanqeeyay furayaasha meta ee la yaqaan (og:title, twitter:description, canonical link, iwm) wuxuuna hore ugu buuxiyaa goobaha foomka wax alla wuxuu helo.
4. 4
   Muuqaal toos ah oo Google iyo kaararka bulshada

   Qalabku wuxuu ku sawiraa natiijo Google raadin oo qurxoon iyo fiiriye kaar Open Graph ah waqti dhabta ah isagoo isticmaalaya isla xaalada foomka, sidaa darteed waxaad si sax ah u arki kartaa sida cinwaanka iyo sharraxaadda loo gooyn doono ka hor inta aad koobiyeyn wax-soo-saarka.

Qalabka La Xiriira