常連

注目の的

自己紹介

サーブレット
```java
//フォロー登録に関するリクエストを処理するコントローラ

package servlet;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import model.FollowLogic;
import model.User;

@WebServlet("/FollowServlet")
public class FollowServlet extends ServletBase {
	private static final long serialVersionUID = 1L;

	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		// ログインユーザの取得
		User loginUser = getLoginUser(request);

		// リクエストパラメータの取得
		request.setCharacterEncoding("UTF-8");
		String sFollowId = request.getParameter("followId");
		int followId = Integer.parseInt(sFollowId);

		// フォロー処理 FOLLOWテーブルに追加
		FollowLogic logic = new FollowLogic();
		logic.execute(loginUser.getUserId(), followId);

		// フォロー完了画面にフォワード
		forward("WEB-INF/jsp/followConfirm.jsp", request, response);

	}
}

```

DAO

```java
package dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;

import model.FollowViewModel;
import util.JDBCUtils;

public class FollowDAO {

	// FOLLOWテーブルに追加する
	public void follow(int userId, int followId) {
		try (Connection conn = JDBCUtils.getConnection()) {

			String sql = "INSERT INTO FOLLOW (USER_ID, FOLLOW_ID) VALUES (?,?)";
			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {
				// INSERT文中の「?」に使用する値を設定しSQLを完成
				pStmt.setInt(1, userId);
				pStmt.setInt(2, followId);

				// INSERT文を実行
				int result = pStmt.executeUpdate();
				if (result != 1) {
					throw new RuntimeException("フォローに失敗しました。");
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
	}

	// 指定したuser_Id のフォロー数を取得
	public int getFollowCount(int userId) {
		int followCount = 0;

		try (Connection conn = JDBCUtils.getConnection()) {

			// FOLLOWテーブルからログインユーザーのフォローの数を表示
			String sql = "SELECT COUNT (*) AS FOLLOWCOUNT FROM FOLLOW WHERE USER_ID = ?";

			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {
				// INSERT文中の「?」に使用する値を設定しSQLを完成
				pStmt.setInt(1, userId);
				// SELECTを実行
				try (ResultSet rs = pStmt.executeQuery()) {

					// 1件しか返って来ないのでif文
					if (rs.next()) {
						followCount = rs.getInt("FOLLOWCOUNT");
					}
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
		return followCount;
	}

	// 指定したuser_Id のフォロワー数を取得
	public int getFollowerCount(int userId) {
		int followerCount = 0;

		try (Connection conn = JDBCUtils.getConnection()) {

			// FOLLOWテーブルからログインユーザーのフォロワーの数を表示
			String sql = "SELECT COUNT (*) AS FOLLOWERCOUNT FROM FOLLOW WHERE FOLLOW_ID = ?";

			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {

				pStmt.setInt(1, userId);
				// SELECTを実行
				try (ResultSet rs = pStmt.executeQuery()) {

					if (rs.next()) {
						followerCount = rs.getInt("FOLLOWERCOUNT");

					}
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
		return followerCount;
	}

	// 指定したuser_Idのフォロー 一覧の取得
	public List<FollowViewModel> getFollowList(int userId) {
		List<FollowViewModel> followList = new ArrayList<FollowViewModel>();

		try (Connection conn = JDBCUtils.getConnection()) {

			// フォローしたユーザーの取得（自分は表示しない）
			String sql = "SELECT USER.USER_ID AS USER_ID, USER.USER_NAME AS USER_NAME FROM USER "
					+ "INNER JOIN FOLLOW ON USER.USER_ID = FOLLOW.FOLLOW_ID " + "WHERE FOLLOW.USER_ID = ?";

			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {

				pStmt.setInt(1, userId);

				// SELECTを実行
				try (ResultSet rs = pStmt.executeQuery()) {
					// SELECT文の結果をArrayListに格納
					while (rs.next()) {
						int followUserId = rs.getInt("USER_ID");
						String followUserName = rs.getString("USER_NAME");

						FollowViewModel follow = new FollowViewModel(followUserId, followUserName);
						followList.add(follow);
					}
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
		return followList;
	}

	// 指定したuser_Idのフォロワー 一覧の取得
	public List<FollowViewModel> getFollowerList(int userId) {
		List<FollowViewModel> followerList = new ArrayList<FollowViewModel>();

		try (Connection conn = JDBCUtils.getConnection()) {

			// フォローしたユーザーの取得（自分は表示しない）
			String sql = "SELECT USER.USER_ID AS USER_ID, USER.USER_NAME AS USER_NAME FROM USER "
					+ "INNER JOIN FOLLOW ON USER.USER_ID = FOLLOW.USER_ID " + "WHERE FOLLOW.FOLLOW_ID = ?";

			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {

				pStmt.setInt(1, userId);

				// SELECTを実行
				try (ResultSet rs = pStmt.executeQuery()) {
					// SELECT文の結果をArrayListに格納
					while (rs.next()) {
						int followerUserId = rs.getInt("USER_ID");
						String followerUserName = rs.getString("USER_NAME");

						FollowViewModel follower = new FollowViewModel(followerUserId, followerUserName);
						followerList.add(follower);
					}
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
		return followerList;
	}

	// フォローを解除する
	public void followDelete(int userId, int followId) {
		try (Connection conn = JDBCUtils.getConnection()) {

			String sql = "DELETE FROM FOLLOW WHERE USER_ID = ? AND FOLLOW_ID = ?";
			try (PreparedStatement pStmt = conn.prepareStatement(sql)) {
				// INSERT文中の「?」に使用する値を設定しSQLを完成
				pStmt.setInt(1, userId);
				pStmt.setInt(2, followId);

				// INSERT文を実行
				int result = pStmt.executeUpdate();
				if (result != 1) {
					throw new RuntimeException("フォロー解除に失敗しました。");
				}
			}
		} catch (Exception e) {
			throw new RuntimeException(e);
		}
	}

}

```

