Java EE i MS SQL Server w Eclipse

Czyli jak połączyć się w języku programowania Java z serwerem bazodanowym SQL Server.

Konfiguracja SQL Server:

1. W Configuration Manager włączyć protokół TCP/IP dla serwera.

2. Stworzyć użytkownika z możliwością logowania do bazy:

CREATE LOGIN user_name WITH PASSWORD='***';
CREATE USER user_name FOR LOGIN user_name;

3. Stworzyć bazę danych, której właścicielem jest powyższy użytkownik (Database Properties/Files/Owner).

4. Sprawdzić poprawność logowania.

Eclipse Java IDE for Web Developers:

1. Otworzyć narzędzie Data Source Explorer (Window/Show View/Other/Data Source Explorer)

2. Utworzyć połączenie (Database Connections/New/SQL Server/Microsoft SQL Server 2008 JDBC Driver/Jar List/Clear All). Dodać ściągnięty najnowszy sterownik sterownik JAR. Ustawić nazwę użytkownika i hasło. Zmienić nazwę sterownika na inną. Przetestować połączenie.

Projekt aplikacji:

1. Stworzyć nowy dynamiczny webowy projekt. Określić środowisko wykonawcze, np. Apache Tomcat. Zaznaczyć generuj web.xml. Po utworzeniu projektu wrzucić sterownik, przykładowo o nazwie sqljdbc.jar do /WEB-INF/lib. Utworzyć dwie klasy: Polaczenie.java:

package pl.polaczenie;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;

public class Polaczenie {
	
	private Connection connection;
	private String userName = "user_name";
	private String password = "password";
	private String url = "jdbc:sqlserver://localhost:1433;databaseName=base_name";
	
	public Polaczenie() {
		try {
			connection = DriverManager.getConnection(url, userName, password);
		} catch (SQLException e) {
			e.printStackTrace();
		}
	}
	public Connection getConnection() {
		return connection;
	}

}

i PolaczenieTest.java:

package pl.test;

import static org.junit.Assert.assertNotNull;

import org.junit.jupiter.api.Test;

import pl.polaczenie.Polaczenie;

public class PolaczenieTest {
	
	Polaczenie polaczenie = new Polaczenie();
	
	@Test
	public void checkConnection() {
		assertNotNull(polaczenie.getConnection());
	}
}

Odpowiednio należy wstawić nazwę użytkownika, hasło i nazwę bazy danych. Uruchomić jako testy jednostkowe. Jeżeli nie ma błędów mamy poprawne połączenie aplikacji z bazą. I można zacząć tworzyć aplikację webową.

Zabezpieczenie plików serwera www – .htaccess i .htpasswd

Poniższa metoda jest przeznaczona dla systemu Windows, ale dla Linux-a jest bardzo podobna.

.htpasswd :

Otwieramy wiersz polecenia i przechodzimy do lokalizacji pliku wykonalnego htpasswd, jest to zazwyczaj ~\apache\bin.

Tworzymy plik .htpasswd za pomocą komendy:

htpasswd -bc .htpasswd username password

Gdzie argument -b odpowiada za podanie hasła z linii poleceń, -c za stworzenie nowego pliku. W miejsce username i password wstawiamy odpowiednie wartości.

Dla bezpieczeństwa umieszczamy plik .htpasswd w lokalizacji innej niż pliki www.

.htaccess :

Tworzymy plik z rozszerzeniem .htaccess i umieszczamy go w folderze z plikami www. W celu ochrony całego folderu umieszczamy w nim:

AuthUserFile [sciezka]\.htpasswd
AuthType Basic
AuthName "Zaloguj się, aby uzyskać dostęp do folderu"
require valid-user

Gdzie ścieżka to ścieżka dostępu do naszego pliku.

HTML, CSS i JavaScript: przykładowy kod strony

Poniżej przedstawiam przykładowe zastosowanie tych języków w utworzeniu prostej strony www. Składa się z czterech plików dostępnych poniżej.

 

Plik index.html:

<!DOCTYPE html>
<html>
<head>
<title>Menu</title>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="skrypt.js"></script>
</head>
<body>
<div id="menu">
<ul>Kurs: 
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</div>
<div id="srodek">
Strona z odrobiną HTML-a, CSS-a i JavaScript. Kliknij na podkreślony tekst, a zmieni on kolor: <div onclick="zmiana(this);" class="czarny" id="podkreslonyDiv">kliknij tu, a zmienię kolor.</div>
</div>
</body>
</html>

Strona jest zgodna ze specyfikacją HTML5. Składa się ze standardowej struktury znaczników: html, head, body.

W głowie dokumentu w znaczniku link umieszczamy odnośnik do zewnętrznego arkusza stylów. Dalej podobnie w znaczniku script zewnętrzny skrypt napisany w języku JavaScript.

W ciele dokumentu znajduje się menu w postaci listy nieuporządkowanej.

Następnie blok, który wypośrodkujemy i zastosujemy w znajdującym się w nim tekście, dynamikę strony, polegającą na wywołaniu funkcji zmiana(), która jest odpowiedzialna po kliknięciu na element o id podkreslonyDiv, za zmianę klasy tego elementu.

 

Plik style.css:

body{
background-color: #C0C0C0;
}
ul{
list-style-type:none;
background: url(menu.png) repeat-x;
font-size:23px;
width:332px;
border-radius:15px;
margin:0;
}
ul li{
display:inline;
padding:5px;
}
ul li a:hover{
background: rgb(45,75,80);
border-radius:2px;
color:white;
}
a{
text-decoration:none;
color:#303030 ;
}
#menu{
width:372px;
height:27px;
margin-left: auto ;
margin-right: auto ;
}
#srodek{
margin-top:10px;
width:700px;
margin-left: auto ;
margin-right: auto ;
border-radius:15px;
background-color:#e8edef;
padding:30px;
}
.czerwony{
color:red;
}
.czarny{
color:black;
}
#podkreslonyDiv{
text-decoration:underline;
display: inline;
cursor: pointer;
}

W liście wyłączamy style listy (wypunktowanie). Następnie podajemy lokalizację do obrazka, który posłuży za tło menu, musimy go odpowiednio rozciągnąć w poziomie. Za pomocą ul li, odpowiednio przodka i potomka, określamy, że elementy listy mają wyświetlać się w jednej linii. Pseudoklasa :hover odpowiada za czynność najechania kursorem na element łącza a, zmieniamy tu, m.in. tło i kolor. W łączu wyłączamy charakterystyczne dla linków podkreślenie tekstu.

.czerwony i .czarny odpowiednio to zdefiniowane własne klasy, każda posiada określony inny kolor.

 

Plik skrypt.js:

function zmiana(div){
if (div.className == "czarny")
div.className = "czerwony";
else
div.className = "czarny";
}

Wspomniana wcześniej funkcja zmiana() wywołana z parametrem div. Początkowo klasa div-a jest ustawiona na kolor czarny. Odpowiednio po wywołaniu funkcji ma się zmieniać na przeciwną, o odmiennym kolorze.

 

Plik menu.png (kliknij prawym przyciskiem myszy na linie pionową i kliknij zapisz jako):

 

Wszystko umieszczamy w jednym folderze i uruchamiamy plik index.html za pomocą dowolnej przeglądarki internetowej.