吉浦裕/講義情報/メディアネットワーク

お知らせ


 IEDの遠隔利用について



よくある質問と原因


6/10(水)の授業の前に

2020年度のメディアネットワークは、以下の2項目が必須となります。

  • 電通大学内VPNを設定済み
  • IED(solとは別のサーバ)に接続可能

 電通大学内VPNの設定方法

本授業は学内ネットワークで演習を行います。
以下のページに従い、VPNを用いて学外から学内ネットワークにアクセスできるように設定してください。


  • うまくいかない場合
    • VPN接続で、プロキシ設定が反映されていますか?
      • システムプロキシとは別にVPN専用プロキシの設定をしなければいけません。
      • 自動プロキシだけでなく、手動のプロキシ設定もする必要があります。


 IEDへのアクセス方法

今回の演習ではSSHを使ってIEDにアクセスし、演習を行ってもらいます。
「電通大学内VPNの設定方法」を参考に学内ネットワークに入ったうえで、下記の手順を参考にSSH接続を行ってください(別の方法で行っていただいても結構です)。

Windows10の場合

  • こちらの「2. Web ブラウザに学内専用サイトを閲覧する設定をする」の「a. コマンドウィンドウを開く」を参考にPowerShellを起動します
  • 「b. アクセス用のコマンドをコマンドウィンドウに入力する」を参考にSSH接続を行います。
    • この際、"ssh sol.edu.cc.uec.ac.jp -L 8080:proxy.uec.ac.jp:8080 -l UECアカウント" の代わりに、"ssh [UECアカウント]@[端末のドメイン]" を入力してください。[UECアカウント]の部分は自分のUECアカウントに、[端末のドメイン]の部分はこちらで指定したドメインに書き換えてください。
  • UECアカウントでログイン後、IED端末上で作業が可能です。

Windowsのその他のバージョンの場合

  • こちらを参考にPuTTYをダウンロードし、実行します。
  • こちらを参考にSSH接続を行います。Host Name欄には "sol.edu.cc.uec.ac.jp" の代わりに、こちらで指定した端末のドメインを入力してください。
  • UECアカウントでログイン後、IED端末上で作業が可能です。

MacOSの場合

  • こちらの「OpenSSH の ssh コマンド (UNIX, macOS)」を参考にTerminalでssh接続をします。Host Name欄には "sol.edu.cc.uec.ac.jp" の代わりに、こちらで指定した端末のドメインを入力してください。
  • UECアカウントでログイン後、IED端末上で作業が可能です。

IEDへのssh接続について、詳しく知りたい方はこちらへ

ssh接続参考資料1
ssh接続参考資料2

IEDホスト一覧



講義資料


 PHPプログラムの実行方法

学内ネットワークにて
http://medianet.inf.uec.ac.jp/~<英名のローマ字頭文字+学籍番号>/<public_html内のhtml, phpファイル>
という形式でURLを開くと実行できます。

電通太郎さん(学籍番号: 1099099)の場合
例) http://medianet.inf.uec.ac.jp/~d1099099/index.php

サンプルプログラム


 6/24

初めのPHP演習

sample_php.jpg(1249)
sample_php.jpg(1249)
index_html.jpg(956)
index2_html.jpg(902)
form_html.jpg(2295)
form2_html.jpg(817)
form_sample_html.jpg(806)

アンケート機能

enq_php.jpg(3738)

結果表示

result_php.jpg(1703)

円グラフの追加

  • 円グラフのライブラリ

https://www.chartjs.org/docs/latest/charts/doughnut.html

  • サンプルソースコード

https://qiita.com/Haruka-Ogawa/items/59facd24f2a8bdb6d369

  • 追加課題3の答え

pieChart.png(156)

 7/1

掲示板機能

view.JPG(2163)
post.JPG(1804)

 7/8

ログファイル記録

ex9_2.jpg(1020)

 7/15

ログイン・ユーザ登録機能1

login_html.jpg(1409)
login_php.jpg(1623)
regist_html.jpg(1209)
regist_php.jpg(1457)

 7/22

ログイン・ユーザ登録機能2

secret_php.jpg(1159)

 7/29

CSSによるWEBサイトのマッシュアップ

CSS_sample.jpg(1641)
mashup.jpg(1270)

 8/5

jQueryの使用

Cview_jquery.jpg(1012)
comet.jpg(1073)


第一回レポート


課題(1)
Webページ調査レポート(1ページ程度)
課題(2)
作成計画書(3ページ程度)

合計A4で4ページ程度
締切は7月3日(金)
PDFかWord形式でレポートを作成し,
yoshiura.medianet[at]hylab.hc.uec.ac.jp宛にファイルを添付し,
学籍番号,氏名,連絡の取れるメールアドレスを明記し送信.
 
件名は必ず「学籍番号_氏名」とすること.
 
例:1234567電通太郎なら,件名は1234567_電通太郎

 課題(1)

授業で紹介したWebサイト(先輩の作品・プロの作品)の中から
1つサイトを挙げ,そのサイトの機能や構成を分析し,興味を持った点や自分の作品に活用したい点を述べてください。

先輩の作品


  • 過去の作品の一部は、学内からのみ閲覧可能かつBasic認証のためのIDとPasswordが必要です。

  • 文字化けが起こる時は、ウェブブラウザのフォントエンコードを「日本語(EUC-JP)」に変更してみて下さい。

プロの作品


 課題(2)


これから自分が作成するWebページの計画書を示すこと.
どんなWebページを作成するかは自由だが,以下を含むこと.

(1)テキスト,静止画,アンケートの入力と記録,掲示板,パスワード

(2)複数のページとその間のリンク
(3)テキストについては,字の大きさ,色を2種類以上使うこと

計画書では,少なくとも下記について書くこと.


(1)テーマ:どんな情報を発信するか

(2)最終イメージ:出来上がりのイメージを図で示すこと

最初にどんなトップページが出てくるか,

リンクをクリックするとどんなページに移るか,

どんな対話か.アンケートや掲示板のイメージ.
なお,この計画書は現時点での目標であり,
最終的に作るWebページが計画書と異なっていてもよい.


教科書

参考ウェブページ


担当TA(授業の質問はこちらへお願いします)

TAに質問などで連絡をとるときは、Ccにアドレスを加えるなどで、以下2人宛に送信してください。
また、余裕を以って連絡してください。

  • M1 草野 理沙:r1.Kusano[at]uec.ac.jp
  • M2 大岡 拓斗:t.ohka[at]uec.ac.jp


  • yoshiura[at]uec.ac.jp