JSP
```java

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>どこつぶ</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/style.css">
</head>
<body>
	<jsp:include page="header.jsp"/>
	<div id="name-bar">
		<p class="name">
			<c:out value="${loginUser.userName}" />
		</p>
		<a href="${pageContext.request.contextPath}/FollowList" class="follow-font">フォロー</a>
		<a class=follow-count>
			<c:out value="${countData.followCount}" /> 
		</a>
		<br>
		<a href="${pageContext.request.contextPath}/FollowerList" class="follow-font">フォロワー</a>
		<a class=follow-count>
			<c:out value="${countData.followerCount}" />
		</a>
		<br>
		<a href="${pageContext.request.contextPath}/FavoriteList" class="follow-font">お気に入り</a>
		<a class=follow-count>
			<c:out value="${countData.favoriteCount}" />
		</a>
		<form action="${pageContext.request.contextPath}/Main" method="post">
			<textarea name="text" rows="6" class="tweet-form" placeholder="つぶやく内容を入力してください。"></textarea>
			<br> <input type="submit" value="つぶやく" class="tweet-button">
		</form>
		<c:if test="${not empty errorMsg}">
			<p>${errorMsg}</p>
		</c:if>
	</div>
	<div id="tweet-bar">
		<p class=tweet-title>＜つぶやき一覧＞</p>
		<c:forEach var="mutter" items="${mutterList}">
			<p class="tweet-user-name">
				<c:out value="${mutter.userName}" />
			</p>
			<pre class="tweet"><c:out value="${mutter.text}" />
			</pre>
			<div class=follow>
				<form action="${pageContext.request.contextPath}/FavoriteServlet"
					method="post">
					<input type="hidden" name="tweetId" value="${mutter.tweetId}">  
					<input type="submit" value="お気に入り登録する" class="follow-button">
				</form>
			</div>
		</c:forEach>
	</div>
	<div id="user-bar">
		<p class=user-list-title>＜オススメユーザー＞</p>

		<c:forEach var="user" items="${userList}">
			<p class="user-list-name">
			<div class=user>
				<form action="${pageContext.request.contextPath}/OtherUsersServlet"
					method="post">
					<input type="hidden" name="followId" value="${user.userId}">
					<input type="submit" value="${user.userName}" class="user-list-name">
				</form>
			</div>
			<div class=follow>
				<form action="${pageContext.request.contextPath}/FollowServlet"
					method="post">
					<input type="hidden" name="followId" value="${user.userId}">
					<input type="submit" value="フォローする" class="follow-button">
				</form>
			</div>
		</c:forEach>
	</div>
</body>
</html>

```


現在フォローした人にもフォローするボタンが表示されるのですが
フォローした人にはフォロー解除ボタンを表示させたいのですが
サーブレットにどのようなif文を書けばいいのでしょうか？？

フォローした人はフォロー解除ボタンを表示させたい

Wordpressの有償テンプレートを使ってWebサイトを作成しています。
その際に、GoogleMAPを表示させるべく、APIキーをWordpressの管理画面に登録をしたのですが、全く表示がされません。
Google MAPを表示させたいです。

■使用しているWordpressテンプレ―ト
http://tcd-wp.net/tcd028/

■使用しているAPI
Maps JavaScript API


　------

Wordpressの管理画面では、APIキーのみを入力すればよいようになっています。
対象となるWebサイトページで、コンソールを開いたときに、最初は「RefererNotAllowedMapError」に関するエラーが出ていましたが、それは何とか解決ができました。

再度、サイトをリロードすると別のエラーが出ました。
このエラーの対処の仕方が分かりません。

### 発生している問題・エラーメッセージ

```

Geocoding Service: This API project is not authorized to use this API. 
 For more information on authentication and Google Maps JavaScript API services please see: 
https://developers.google.com/maps/documentation/javascript/get-api-key

```


### 試したこと

・メッセージ内記載のURLにアクセスしたが、「APIの設定方法」についてのページのようだったので今回の事象には参考にならないと判断。
・いろいろな記事を見たところ、エラーメッセージ「This API project is not authorized to use this API.」
は、APIキーが有効になっていないからだ、という記事を読んだが、APIは「有効」になっているので、これも原因ではないと判断。
・Google Caoud Platformのダッシュボード上部には「Maps JavaScript API　■無効にする」と表示されているので、ステイタスは「有効」であると判断。　

### 

以上です。

・どこを見て
・何をすればよいか

分からない状況です。

分かる方、ご教示いただけますと助かります。

Google MAP APIでのエラーが消せない

#目的
javascriptで全角英数字を半角英数字に変換するアプリを作ろうとしています．
replaceメソッドを使って全角文字を半角文字に変換しようとしているのですが，"replace is not a function"とエラーが出てしまいます．

なぜこのようなエラーが出てしまうのか，また解決方法を教えていただきたいです．
よろしくお願いいたします．

#エラーメッセージ
Uncaught TypeError: text.replace is not a function
    at HTMLButtonElement.<anonymous> (main.js:6)
(anonymous) @ main.js:6
#ソース
```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>全角数字 -> 半角数字</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    全角英数字を半角英数字に直します
    <table>
      <tr>
        <td><textarea id="text" rows="30" cols="80" placeholder="ここにテキストを入力"></textarea></td>
        <td>>>></td>
        <td><textarea id="result" rows="30" cols="80" placeholder="結果が表示されます"></textarea></td>
      </tr>
    </table>
    <button type="button" id="btn">実行</button>
    <script src="main.js"></script>
  </body>
</html>
```
```javascript
(function () {
  'use strict';

  document.getElementById('btn').addEventListener('click', function(){
    document.getElementById('text').value;
    text.replace(/[Ａ-Ｚａ-ｚ０-９]/g, function(s) {
      return String.fromCharCode(s.charCodeAt(0) - 65248);
    });
    document.getElementById('result').value += text;
  });

})();
```

javascriptで "replace is not a function" と出る

お世話になります。

現在サイト作成をしており、Chromeを使って進めていたところ
IEで開くと一箇所だけわずかにレイアウトがずれているということに気づきました。

調べてみると、方法としてはCSSハックやJSを読み込んだ後にブラウザごとにCSSを切り替えるなどの方法があるようですが、レイアウトを修正したいのは1箇所だけなのでJSP内でif文などが書ければそのほうが簡単かなと思いました。


XXXXXX
のような書き方はできるのでしょうか。

アドバイスなどございましたら宜しくお願い致します。

