Web and Dev.... webzil.tistory.com

1. 엘라스틱 서치 학습

맛보기

https://needjarvis.tistory.com/category/%EB%B9%85%EB%8D%B0%EC%9D%B4%ED%84%B0%20%EB%B0%8F%20DB/%EA%B2%80%EC%83%89%EC%97%94%EC%A7%84%2C%20%EC%97%98%EB%9D%BC%EC%8A%A4%ED%8B%B1%20%EC%8A%A4%ED%83%9D


'빅데이터 및 DB/검색엔진, 엘라스틱 스택' 카테고리의 글 목록
IT, 인공지능, 빅데이터, 블록체인, 정보처리기술사 그리고 과학 관련 포스팅을 적는 블로그입니다.
https://needjarvis.tistory.com/category/%EB%B9%85%EB%8D%B0%EC%9D%B4%ED%84%B0%20%EB%B0%8F%20DB/%EA%B2%80%EC%83%89%EC%97%94%EC%A7%84%2C%20%EC%97%98%EB%9D%BC%EC%8A%A4%ED%8B%B1%20%EC%8A%A4%ED%83%9D

심화학습
https://coding-start.tistory.com/category/Search-Engine/Elasticsearch%26Solr


'Search-Engine/Elasticsearch&Solr' 카테고리의 글 목록
코딩초보를 위한 코딩초보의 블로깅
https://coding-start.tistory.com/category/Search-Engine/Elasticsearch%26Solr


2. 로그기록 by 파일비트

https://coding-start.tistory.com/135?category=757916

ELK - Filebeat 란? (실시간 로그 수집)
ELK - Filebeat 란? https://coding-start.tistory.com/187 조금 더 다듬어서 Filebeat 정리하였습니다. <실시간 로그 수집을 위한 프로세스 구성> 만약 많은 애플리케이션이 분산되어 있고, 각 애플리케이션이..
https://coding-start.tistory.com/135?category=757916

https://coding-start.tistory.com/187

ELK Stack - Filebeat(파일비트)란? 간단한 사용법
오늘 포스팅할 내용은 ELK Stack에서 중요한 보조 수단 중 하나인 Filebeat(파일비트)에 대해 다루어볼 것이다. 우선 Filebeat를 이용하는 사례를 간단하게 하나 들어보자면, 운영중인 애플리케이션에서 File을..
https://coding-start.tistory.com/187

3. 로그 수집 by 로그스태시

https://coding-start.tistory.com/189?category=757916


ELK Stack - Logstash(로그스태시)를 이용한 로그 수집
오늘 포스팅할 내용은 ELK Stack의 요소중 하나인 Logstash(로그스태시)입니다. 로그스태시 설명에 앞서 로그란 시스템이나 애플리케이션 상태 및 행위와 관련된 풍부한 정보를 포함하고 있습니다. 이러한 정보를..
https://coding-start.tistory.com/189?category=757916

https://www.whatap.io/ko/blog/13/index.html

- Vue.js 로 데이터 랜더링

- DataTables 에 데이터 바인딩

- Vue.js 와 DataTables 의 버튼 클릭 이벤트 차이

- i18n 다국어 처리

- BootStrap 4로 페이지 구성

https://jsfiddle.net/mijisoo/q56pb0t9/62/

https://datatables.net/extensions/select/examples/initialisation/reload.html

Bootstrap + jQuery 기반 프로젝트 에서 Vue.js 를 일부 페이지만 섞어서 사용하는데

Vue.js 로 만든 페이지에서도 DataTables 를 사용하고 싶을 때가 있습니다.

DataTables 은 jQuery 를 통해 주로 쓰이는데 Vue.js 와 함께 쓰일 때는 역할을 명확하게 구분해야

그나마 쓸 수 있을 정도인듯 합니다.

일단 Vue.js 로는 DataTables 테이블 바인딩, 값에 따른 화면 제어 위주로만 활용하고

DataTables 의 정렬, 페이징, 내용 검색 등등의 역할을 jQuery 로 분리해서 사용하고자 합니다.

물론 vue.js 로 최적화된 DataTables 라이브러리를 활용하면 되겠지만, 별도의 학습이 필요하고

구현부도 순수 DataTables 의 처리와 달라 지므로 각각의 이점만 활용해 보려는 시도라 보면 됩니다.

- 구현 아이디어

1) Vue.js 로 DataTables 의 데이터를 랜더링 하도록 구성

==> 화면에 데이터가 바인딩되고 vue.js 를 통해 화면 제어는 가능하나 DataTables 의 정렬, 페이징등의 기능은 동작 하지 않음.

2) DataTables 의 기능 중 Static Table 을 DataTables 로 변환 하는 속성을 활용하여

Vue.js 로 랜더링이 끝난 Table 을 DataTables 로 변환

==> DataTables 테이블로 인식이 되면 서 정렬, 페이징, 검색 기능등의 이벤트 활용 가능.

===> Vue.js 에서 데이터 새로고침이 이뤄진 이후 DataTables 재 생성 이벤트 호출

Searching, ordering and paging goodness will be immediately added to the table, as shown in this example.

https://datatables.net/examples/basic_init/zero_configuration.html

vue.js 의 updated 이벤트에서 DataTables 초기화 (재 생성)

https://datatables.net/manual/server-side

p.s. Python flask 와 DataTables 함께 사용

https://github.com/SergioLlana/datatables-flask-serverside

