【前端JSP思考】JSP中#{},${}和%{}的區別

JSP中#{},${}和%{}的區別：

#{}

#{}：對語句進行預編譯，此語句解析的是占位符?，可以防止SQL注入， 比如打印出來的語句 select * from table where id=?，預編譯之后會變成select * from table where id = "1 or 1 = 1"。給注入信息加上了引號，並將其中可能存在的特殊字符進行了轉義處理，替換掉了，所以可以防止注入。

類比：Java中的PreparedStatement
預編譯：預編譯又稱預處理，是整個編譯過程最先做的工作，即程序執行前的一些預處理工作。

例如，C語言的宏定義#define pi 3.14，就是在編譯前把對應的變量替換掉了。
我們這里的SQL預編譯，PreparedStatement不是將參數簡單拼湊成SQL，而是做了一些預處理，將參數轉換為String，兩端加單引號，將參數內的一些特殊字符（換行，單雙引號，斜杠等）做轉義處理，這樣就很大限度的避免了SQL注入。

Statement：${}
如 對於查詢語句：select * from user where name='+ name +'
輸入：張三' or 1 = '1
Statement，單純拼接，不防止注入：select * from user where name = '張三' or 1 = '1'

---

PreparedStatement：#{}
對於查詢語句：select * from user where name=?
PreparedStatement，預編譯SQL，對參數進行轉義，防止注入，select * from user where name = '張三' or 1 = '1'
這樣可以防止注入，導致我們sql語句的結構被改變。

${}

${}：則是不能防止SQL注入打印出來的語句 select * from table where id=2 實實在在的參數拼接而成，可能會被注入select * from table where id = 1 or 1 = 1。

類比：Java中的Statement

%{}

%{}：用在ognl表達式中是保證'{' 和 '}'之間的內容是OGNL表達式取值方式的

ognl表達式 即 對象導航圖語言，用點來代替getset方法的調用，如配置文件properties中的. 。
如setName 我們可以使用.name
相當於oc中的點方法

@{}

在Thymeleaf中又引入了一個新的表達式符號@{}，@{}代表獲取上下文，也可以理解為獲取當前項目的根目錄。

Jsp 的老方法${pageContext.request.contextPath} = Thymeleaf 的新方式 @{}
如下實例
老式jsp:

<div style="border: solid 1px">
    <form enctype="multipart/form-data" method="post" th:action= "${pageContext.request.contextPath}/uploadDownload/testuploadimg">
                圖片<input type="file" name="file"/>
                <input type="submit" value="上傳"/>
     </form>
</div>

新的thymeleaf:

<div style="border: solid 1px">
    <form enctype="multipart/form-data" method="post" th:action= "@{/uploadDownload/testuploadimg}">
                圖片<input type="file" name="file"/>
                <input type="submit" value="上傳"/>
     </form>
</div>

{{}}

在vue中又引入了一個新的表達式符號{{}}，{{}}用於輸出對象屬性和函數返回值，與${}用法類似，只不過{{}}是用於輸出vue對象的屬性和返回值

var vm = new Vue({
      /*  el:用於綁定屬性的元素 */
      el:"#app",  //
      //data 用於定義屬性，
      data:{    
            msg:"hello world!!",
            age: 30,
            firstName : "liu234",
            lastName : "luw3111i",
            fullName : "luwei 6"
      },
      /* 用於定義的函數，可以通過 return 來返回函數值。*/
      methods : {
            getFullName : function(){
            //this指vm實例
                  return this.firstName + "" + this.lastName
            }
      }
})