JSP内でブラウザを判定し、表示方法を切り替えることはできますか？

### 前提・実現したいこと

jspのフォーム画面の検索項目３つ(氏名、誕生月、職種)に入力された値をサーブレットで取得し、SQL文のwhere句以降に連結してmysqlデータベースのテーブル(usertable)から検索結果を取得したいです。

条件：
① JDBCのPreparedStatementを利用する
② AND検索をする
③ 検索項目が空欄の場合は、その項目は絞り込み対象外とする。
④ 全て空欄の場合、全レコードを取得する

上記条件③のせいで、

「SQL文の生成方法」
「SQL文の"?"に割り当てるパラメータインデックス値の決め方」

について分からなくて悩んでいます。

### 該当のソースコードの一部

```JAVA
　　　　　Connection con = null;
        PreparedStatement st = null;
        try{
            con = 省略;
            
            String sql = "SELECT * FROM usertable";
            boolean flag = false;
　　　　//名前が入力されていればwhere句で連結、されなければスキップ
            if (!user.getName().equals("")) {
                sql += " WHERE name like ?";
                flag = true;
            }
　　　　//誕生月が入力されていれば処理を実施
            if (user.getBirthday()!=null) {
　　　　　//名前が入力されていなかった場合はWHERE、されていたらAND
                if(!flag){
                    sql += " WHERE birthday like ?"; //名前が空欄の時はこの?が1番目
                    flag = true;
                }else{
                    sql += " AND birthday like ?"; //名前が入力されればこの?は2番目
                }
            }
　　　　//職業が入力されていれば処理を実施
            if (user.getType()!=0) {
　　　　　//名前も誕生月も空欄だった場合はwhere、どちらかもしくは両方入力されていたらAND
                if(!flag){
                    sql += " WHERE type like ?";
                }else{
                    sql += " AND type like ?";
                }
            }
            st =  con.prepareStatement(sql);
            st.setString(★1, "%"+user.getName()+"%");
            st.setString(★2, "%"+ new SimpleDateFormat("yyyy").format(user.getBirthday())+"%");
            st.setInt(★3, user.getType());
```

### 分からないこと

①　入力項目の有無によってSQL文を連結していく方法はこれで良いのでしょうか？ ifがネストになっている点がとても拙く感じるのですが・・・。

②　★で示す、?に対応するパラメータインデックス値はどのように決めればよいでしょうか。
具体的に悩む点は、名前だけ空欄の場合、名前も誕生月も空欄の場合、誕生月だけ空欄の場合などどこが空欄のまま検索されるかで?の個数も変わるので、例えば名前だけ空欄にするとインデックス範囲は2までだと怒られます。

java.sql.SQLException: Parameter index out of range (3 > number of parameters, which is 2).

?の個数が選択次第で変わる状態でどうパラメータインデックス値を当て込めばいいかがわかりません。

宜しくお願い致します。

【Java】フォームの検索項目の入力有無によってSQL文を生成してデータベースから情報取得したい

タイトル通りなのですが、（起動してからしばらく時間が経過した）
エミュレーターと(layoutにある）xmlのプレビューが
明らかレイアウトが違ってきます。

エラーも忠告もないので混乱しております。
android studio 3.0.1です。

プレビューでは画像とボタンが表示されるのですが、
エミュレーターではボタンしか表示されず、ボタンもButton1と勝手に定義されています。
![イメージ説明](993eab97eaeec4d185002de75c5bb7c2.png)
回答お願いします。
###
OmikujiActivity.java
```
package jp.wings.nikkeibp.omikuji;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;

import java.util.Random;

public class OmikujiActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.omikuji);
```
###
omikuji.xml
```
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="192dp"
        android:layout_height="400dp"
        android:contentDescription="@string/omikuji"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/omikuji" />

    <Button
        android:id="@+id/btn_event"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:text="@string/button1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.501"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView"
        tools:text="おみくじを始める" />
</android.support.constraint.ConstraintLayout>
```
###
strings.xml
```
<resources>
    <string name="app_name">おみくじ</string>
    <string name="btn_event">占いを始めます</string>
    <string name="omikuji">Omikuji</string>
    <string name="button1">Button1</string>

</resources>

```