質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring

Spring Framework は、Javaプラットフォーム向けのオープンソースアプリケーションフレームワークです。 Java Platform上に、 Web ベースのアプリケーションを設計するための拡張機能が数多く用意されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

2回答

628閲覧

Webページのログイン機能を作成したい

neo713

総合スコア15

Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring

Spring Framework は、Javaプラットフォーム向けのオープンソースアプリケーションフレームワークです。 Java Platform上に、 Web ベースのアプリケーションを設計するための拡張機能が数多く用意されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2018/11/10 04:23

編集2022/01/12 10:55

前提・実現したいこと

Webページにログイン機能を作成する。
クライアントサイドではHTMLとTypeScriptを用います。
画面から入力されたユーザーIDとパスワードをTypeScriptでbodyに格納します。
HttpClientのpostを用いて
第一引数=「http://localhost:8080/JAX-RSアプリケーションのルートパス/目標メソッドへのJAX-RSアプリケーションのルートパスからの相対パス」
第二引数=「画面から入力されたユーザIDとパスワードを入力した変数body」
を入れてサーバーサイドに受け渡し、サーバーサイド(java)でそれを受け取り処理をしたい。

発生している問題・エラーメッセージ

サーバーサイドに情報を送れない。

該当のソースコード

サーバーサイド

java

1package java.service.Login; 2 3import java.dto.UserInfo; 4import java.io.IOException; 5import java.io.InputStream; 6import java.io.OutputStream; 7import java.lang.annotation.Annotation; 8import java.lang.reflect.Type; 9import java.sql.SQLException; 10import java.util.HashMap; 11import java.util.Map; 12 13import javax.inject.Inject; 14import javax.servlet.http.HttpServletRequest; 15import javax.ws.rs.ApplicationPath; 16import javax.ws.rs.Consumes; 17import javax.ws.rs.GET; 18import javax.ws.rs.POST; 19import javax.ws.rs.Path; 20import javax.ws.rs.Produces; 21import javax.ws.rs.WebApplicationException; 22import javax.ws.rs.core.MediaType; 23import javax.ws.rs.core.MultivaluedMap; 24import javax.ws.rs.ext.MessageBodyReader; 25import javax.ws.rs.ext.MessageBodyWriter; 26import javax.ws.rs.ext.Provider; 27 28@ApplicationPath("Project") 29@Provider 30@Path(value="Login") 31public class LoginContoroller implements MessageBodyReader<Object>,MessageBodyWriter<Object> { 32 33 @Inject 34 private HttpServletRequest request; 35 36 @Inject 37 private LoginManegementService loginManegementService; 38 39 @Path(value = "firstLogin") 40 @POST 41 @Consumes(MediaType.APPLICATION_JSON ) 42 @Produces(MediaType.APPLICATION_JSON ) 43 public UserInfo firstlogin(UserInfo indto) throws ClassNotFoundException, SQLException { 44 indto = (UserInfo) request; 45 UserInfo returnValue = loginManegementService.firstLogin(indto); 46 return returnValue; 47 } 48}

クライアントサイドでログイン時に呼び出されるサービスクラス
bodyには以下のようなjson形式でユーザIDとパスワードが入力されている。

export interface UserInfo {
userID?:Number,
userName?:string,
userGender?:string,
userBirthday?:string,
userNote?:string,
userBlood?:string,
password?:string,
userDeleteFlag?:string
}

TypeScript

1import { HttpClient } from '@angular/common/http'; 2import { UserInfo } from './home.component.d'; 3import { Injectable } from '@angular/core' 4 5import { HomeComponent } from './home.component' 6import { Observable } from 'rxjs'; 7import { Router } from '@angular/router'; 8 9@Injectable() 10export class HomeService{ 11 userInfo; 12 constructor( 13 private http: HttpClient, 14 private router: Router 15 ){} 16 17 insertTouroku(body: UserInfo){ 18 this.router.navigate(['heroes']); 19 return this.http.post('http://localhost:8080/Project/Login/firstLogin',body); 20 } 21}

試したこと

補足情報(FW/ツールのバージョンなど)

Spring

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mosapride

2018/11/13 11:32

ブラウザでhttp://localhost:8080/Project/Login/firstLoginを叩いた場合はSpring側(Java)でどのような挙動を起こしますか?
neo713

2018/11/21 13:56

404(Not Found)エラーが出ます。また、コンソールに反応はありません。
guest

回答2

0

(回答じゃありません)

フレームワークとしてTomcatを記載されていますが、Tomcatはコンテナなので、
その上で動くフレームワークを記載した方が良いと思います。LoginContorollerというクラス
ですが、内容を見るに、生のサーブレットを使ったようなシステムではないように見られ、
何かしらのフレームワークのお作法に従ったクラスに見えますので、そのフレームワークを
書いた方が良いかと(Springとか・・・)

投稿2018/11/10 07:33

arcanum_jp

総合スコア94

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2018/11/11 23:46

質問への追記修正依頼を使いましょう
guest

0

TypeScript

1private httpOptions = { 2 headers: new HttpHeaders({ 3 'Content-Type': 'application/json' 4 }) 5}; 6 7insertTouroku(body: UserInfo) { 8 this.http.post('http://localhost:8080/Project/Login/firstLogin', body, httpOptions) 9 .subscribe(() => { 10 this.router.navigate(['heroes']); 11 }); 12}

としたらうまく送れるかもしれないです

投稿2018/11/13 06:16

teikoku-penguin

総合スコア314

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

neo713

2018/11/21 13:59

HttpClientのpostの第三引数を追加しましたが、未だに404エラーです。
teikoku-penguin

2018/11/22 01:03

第三引数を追加することがメインじゃないです 重要なのはここです .subscribe(() => { this.router.navigate(['heroes']); });
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問