<tr :class="overallStatus"></tr> or <tr :class="[ overallStatus === -1 ? 'warning' : 'success' ]"></tr>

https://stackoverflow.com/questions/39609937/vue-js-how-to-add-class-to-table-row-depending-on-property-value

적용 예시

<table class="table table-striped table-bordered table-hover" id="datatable__item" style="width:100%;">
    <thead>
        <tr>
            <th class="text-nowrap" data-i18n="item.label.selled_time">SELLED_TIME</th>
            <th class="text-nowrap" data-i18n="character.label.group_id">GROUP_ID</th>
            <th class="text-nowrap" data-i18n="character.label.uid">UID</th>
            <th class="text-nowrap" data-i18n="character.label.char_id">CHAR_ID</th>
            <th class="text-nowrap" data-i18n="item.label.buyer_uid">BUYER_UID</th>
            <th class="text-nowrap" data-i18n="trade.label.price">PRICE</th>
            <th class="text-nowrap" data-i18n="trade.label.price_per_piece">PRICE_PER_PIECE</th>
            <th class="text-nowrap" data-i18n="item.label.item_id">ITEM_ID</th>
            <th class="text-nowrap" data-i18n="item.label.item_name">ITEM_ID</th>
            <th class="text-nowrap" data-i18n="item.label.count">COUNT</th>
            <th class="text-nowrap" data-i18n="item.label.serial">SERIAL</th>
            <th class="text-nowrap" data-i18n="item.label.state">STATE</th>
            <th class="text-nowrap" data-i18n="common.label.reg_date">regdate</th>
        </tr>
    </thead>
    <tbody>
        <template v-for="(data, index) in data_list">
            <tr v-on:click="rowSelect(data)" :class="[data.pricePerPiece >= $data.price * 3 ? 'bg-danger' : data.pricePerPiece >= $data.price * 2 ? 'bg-warning' : '']">
                <td>{{ data.selledTime }}</td>
                <td>{{ data.serverGroupId }}</td>
                <td>{{ data.uId }} <button data-style="zoom-in" type="button" class="btn btn-xs btn-success m-r-xs button-click" v-on:click="rT(data)"><span data-i18n="common.button.detail">detail</span></button></td>
                <td>{{ data.charId }}</td>
                <td>{{ data.buyerUid }} <button data-style="zoom-in" type="button" class="btn btn-xs btn-success m-r-xs button-click" v-on:click="rT(data)"><span data-i18n="common.button.detail">detail</span></button></td>
                <td>{{ data.price }}</td>
                <td>{{ data.pricePerPiece }}</td>
                <td>{{ data.itemId }} <button id="ladda-trade-monitoring" hidden data-style="zoom-in" type="button" class="btn btn-xs btn-success m-r-xs button-click" v-on:click="readDetail(data)"><span data-i18n="common.button.detail">detail</span></button></td>
                <td>{{ data.itemName }}</td>
                <td>{{ data.count }}</td>
                <td>{{ data.serial }}</td>
                <td>{{ data.state }}</td>
                <td>{{ data.regDate }}</td>
            </tr>
        </template>
    </tbody>
</table>

pricePerPiece 값이 기준치 보다 3배이상이면 danger, 2배면 warning 속성 부여

https://mdbootstrap.com/

Respose 에서 헤더에 노출되는 값 제거

1. Web.config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <!-- To customize the asp.net core module uncomment and edit the following section. 
  For more info see https://go.microsoft.com/fwlink/?linkid=838655 -->
  <system.webServer>
    <handlers>
      <remove name="aspNetCore" />
      <add name="aspNetCore" path="*" verb="HEAD,GET,POST" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
<!--GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS-->
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <remove name="OPTIONSVerbHandler" />
  <remove name="TRACEVerbHandler" />
  <remove name="WebDAV" />
    </handlers>
    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" hostingModel="InProcess" />
    <httpProtocol>
      <customHeaders>
        <remove name="x-powered-by" />
      </customHeaders>
    </httpProtocol>
    <security>
      <requestFiltering removeServerHeader="true" />
      <!-- Removes Server header in IIS10 or later and also in Azure Web Apps -->
    </security>
  </system.webServer>
</configuration>

2. Startup.cs

            #region Security Headers
            app.Use(async (context, next) =>
            {
                context.Response.Headers.Add("X-Frame-Options", "DENY");
                context.Response.Headers.Add("X-Xss-Protection", "1; mode=block");
                context.Response.Headers.Add("X-Content-Type-Options", "nosniff");
                context.Response.Headers.Add("X-Permitted-Cross-Domain-Policies", "none");
                context.Response.Headers.Add("Referrer-Policy", "no-referrer");
                await next.Invoke();

                .....

            }
            #endregion

https://blog.elmah.io/the-asp-net-core-security-headers-guide/

https://www.freecodespot.com/blog/dotnet-core-crud-with-firebase-database/

https://www.codeproject.com/Articles/5308552/Securing-a-Website-Using-Firebase-Angular-8-and-2

SELECT uId, charId, dateKey, date, TRIM(BOTH '"' FROM ( json_extract(parameterString, '$.itemId') ))
, TRIM(BOTH '"' FROM ( json_extract(parameterString, '$.amount') ))
, parameterString FROM jsonlog WHERE dateKey = 20220526 and logid = 50701 AND parameterString LIKE '%itemRemoveType":"45"%';