28日)
19032 ワード
-今日のアルゴリズムの問題

私の喜ぶ草
function solution(s, n) {
let bigger= ["A","B","C","D","E","F","G","H","I","J","K","L",
"M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"]
let small=["a","b","c","d","e","f","g","h","i","j","k","l","m",
"n","o","p","q","r","s","t","u","v","w","x","y","z"]
let result =""
for(i=0; i<s.length; i++){
if(bigger.includes(s[i])){
if(bigger.indexOf(s[i])+n >25 ){
result += bigger[bigger.indexOf(s[i])+n-26]
}else{
result += bigger[bigger.indexOf(s[i])+n]
}
} else if (small.includes(s[i])){
if(small.indexOf(s[i])+n>25){
result += small[small.indexOf(s[i])+n-26]
}else {
result += small[small.indexOf(s[i])+n]
}
}else if(s[i] === " "){
result += " "
}
} return result
}
-ネット編集を理解する(inputtextが面白くないだけだ!)
->reactの有名なフォームライブラリ!
->wysiwygの編集!
->トーストui editor(アニメーションとして作成可能なエディタ)
-importサイトがアップしたときcommonjsは昔のやり方!

そのonchangeはquil自体の関数名なので、eventが関数に入らないと書いてあることを確認でき、valueが直接入る!

だからこうなったらReactQuillになると思ってたんだけどダメ!
文書がないと言う
なぜなら、やはりレンダリング時にフロントエンドサーバがreact quillを読み込めないからです!
{typeofwindow!="undefined"&&&(あら、それもだめ!)
ダイナミックインポートをしましょう.
react専用フレームワークはnextjsなので、レンダリングなどが行われます.
純reactを使うと、レンダリングしていなければ、そこに書いてあるというエラーは出ませんが.
nextjsを使って...ダイナミックインポートを行うには!
だからReactQuillの導入方法を変更しました!

const ReactQuill = dynamic(()=> import("react-quill"),{ ssr : false})
ダイナミックインポート方法!
(お腹が痛くて、疎かったなぁ…)
import {useForm} from 'react-hook-form'
const {register, handleSubmit} = useForm({
mode:"onChange"
})
コンソールにvalueを印刷すると、私たちのvalue値がラベルに突き刺さっているのが見えます!
-onChangeContentsをreact-hook-formに接続
強制する.
何も書いてないのに空じゃないの?

だからその上に書いてある値段なら!コードにNULL値を指定

->mode:onChangeと入力し、リアルタイムでエラーをポップアップします.react quillのライブラリはonchangeを強制しなければなりません(そこに書かれている名前だけがonchange...!)
->反応面グループを入力しましたが、contentsというすべての置換キーを追加する必要があります
userformからトリガを取得し、トリガ(「contents」)
時々ない時以外は条件を指定!
->reactquillを使用して登録とクエリーを再復習する部分
-コンソールに写っている値自体がそのデータに直接入ったらどうする?
ラベルをラベルと認識させましょう.すべてのものを文字列として認識しないでください.

->危険SetInnerHTMLの登場…!
={{html:data?.fetchBoard.content}}このように書けばいいですか?
->ラベル自体を認識させる方法です!(presenterに書いてある部分)でもちょっとめまいがして、、、、危ない、どうして?
-クロスサイドスクリプト(XSS)(localstorageは危険キャップ)

コンソールでreact quillは確かにonchangeにブロックされています
だから私は彼にテキストの形で現れさせた.

でもこれはReactQuillに書くだけでそのまま楽屋に入って音楽を出すと…!(一般的なハッカー技術(画像タグを使用)を使用します.元斗先生が知らなかったことは何ですか.

そのまま登録!

マウスを買いに来たのですが、コインを奪われた現場・・
->とにかくsetinnerhtmlは危険!
->これらを使用すると、ラベル付きの文が自動的にブロックされます.
糸添加dompurify
-クエリー・データのページからインポート
dangerouslySetInnerHTML={{
__html:Dompurify.sanitize(data?.fetchBoard.contents)
}
さっき書いた部分をこのようにコードを書いて、安全に完成しました!
nextかと思ったら、レンダリング時にフロントサーバがdomを読み取れないのでブラウザにしかラベルが表示されない
-> Cross-Site-Script(XSS)
サイトを横切ってスクリプトを挿入する攻撃を防ぐにはどうすればいいですか?
- OWASP TOP 10
https://ko.wikipedia.org/wiki/OWASP
ここには10種類の一般的なWebアプリケーションの脆弱性があり、セキュリティに大きな影響を与える可能性があります.
これらのコンピュータエンジニアリング情報は開発者として知っておくべきです!

-水和-問題(hydrationでcss問題が発生!)
<div style={{color: "indianred"}}>작성자: {data?.fetchBoard.writer} </div>
<div style={{color: "pink"}}>제목: {data?.fetchBoard.title}</div>
{/* <div>내용:{data?.fetchBoard.contents} </div> */}
{typeof window !== "undefined" && (
<div style={{color: "red"}} dangerouslySetInnerHTML={{
__html:Dompurify.sanitize(data?.fetchBoard.contents)
}}>
</div>
)}
<div style ={{color: "green"}}>상품가격 : </div>
どうして色がこうなるの?
サーバでレンダリングするときにJavaScriptと関数をバインド...これをしません.
タグの位置のみをチェックします.
最終的にサーバーに描いた時(hydrationの時)やるって言ったでしょ!
さっきwindowとか描いたことのないdompurify以外は
ブラウザでは認識できません
急に条件がついてdompurify divを描きたいです.
だから私が決めた色が見えません!
これらの問題
すいかホットスポット
解決策は簡単で、サーバ上で描画するときにdiv個数を調整することもできます.

-400エラー(通常graphsqlエラー)
->gqlクエリー確認確認!間違った文法を表す
-残りのエラーについて

-今週の学習内容整理部分
素子prev,recoil,closure,HOC,react-form,yupはきちんと整理してください.
私が混同した部分はCloserとHoc...


Reference
この問題について(28日)), 我々は、より多くの情報をここで見つけました https://velog.io/@kimareum/28일テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol