SlideShare a Scribd company logo
ソースいじれない
レガシーWebを
スマホタブレット対応に
⼟管
株式会社コネクトワン
ConnectONE Co.,Ltd. 1
ConnectONE Co.,Ltd. 2
レガシーWebに
いっさい⼿を加えません
レガシーWeb
とは︖
レガシーWebとは主に2000年代にIE向けに
開発されたWebシステムのこと。
レガシーWebの業務システムは、⻑年に渡
り、プレハブ的な改修追加が⾏われ、詳細
なドキュメントもなく完全なブラックボッ
クス化していることが多いと⾔われる。
このため、レガシーWebは業務フローの基
幹をなしているにも関わらず、⼤きな変更
は事実上不可能となっている。
業務になくてはならない
ConnectONE Co.,Ltd. 3
IT担当者の
悩み
ConnectONE Co.,Ltd. 4
ソースコードいじれない
詳細なドキュメントもなく、当時の開発者もい
なくなっている。度重なる改修で、レガシー
Webはブラックボックス化となっている、
下⼿に⼿をつけると、システムにどのような影
響がでるか洗い出すことさえ困難になっている。
このためレガシーWebは、モバイル化や脱IE
などの最新IT技術を取り⼊れるどころか、シス
テム修正なども出来ず、運⽤せざるを得ない
ケースが多い。
なんとか
なんないの︖
当時の開発者
いません。
ブラック
ボックス
DoCANは
レガシーWebに
⼿をつけない
ConnectONE Co.,Ltd. 5
どかん︖
ブラック
ボックス
DoCAN(⼟管)
コンテンツ変換中継サーバ
DoCAN(⼟管)
DoCANとは、レガシーWebとブラウザの間にコ
ンテンツ変換機能を持つ中継サーバです。
DoCANは、レガシーWebに⼀切⼿をつけること
なく、スマホタブレット対応/脱IE/セキュリ
ティ強化などの最新IT機能を実現します。
ConnectONE Co.,Ltd. 6
レガシーWebを
スマホ・タブレット化します
そういえば
何年も前から
ニーズがあった
ConnectONE Co.,Ltd. 7
現場で
店舗で
個⼈端末から
移動中でも
経営者「レガシーWebにスマホやタブレットからアクセスさせて業務効率あげたい」
IT担当者「残念ながらレガシーWebでは実現できません」
理由1
ソースが
いじれないから
ConnectONE Co.,Ltd. 8
なんとか
なんないの︖
だから〜
ソースいじれませんて
スマホで
アクセスできない︖
レガシーWebはパソコンのIE前提で開発さ
れているため、そのままでは、スマホなどの
端末では満⾜な表⽰はできない。しかしソー
スをいじることも困難なため。HTMLをスマ
ホ・タブレット対応にすることも困難。
理由2
セキュリティで
無理だった
ConnectONE Co.,Ltd. 9
外部から
ハッキング
しちゃうよ
なんとか
なんないの︖
だから〜
ソースいじれませんて
レガシーWebは外部からの不正アクセスの
対応などのセキュリティにも不安が残りま
す。外部からのアクセス前提でセキュリ
ティ設計がされていないためです。
ConnectONE Co.,Ltd. 10
DoCANを通すだけで
しかしDoCAN
通すだけで
タブレット化
ConnectONE Co.,Ltd. 11
DoCAN(⼟管)
現場で
店舗で
ブラック
ボックス
業務フローの基幹となっているレガ
シーWebにタブレットからアクセスさ
せることが出来ると、現場から直接シ
ステムの出⼊⼒が可能となります。
タブレット化
DoCAN
通すだけで
スマホ対応
ConnectONE Co.,Ltd. 12
DoCAN(⼟管)
ブラック
ボックス
外出先からレガシーWebにアク
セスが出来るようになると、業
務効率が格段に上がります。
スマホ化
スマホから
移動中でも
DoCAN
通すだけで
脱IE
ConnectONE Co.,Ltd. 13
DoCAN(⼟管)
ブラック
ボックス
サポートの終了が決まっている
Internet Exploreに依存しない、
脱IEを実現するこによって、レ
ガシーWebを使い続けることが
出来ます。
脱IE
IE使わなくて
いいんだ
DoCAN
通すだけで
セキュリティ
ConnectONE Co.,Ltd. 14
DoCAN(⼟管)
DoCANはシステム管理者が許可
した端末しかアクセスが出来ま
せん。DoCANは不正アクセスか
らレガシーWebを守ります。
不正アクセス防⽌
ConnectONE Co.,Ltd. 15
DoCAN 画⾯例
レガシーWebの
表⽰が崩れる
ConnectONE Co.,Ltd. 16
レガシーWebは、IEではきちんと表⽰されるが
モダンブラウザでは表⽰が崩れる
DoCANなら
きちんと表⽰
ConnectONE Co.,Ltd. 17
Windows(脱IE) iOS/iPadOS/Android
ConnectONE Co.,Ltd. 18
レガシーWebの
開発情報は不要です
DoCANは
レガシーWebに
⼿をつけない
ConnectONE Co.,Ltd. 19
対策案1 改修したいが・・
→ ブラックボックスいじれない
対策案3 DoCAN(⼟管)を通す
→ 費⽤が抑えられる。
→ ブラックボックスをいじらないので安⼼
対策案2 新規で作るのは・・
→ 膨⼤な予算がかかる。
従来の対策⽅法
DoCANの対策⽅法
ドキュメントも
開発担当者も
不要です
ConnectONE Co.,Ltd. 20
レガシーWeb開発当時のドキュメントは不
要です。当時の担当者が残っていなくても問
題ありません。
モダンブラウザでアクセスした時にどういう
問題が発⽣し、どのように修正したいかをご
指⽰ください。
変換ルールは
⼿動で
組みます
ConnectONE Co.,Ltd. 21
変換ルールの作成は⾃動で⾏われる
のですか︖
スマホだと画⾯に
収まりきりません
写真はイメージです
そういう場合は、不要な列
を⾮表⽰にしてwidth設定を
device幅に指定するんだよ。
Q
A
いいえ。⼿動です。弊社の職⼈技術
者が⼿作業で組みます。
制約条件
ConnectONE Co.,Ltd. 22
DoCANのコンテンツ変換は何でも対
応できますか︖
Q
A
いいえ。制約があります。下記をご
参照ください。
• VBScript / ActiveXは、モダンブラウザJavascriptに置き換えら
れるものが対象となります。
• Silverlight / AdobeFlahは、コンテンツ変換対象外となります。
• スクリプトによりHTMLをクライアント側で動的に構成するコン
テンツも変換対象外となります。
• その他スクリプトによってはコンテンツ変換ができない場合があ
ります。
• 統合Windows認証はNTLM認証対応予定です。(時期未定)
ConnectONE Co.,Ltd. 23
DoCANがもたらす
セキュリティ
⾦融機関で
認められた
セキュリティ
ConnectONE Co.,Ltd. 24
① データを残さない
② なりすまし防⽌
③ スクショ禁⽌
④ 印刷禁⽌
⑤ 外部メモリ保存
⑥ マルウェア感染監視
⑦ 端末不正改造防⽌
⑧ シャドーIT漏洩防⽌
一般のセキュアブラウザ機能 個人端末/在宅パソコン向けセキュリティ 今後注目されるセキュリティ
DoCANの特徴はコンテンツ変換だ
けではありません。⾦融機関で認
められた⾼いセキュリティです。
構成例1
リモートアクセス
ConnectONE Co.,Ltd. 25
レガシーWeb
クラウドWeb
スマホ・タブレット
在宅パソコン
VPN
DoCAN
ゲートウェイ
VPN
ルータ
通常DoCANはクラウドサービスとなります。(オンプレ構築ば別途オプション)
DoCANはオンプレWebでもクラウドWebでも接続可能です。
構成例2
社内PC
ConnectONE Co.,Ltd. 26
レガシーWeb
社内パソコン
クラウドWeb
DoCAN
ゲートウェイ
通常DoCANはクラウドサービスとなります。(オンプレ構築ば別途オプション)
DoCANはオンプレWebでもクラウドWebでも接続可能です。
VPN VPN
ルータ
導⼊実績1
ConnectONE Co.,Ltd. 27
セキュリティ要件の厳しい⾦融
機関に⾼く評価されています。
⽣命保険会社様
お客さま情報のアクセスに社員の個⼈端末を使
わせることができました。DoCANはスクリー
ンショットまで禁⽌されるので情報漏洩対策と
して万全です。
証券会社様
ファイアーウォールの設定変更することなく、
社員のタブレット端末から社内業務システムへ
の安全なリモートアクセスがDoCAN導⼊で実
現できました。
地⽅銀⾏様
DoCANシステムにより、既存のシステムその
ままで、⾏員がタブレット端末で窓⼝業務がで
きるようになりました。
ConnectONE Co.,Ltd. 28
DoCANは、地⽅銀⾏窓⼝タブレットから⽣命保険会社商品販売サイトへの接続サービスの基幹シス
テムとして採⽤されています。(地⽅銀⾏︓約40銀⾏ ⽣命保険会社︓約20社)
DoCAN
ゲートウェイ
⽣命保険商品
販売サイト
銀⾏窓⼝
コンテンツ変換
導⼊実績2
お問い合わせ
ConnectONE Co.,Ltd. 29
株式会社コネクトワン
営業部 吉⽥
03-6206-8089
sales@connectone.co.jp
www.connectone.co.jp

More Related Content

Similar to ソースいじれないレガシーWebをスマホタブレット対応に

Five Steps to Culture Change を日本語で解説する 2020/11/06
Five Steps to Culture Change を日本語で解説する 2020/11/06Five Steps to Culture Change を日本語で解説する 2020/11/06
Five Steps to Culture Change を日本語で解説する 2020/11/06
Issei Hiraoka
 
Reactにflowtypeを組み合わせることで、我々は何を楽にできたか
Reactにflowtypeを組み合わせることで、我々は何を楽にできたかReactにflowtypeを組み合わせることで、我々は何を楽にできたか
Reactにflowtypeを組み合わせることで、我々は何を楽にできたか
LINE Corporation
 
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
TAKUYA OHTA
 
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
Takahiro Okumura
 
スタートアップ向け!1人日でできるサービスの高速化方法と成果
スタートアップ向け!1人日でできるサービスの高速化方法と成果スタートアップ向け!1人日でできるサービスの高速化方法と成果
スタートアップ向け!1人日でできるサービスの高速化方法と成果
Koichiro Sumi
 
止めないためのWEBインフラ入門
止めないためのWEBインフラ入門止めないためのWEBインフラ入門
止めないためのWEBインフラ入門
Sho Okada
 
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)
 
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...kumo2010
 
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
虎の穴 開発室
 
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
Iida Yukako
 
デベロッパープロダクトシステムの マイクロサービス化
デベロッパープロダクトシステムの マイクロサービス化デベロッパープロダクトシステムの マイクロサービス化
デベロッパープロダクトシステムの マイクロサービス化
LINE Corporation
 
20101112 tf web_hirookun_p
20101112 tf web_hirookun_p20101112 tf web_hirookun_p
20101112 tf web_hirookun_p
hirookun
 
TF Seminar 20110218
TF Seminar 20110218TF Seminar 20110218
TF Seminar 20110218
hirookun
 
Mobile Application Development by XPages
Mobile Application Development by XPagesMobile Application Development by XPages
Mobile Application Development by XPages
Atsushi Sato
 
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介infoScoop
 
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
Developers Summit
 
.NET Micro Framework is my spirit.
.NET Micro Framework is my spirit..NET Micro Framework is my spirit.
.NET Micro Framework is my spirit.
Atomu Hidaka
 
Forguncy 6 製品概要資料
Forguncy 6 製品概要資料Forguncy 6 製品概要資料
Forguncy 6 製品概要資料
フォーガンシー
 
.NET6新機能の振り返り
.NET6新機能の振り返り.NET6新機能の振り返り
.NET6新機能の振り返り
TomomitsuKusaba
 
Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19
Atsuo Yamasaki
 

Similar to ソースいじれないレガシーWebをスマホタブレット対応に (20)

Five Steps to Culture Change を日本語で解説する 2020/11/06
Five Steps to Culture Change を日本語で解説する 2020/11/06Five Steps to Culture Change を日本語で解説する 2020/11/06
Five Steps to Culture Change を日本語で解説する 2020/11/06
 
Reactにflowtypeを組み合わせることで、我々は何を楽にできたか
Reactにflowtypeを組み合わせることで、我々は何を楽にできたかReactにflowtypeを組み合わせることで、我々は何を楽にできたか
Reactにflowtypeを組み合わせることで、我々は何を楽にできたか
 
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
IT エンジニアのための 流し読み Windows - Windows 11 SE アプリケーションの管理
 
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
2015年GMOペパボ新卒エンジニア研修 Webオペレーション研修イントロダクション
 
スタートアップ向け!1人日でできるサービスの高速化方法と成果
スタートアップ向け!1人日でできるサービスの高速化方法と成果スタートアップ向け!1人日でできるサービスの高速化方法と成果
スタートアップ向け!1人日でできるサービスの高速化方法と成果
 
止めないためのWEBインフラ入門
止めないためのWEBインフラ入門止めないためのWEBインフラ入門
止めないためのWEBインフラ入門
 
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント
 
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...
SharePoint Conference 2010 B1-4 Office 2010をクラウドで拡張! Microsoft Online Service...
 
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
Supabase Edge Functions と Netlify Edge Functions を使ってみる – 機能とその比較 –
 
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
2023.03.08@高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜
 
デベロッパープロダクトシステムの マイクロサービス化
デベロッパープロダクトシステムの マイクロサービス化デベロッパープロダクトシステムの マイクロサービス化
デベロッパープロダクトシステムの マイクロサービス化
 
20101112 tf web_hirookun_p
20101112 tf web_hirookun_p20101112 tf web_hirookun_p
20101112 tf web_hirookun_p
 
TF Seminar 20110218
TF Seminar 20110218TF Seminar 20110218
TF Seminar 20110218
 
Mobile Application Development by XPages
Mobile Application Development by XPagesMobile Application Development by XPages
Mobile Application Development by XPages
 
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介
第5回iocj情報交換会 info scoopとzabbixによる運用ポータルの事例紹介
 
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
【17-E-4】GitHub Enterpriseユーザ企業登壇!企業文化にイノベーションを起こすモダンなソフトウェア開発環境とは?
 
.NET Micro Framework is my spirit.
.NET Micro Framework is my spirit..NET Micro Framework is my spirit.
.NET Micro Framework is my spirit.
 
Forguncy 6 製品概要資料
Forguncy 6 製品概要資料Forguncy 6 製品概要資料
Forguncy 6 製品概要資料
 
.NET6新機能の振り返り
.NET6新機能の振り返り.NET6新機能の振り返り
.NET6新機能の振り返り
 
Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19
 

ソースいじれないレガシーWebをスマホタブレット対応に