HTML 파일에 Sencha 적용
2024. 7. 13. 15:57ㆍJavascript/Sencha
Sprng boot Security가 적용 안된 경우
# spring boot에서 한글깨지는 문제 해결을 위해서 설정
<meta charset="UTF-8">
# Ext를 참조하기 위해서 적용
<script type="text/javascript" src="/ext/build/ext-all.js"></script>
# Ext.getBody()를 적용하기 위해서 스크립트 보다 먼저 생성되어야 함
<body></body>
<script>
Ext.create('Ext.panel.Panel', {
title: 'Hello',
width: 200,
html: '<p>World! 히히</p>',
renderTo: Ext.getBody()
});
</script>
Sprng boot Security가 적용된 경우
에러 발생
Refused to execute script from 'http://localhost:{port}/login' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.Understand this error
login:17 Uncaught ReferenceError: Ext is not defined
at login:17:5
Ext를 참조하기위해서 '/ext/build/ext-all.js'를, 로그인 체크에서 제외시켜야 함
# before
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.authorizeHttpRequests((requests) -> requests
.requestMatchers("/", "home").permitAll()
.anyRequest().authenticated())
.formLogin((form) -> form
.loginPage("/login")
.permitAll())
.logout((logout) -> logout.permitAll());
return http.build();
}
# after
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.authorizeHttpRequests((requests) -> requests
.requestMatchers("/", "home", "/ext/build/ext-all.js").permitAll()
.anyRequest().authenticated())
.formLogin((form) -> form
.loginPage("/login")
.permitAll())
.logout((logout) -> logout.permitAll());
return http.build();
}
CSS 적용
<link rel="stylesheet" href="/classic/resources/theme-triton-all.css" />
<script type="text/javascript" src="/ext/build/ext-all.js"></script>
<body></body>
<script>
Ext.create('Ext.Button', {
text: 'Click me',
renderTo: Ext.getBody(),
handler: function() {
alert('You clicked the button!');
}
});
</script>
'Javascript > Sencha' 카테고리의 다른 글
theme css 파일 위치 (0) | 2024.07.16 |
---|---|
Ext에 property 추가 (0) | 2024.07.16 |
Sencha Trouble Shooting (0) | 2024.07.13 |
Sencha ajax progress (0) | 2024.04.08 |
Sencha Message 처리 (0) | 2024.04.01 |