CORS 설정을 수행하고 webserver를 통해 REST로 Yellowfin 서버에 액세스
이번 목적
제목대로입니다만, 조금 안건으로 검증한 적도 있고, 버젼에 의해서 거동이 다른 일도 꽤 고전했기 때문에 비망록입니다.
원래 다른 서비스의 서버에 Yellowfin의 JavascriptAPI의 version3를 짜넣어, 대시보드를 표시시키고 싶은 것이 하고 싶은 것이었습니다만, 사이에 서버가 2개 있는 것도 있어, 설정도 꽤 힘들었습니다 . .
상당히 기본적인 것입니다만, 조금씩 해설해 갑니다.
※덧붙여서, 이 방법은 Yellowfin의 버전 9.2.2로 동작 확인하고 있어, 9.2.1에서는 동작하지 않습니다.
SSO 관련 설정
이것은 내장 된 서버에 배치하는 HTML 파일의 RequestBody의 JSONObject에 설정이 있습니다.
요점은 SSO 대응을위한 REST Body 객체의 noPassword에 true를 설정하는 것입니다.
이 속성을 True로 설정하면 authUserPass의 값이 무엇이든 실행할 수 있습니다.
반대로 False로 하면, ID/Pass 어느쪽이나 필수가 됩니다.
리포지토리 DB에서 다음 SQL 실행
Yellowfin 리포지토리에 대해 다음 SQL에서 설정을 추가합니다.
이것은 단순 인증을 허용하는 설정이며, 그렇지 않으면 비밀번호가없는 SSO 설정은 불가능합니다.
forSSO.sqlINSERT INTO Configuration (IpOrg, ConfigTypeCode, ConfigCode, ConfigData) VALUES (1, 'SYSTEM', 'SIMPLE_AUTHENTICATION', 'TRUE');
액세스할 HTML 파일 소스
여기서 API 요청을 프런트 엔드 웹 서버에 던지고 있습니다.
RESTAPI의 공식 문서에 대해서는 이쪽
htps : //에서 ゔぇぺぺrs.ぇぉw 훗비. 이 m/에서 v/아피도 cs/yf아피. HTML
대시보드 로드에 대해 자세히 알아보기
htps : // 우우키.ぇぉw ふぃん. 이. jp/파게 s/ゔぃ에 w파게. 아 c 치오? 파게이 d=6591542
rest.html
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
</head>
<body>
<div id="reportDiv"></div>
<script>
var authUserId = '[email protected]';
var authUserPass = 'dammy for noPass=true';
var adminId = '[email protected]';
var adminPassword = 'test';
var body = {
signOnUser: {
userName: authUserId,
password: authUserPass,
clientOrgRef: ""
},
noPassword: true,
adminUser: {
userName: adminId,
password: adminPassword
}
};
//encode to JSON
var json_text = JSON.stringify(body);
$.ajax({
type: 'POST',
contentType: "application/json;charset=UTF-8",
data: json_text,
crossDomain: true,
url: "http://frontend.web.server/api/rpc/login-tokens/create-sso-token",
headers: {
'Authorization': 'YELLOWFIN ts=' + new Date().getTime() + ', nonce=123',
"Accept": 'application/vnd.yellowfin.api-v1+json'
},
success: function (res, textStatus, jqXHR) {
securityToken = res.securityToken;
let url = 'http://frontend.web.server/JsAPI/v3?token=' + securityToken;
let tp = 'text/javascript';
let sc = document.createElement('script');
sc.src = url;
sc.type = tp;
document.body.appendChild(sc);
setTimeout(function () {
yellowfin.showLoginPrompt = false;
yellowfin.init().then(() => {
yellowfin.loadDashboard({
dashboardUUID: '417a0ff3-6adf-4c92-8328-98d0eeb3fd6a',
element: document.querySelector('div#reportDiv')
});
});
}, 1000);
},
error: function (responseData, textStatus, errorThrown) {
alert("error!");
}
});
</script>
</body>
</html>
프런트 엔드 웹 서버 설정 (AJP에서 액세스 설정 용)
apache의 httpd.conf에 다음을 추가합니다. AJP 경유의 액세스로 변경하는 설정이 됩니다.
80번 포트에서 접수하고 있는 액세스를 AJP의 8009번 포트로 리디렉션하는 설정입니다.
proxy-ajp.confProxyRequests Off
ProxyPass / ajp://yellowfin.server:8009/ secret=secretPass timeout=1860
ProxyPassReverse / ajp://yellowfin.server:8009/ secret=secretPass
Yellowfin 서버 설정
AJP에서 액세스 설정 (AJP에서 액세스 설정 용)
이전의 AJP 설정을 받는 설정을 server.xml에 기재합니다. 그런 다음 기본 8080 또는 불필요한 이전 연결 설정은 주석 처리됩니다.
/usr/local/yellowfin/appserver/conf/server.xml <Connector port="8009" protocol="AJP/1.3" redirectPort="8443"
maxThreads="500" minSpareThreads="25"
enableLookups="false" acceptCount="100"
connectionTimeout="20000"
URIEncoding="UTF-8"
maxPostSize="10485760" maxParameterCount="50000"
address="0.0.0.0"
secretRequired="true" secret="secretPass"
/>
<!-- comment out
<Connector port="8080" protocol="HTTP/1.1" maxHttpHeaderSize="8192"
maxThreads="150" minSpareThreads="25"
enableLookups="false" redirectPort="8443" acceptCount="100"
connectionTimeout="20000" disableUploadTimeout="true"
URIEncoding="UTF-8" compression="on" compressionMinSize="512"
noCompressionUserAgents="gozilla, traviata"
compressibleMimeType="text/html,application/x-javascript,text/css,application/javascript,text/javascript,text/plain,text/xml,application/json,application/vnd.ms-fontobject,application/x-font-opentype,application/x-font-truetype,application/x-font-ttf,application/xml,font/eot,font/opentype,font/otf,image/svg+xml,image/vnd.microsoft.icon,image/svg,text/comma-separated-values,application/csv,application/vnd.yellowfin.api-v1+json"
useSendfile="false" />
-->
Yellowfin 서버의 Tomcat (web.xml)에 다음을 추가합니다 (CORS 용 설정)
이것이 CORS 대응의 간이 되는 부분이군요. 액세스 소스 권한 설정 · 프리 플라이트를위한 OPTION 메소드 추가 · 나중에 Yellowfin API에 던지기위한 헤더를 추가합니다.
/usr/local/yellowfin/appserver/conf/web.xml<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
<init-param>
<param-name>cors.allowed.origins</param-name>
<param-value>*</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.methods</param-name>
<param-value>GET,POST,OPTIONS</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.headers</param-name>
<param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Authorization</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
시스템 구성 변경 (CORS 용 설정)
시스템 구성 → 시스템 탭이 허용하는 오리진에 브라우저에서 액세스할 도메인을 등록합니다. 또한 멀티탭 지원을 Off로 한다.
이 일련의 서버명의 설정입니다만, AJP의 설정도, web.xml의 설정도 도메인명이라면 도메인명·IP라면 IP로의 표기를 통일하지 않으면 안 된다고 합니다. 그것은 그렇습니까 · · ·
결과
이런 느낌으로 대시보드 호출이 성공했습니다! 이것을 사용하면, 임베디드나 외부 사이트에서의 참조를 할 수 있게 되어 보다 이용의 폭이 넓어지는군요.
※라이센스 계통은 요 확인입니다・・
이미지는 다 조수 희화 씨로부터 빌렸습니다. h tps : // 조주가. 코m/
Reference
이 문제에 관하여(CORS 설정을 수행하고 webserver를 통해 REST로 Yellowfin 서버에 액세스), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/celery/items/69f8da9601277807cc34
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
INSERT INTO Configuration (IpOrg, ConfigTypeCode, ConfigCode, ConfigData) VALUES (1, 'SYSTEM', 'SIMPLE_AUTHENTICATION', 'TRUE');
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
</head>
<body>
<div id="reportDiv"></div>
<script>
var authUserId = '[email protected]';
var authUserPass = 'dammy for noPass=true';
var adminId = '[email protected]';
var adminPassword = 'test';
var body = {
signOnUser: {
userName: authUserId,
password: authUserPass,
clientOrgRef: ""
},
noPassword: true,
adminUser: {
userName: adminId,
password: adminPassword
}
};
//encode to JSON
var json_text = JSON.stringify(body);
$.ajax({
type: 'POST',
contentType: "application/json;charset=UTF-8",
data: json_text,
crossDomain: true,
url: "http://frontend.web.server/api/rpc/login-tokens/create-sso-token",
headers: {
'Authorization': 'YELLOWFIN ts=' + new Date().getTime() + ', nonce=123',
"Accept": 'application/vnd.yellowfin.api-v1+json'
},
success: function (res, textStatus, jqXHR) {
securityToken = res.securityToken;
let url = 'http://frontend.web.server/JsAPI/v3?token=' + securityToken;
let tp = 'text/javascript';
let sc = document.createElement('script');
sc.src = url;
sc.type = tp;
document.body.appendChild(sc);
setTimeout(function () {
yellowfin.showLoginPrompt = false;
yellowfin.init().then(() => {
yellowfin.loadDashboard({
dashboardUUID: '417a0ff3-6adf-4c92-8328-98d0eeb3fd6a',
element: document.querySelector('div#reportDiv')
});
});
}, 1000);
},
error: function (responseData, textStatus, errorThrown) {
alert("error!");
}
});
</script>
</body>
</html>
ProxyRequests Off
ProxyPass / ajp://yellowfin.server:8009/ secret=secretPass timeout=1860
ProxyPassReverse / ajp://yellowfin.server:8009/ secret=secretPass
<Connector port="8009" protocol="AJP/1.3" redirectPort="8443"
maxThreads="500" minSpareThreads="25"
enableLookups="false" acceptCount="100"
connectionTimeout="20000"
URIEncoding="UTF-8"
maxPostSize="10485760" maxParameterCount="50000"
address="0.0.0.0"
secretRequired="true" secret="secretPass"
/>
<!-- comment out
<Connector port="8080" protocol="HTTP/1.1" maxHttpHeaderSize="8192"
maxThreads="150" minSpareThreads="25"
enableLookups="false" redirectPort="8443" acceptCount="100"
connectionTimeout="20000" disableUploadTimeout="true"
URIEncoding="UTF-8" compression="on" compressionMinSize="512"
noCompressionUserAgents="gozilla, traviata"
compressibleMimeType="text/html,application/x-javascript,text/css,application/javascript,text/javascript,text/plain,text/xml,application/json,application/vnd.ms-fontobject,application/x-font-opentype,application/x-font-truetype,application/x-font-ttf,application/xml,font/eot,font/opentype,font/otf,image/svg+xml,image/vnd.microsoft.icon,image/svg,text/comma-separated-values,application/csv,application/vnd.yellowfin.api-v1+json"
useSendfile="false" />
-->
<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
<init-param>
<param-name>cors.allowed.origins</param-name>
<param-value>*</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.methods</param-name>
<param-value>GET,POST,OPTIONS</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.headers</param-name>
<param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Authorization</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
이런 느낌으로 대시보드 호출이 성공했습니다! 이것을 사용하면, 임베디드나 외부 사이트에서의 참조를 할 수 있게 되어 보다 이용의 폭이 넓어지는군요.
※라이센스 계통은 요 확인입니다・・
이미지는 다 조수 희화 씨로부터 빌렸습니다. h tps : // 조주가. 코m/
Reference
이 문제에 관하여(CORS 설정을 수행하고 webserver를 통해 REST로 Yellowfin 서버에 액세스), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/celery/items/69f8da9601277807cc34텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
