Android/サンプルプログラム/HTTPサーバ/HelloHTML

HTTPサーバを起動し、簡単なHTMLを作成してブラウザで表示する

NanoHttpを使用して簡単にHTTPサーバをAndroid端末上で起動するサンプルプログラムである。
ここではNetbeansを用いた環境で説明を行う。

早く動かしたい方はNetbeansで作成したhttpHelloプロジェクトを下記からダウンロードして「プロジェクトを開く」で読み込むこと。

手順(Netbeans版)

1.新規プロジェクトで任意のAndroidプロジェクトを作成しておく。

2.以下サイトの右側の「Download ZIP」からNanoHttpをダウンロードしてくる。

3.ファイルを展開したら、以下ディレクトリからNanoHTTPD.javaがあることを確認する。
nanohttpd-master\core\src\main\java\fi\iki\elonen
∟NanoHTTPD.java

4.NanoHTTPD.javaをSource Packagesディレクトリ内のMainActivityと同じ配下にコピーする。

5.次のファイルを後述のソースからコピーする。
HelloServer.javaMainActivity.javaはNanoHTTPD.javaと同じディレクトリに配置すること。
また各ソースのpackageは任意のものに書き換えること。

6.ビルドして実行する。
Android端末に「Please access!http://<IPaddress>:8080」と表示され、
ログに何も表示されてなければ無事HTTPサーバが起動している。

7.他端末で適当なブラウザを起動し、URL欄に「http://<IPaddress>:8080」と入力して
Hello serverと名前入力欄が表示されればHTTPサーバから応答が返ってきている。
(<IPaddress>には上記6で表示されたものを入力)

8.名前を入力してEnterを押すと
Hello<名前>!と表示される。

以上。

使用するxmlおよびソース

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="nfc.sample"
     android:versionCode="1"
     android:versionName="1.0">
   <application android:label="@string/app_name" android:icon="@drawable/ic_launcher"
android:debuggable="true">
       <activity android:name="MainActivity"
                 android:label="@string/app_name">
           <intent-filter>
               <action android:name="android.intent.action.MAIN" />
               <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>
       </activity>
   </application>
   <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"></uses-permission>
   <uses-permission android:name="android.permission.INTERNET"></uses-permission>
</manifest>

Netbeansが自動で生成するマニフェストに
WIFI情報取得と、ソケット生成許可を付与する記述を追加する。
以下2行を<manifest>タグの最後に追記する。
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"></uses-permission>
<uses-permission android:name="android.permission.INTERNET"></uses-permission>
それぞれの意味はパーミッション一覧を参照してください。

strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="app_name">MainActivity</string>
   <string name="hello">Hello!HTTP</string>
</resources>

起動時に表示する文字列としてhelloに「Hello!HTTP」と設定しておく。

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   >
<TextView
  android:id="@+id/ipaddr"
   android:layout_width="fill_parent" 
   android:layout_height="wrap_content" 
   android:paddingBottom="40dp"
   />
<TextView
  android:id="@+id/hello"
   android:layout_width="fill_parent" 
   android:layout_height="wrap_content" 
   android:text="@string/hello"
   />
</LinearLayout>

レイアウトはLineLayoutを設定する。
そしてテキストビューを2つ用意しています。
1つはIPアドレス表示用、もう一つは「Hello!HTTP」表示用です。

HelloServer.java

package http.hello; //任意。配置するディレクトリに合わせてください。

import java.util.Map;

public class HelloServer extends NanoHTTPD {
  public HelloServer(int port) {
       super(port);
   }

  @Override
   public Response serve(IHTTPSession session) {
       Method method = session.getMethod();
       String uri = session.getUri();
       System.out.println(method + " '" + uri + "' ");

      String msg = "<html><body><h1>Hello server</h1>\n";
       Map<String, String> parms = session.getParms();
       if (parms.get("username") == null) {                            //①
           msg
                   += "<form action='?' method='get'>\n"
                   + "  <p>Your name: <input type='text' name='username'></p>\n"
                   + "</form>\n";                                        //②
       } else {
           msg += "<p>Hello, " + parms.get("username") + "!</p>";        //③
       }
       msg += "</body></html>\n";
       return new NanoHTTPD.Response(msg);
   }
}

HTTPサーバに端末が接続した場合に返す内容をserve()関数内に記載します。
本ソースの①の分岐でパラメータにusernameがない場合とある場合で処理が分かれます。
  • パラメータにusernameがない場合(②処理)
名前入力欄のYour name:
を表示する。
  • パラメータにusernameがある場合(③処理)
Hello, <username>!
を表示する。

名前を入力してEnterを押すとURLの末尾にusernameパラメータが追加されます。
このパラメータがある場合のみHello, <username>!を表示する処理になっています。

MainActivity.java


package http.hello; //任意。配置するディレクトリに合わせてください。

import android.app.Activity;
import static android.content.Context.WIFI_SERVICE;
import android.net.wifi.WifiManager;
import android.os.Bundle;
import android.widget.TextView;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;

public class MainActivity extends Activity {

  private static final int PORT = 8080;

  @Override
   public void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.main);
   }

  @Override
   protected void onResume() {
       super.onResume();

      TextView textIpaddr = (TextView) findViewById(R.id.ipaddr);                    //①
       WifiManager wifiManager = (WifiManager) getSystemService(WIFI_SERVICE);        //②
       int ipAddress = wifiManager.getConnectionInfo().getIpAddress();                //③
       final String formatedIpAddress = String.format("%d.%d.%d.%d", 
(ipAddress & 0xff), (ipAddress >> 8 & 0xff), (ipAddress >> 16 & 0xff), (ipAddress >> 24 & 0xff)); //④
      textIpaddr.setText("Please access! http://" + formatedIpAddress + ":" + PORT);                //⑤
       HelloServer hello = new HelloServer(PORT);                                    //⑥
       try {
           hello.start();                                                            //⑦
       } catch (IOException ex) {
           Logger.getLogger(MainActivity.class.getName()).log(Level.SEVERE, null, ex);
       }
   }

  @Override
   protected void onPause() {
       super.onPause();
   }
}

MainActivityではアプリ起動時にIPアドレス情報の取得とHTTPサーバの起動を行う。
以下ソースの説明する。
①:IPアドレスを表示するTextViewを取得する。
②:Wifimanagerを取得する。
③:WifimanagerからIPアドレスを取得する。
④:IPアドレスをint型からxxx.xxx.xxx.xxxの形式にフォーマットする。
⑤:「Please access! http://<IPaddress>:PORT」を表示する。(PORTは8080)
⑥:ポート番号8080でHTTPサーバを生成する。
⑦:HTTPサーバを起動する。(起動に失敗した場合はログにエラーを表示する)


  • 最終更新:2014-08-16 20:10:21

このWIKIを編集するにはパスワード入力が必要です

認証パスワード