[JAVA] Ich habe versucht, eine Webanwendung zu erstellen, die Tweets mit einer Vue-Word-Cloud durchsucht und die Tendenz untersucht, was im zugehörigen Profil geschrieben steht

Es ist das, was Sie oft sehen.

Ich werde Ihnen das Ergebnis zuerst für diejenigen zeigen, die sagen, was es ist.

Wenn Sie nach einem Tweet nach einem Suchwort suchen, wird das Wort des Profils der Person, die den Treffer getwittert hat, in der Tag-Cloud von Word Cloud angezeigt.

Zeichen, die häufig angezeigt werden, sind größer.

Es scheint einfach zu machen, aber wenn ich es nachschlage, ist es meistens Python.

Im Moment entwickle ich mit Vue.js und Java (Spring Boot), also dachte ich, ich könnte es damit schaffen, also habe ich eine kleine Webanwendung erstellt.

Diesmal ist es nicht der Inhalt des Tweets, aber der Inhalt des Profils wird aus dem Inhalt des Tweets gezogen, so dass dies möglicherweise etwas schwierig ist.

Tage für die Erstellung von Webanwendungen: 2 Tage Qiita Artikelerstellung: 2 Tage

Die Erstellung von Qiita-Artikeln ist schwieriger.

Warum endete der Titel so lange?

Der Betriebsablauf der Webanwendung ist wie folgt.

Es fühlt sich an, als würde man einen Satz in Wörter aufteilen, aber ich weiß nicht viel mehr, also bin ich sicher, dass Sie damit besser vertraut sind.

2. Umwelt

Vue.js：2.6.12 Spring Boot：v2.3.3 Java：AdoptOpenJDK：11.0.6 Kuromoji：0.9.0 vue-wordcloud：1.1.1 axios：0.20.0

Vue.js ist die Front und Spring Boot ist die serverseitige API ohne jegliche Disziplin.

Die grobe Verzeichnisstruktur sieht so aus.

┠ src
┃  ┗ main
┃     ┗ java/app/myapp
┃        ┠ common
┃        ┃  ┗ HttpAccess.java
┃        ┠ controller
┃        ┃  ┗ TwitterAnalysisRestController.java
┃        ┠ entity
┃        ┃  ┗ VueWordCloudEntity.java
┃        ┠ service
┃        ┃  ┗ TwitterAnalysisService.java
┃ Verschiedene
┃
┠ web
┃ ┠ Verschiedene
┃  ┠ src
┃ ┃ ┠ Verschiedene
┃  ┃  ┠ router
┃　┃  ┃  ┗ index.js
┃  ┃  ┠ views
┃  ┃  ┃  ┗ TwitterAnalysis.vue
┃  ┃  ┃
┃ ┃ Verschiedene
┃ Verschiedene
┃
┠ build.gradle
verschiedene

3. Vorgehensweise

3-1. Voraussetzung

Ein Spring Boot-Projekt wurde erstellt.

3-2. Twitter API-Verwendungsanwendung

Zunächst müssen Sie die Verwendung der Twitter-API auf der Twitter-Seite beantragen.

Es wird davon ausgegangen, dass Sie einen Twitter-Account haben.

Es gibt eine Website, die freundlicherweise erklärt wird. Bitte beachten Sie dies, wenn Sie sich für die Verwendung bewerben. Detaillierte Erklärung vom Beispielsatz der Twitter-API-Verwendungsanwendung der Version 2020 bis zum Erwerb des API-Schlüssels

Die Informationen ändern sich von Tag zu Tag, sodass sie sich möglicherweise geändert haben, aber wahrscheinlich einfacher sein sollten.

Alles was Sie tun müssen, ist ein paar Fragen von der Twitter-Seite zu beantworten.

Auf jeden Fall ist der Anwendungsbildschirm gezwungen, auf Englisch zu schreiben, aber tatsächlich kann es auf Japanisch sein ...

Als ich die Frage beantwortete, dachte ich, ich warte auf die Genehmigung ... aber das war nicht der Fall, und ich konnte sofort zum Anzeigebildschirm Token (Bearer Token) wechseln.

Alles was Sie tun müssen, ist dieses Token und den Schlüssel zu kopieren.

Es scheint, dass es vor einiger Zeit mehrere Tage gedauert hat, bis die Genehmigung vorliegt.

3-3. Java-Implementierung

Holen Sie sich zunächst Profilinformationen über die Twitter-API.

Es scheint praktisch, eine Bibliothek namens Twitter4J zu verwenden, aber ich habe sie diesmal nicht verwendet.

Es gibt keinen besonderen Grund.

Die API-URL sieht folgendermaßen aus.

Es scheint, dass die API kürzlich aktualisiert wurde.

https://api.twitter.com/2/tweets/search/recent?expansions=author_id&user.fields=description&max_results=100&query=<Suchbegriff>

Weitere Informationen finden Sie unter Offizielle Website.

Das Abrufen von Informationen mithilfe der API ist also wie folgt.

Geben Sie für das Token das oben erhaltene Inhaber-Token an.

TwitterAnalysisService.java

String urlString = "https://api.twitter.com/2/tweets/search/recent?expansions=author_id&user.fields=description&max_results=100";

String method = "GET";
String bearerToken = <Zeichen>;

HttpAccess httpAccess = new HttpAccess();
String response = httpAccess.requestHttp(urlString, method, bearerToken, <Suchbegriff>);

HttpAccess.java

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.io.UnsupportedEncodingException;
import java.net.HttpURLConnection;
import java.net.URL;
import java.net.URLEncoder;

public class HttpAccess {

    public String requestHttp(String urlString, String method, String bearerToken, String query) {

        String result = null;
        String urlStringFull = null;

        if (query == null || query.isEmpty()) return result;

        try {
            urlStringFull = urlString + "&query=" + URLEncoder.encode(query, "UTF-8");
        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
        }

        if (urlStringFull == null) return result;
        
        HttpURLConnection  urlConn = null;
        InputStream in = null;
        BufferedReader reader = null;

        try {

            URL url = new URL(urlStringFull);

            urlConn = (HttpURLConnection) url.openConnection();
            urlConn.setRequestMethod(method);
            urlConn.setRequestProperty("Authorization","Bearer " + bearerToken);
            urlConn.connect();

            int status = urlConn.getResponseCode();
            if (status == HttpURLConnection.HTTP_OK) {

                in = urlConn.getInputStream();
                    
                reader = new BufferedReader(new InputStreamReader(in));
                
                StringBuilder output = new StringBuilder();
                String line;
                
                while ((line = reader.readLine()) != null) {
                    output.append(line);
                }

                result = output.toString();
            }
        } catch (IOException e) {
            e.printStackTrace();
		} finally {
			try {
				if (reader != null) {
					reader.close();
				}
				if (urlConn != null) {
					urlConn.disconnect();
				}
			} catch (IOException e) {
                e.printStackTrace();
			}
        }
        
        return result;
    }
}

Als nächstes folgt die morphologische Analyse. Wenn Sie dies in Java tun möchten, ist Kuromoji praktisch.

Fügen Sie einfach eine Zeile zur Datei build.gradle hinzu.

build.gradle

dependencies {
~ Abkürzung ~
    implementation 'com.atilika.kuromoji:kuromoji-ipadic:0.9.0'
~ Abkürzung ~
}

Was das Format für die Rückgabe der Daten betrifft, werden "Name" und "Wert" als Schlüssel verwendet, da vue-wordcloud das Array von Objekten mit "Name" und "Wert" als Schlüssel in der Ansicht behandelt. Gibt ein Array von Objekten in JSON zurück.

• Schlüsselname kann geändert werden

Geben Sie das Wort als Ergebnis der morphologischen Analyse in "Name" ein und geben Sie an, wie oft das Wort in "Wert" vorkommt.

Dieses Mal wurde zusätzlich zum Zugriff auf die obige API eine morphologische Analyse durchgeführt, um ein Objekt mit "Name" und "Wert" in den folgenden Feldern zu erstellen.

Verwenden Sie die Tokenizer-Klasse für die morphologische Analyse.

TwitterAnalysisService.java

import java.util.ArrayList;
import java.util.List;
import java.util.stream.Collectors;

import com.atilika.kuromoji.ipadic.Token;
import com.atilika.kuromoji.ipadic.Tokenizer;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.JsonNode;
import com.fasterxml.jackson.databind.ObjectMapper;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import app.myapp.common.HttpAccess;
import app.myapp.entity.VueWordCloudEntity;

@Service
public class TwitterAnalysisService {

    public List<VueWordCloudEntity> analysisTwitterProfileByQuery(String query) {

        List<VueWordCloudEntity> result = new ArrayList<>();

        String urlString = "https://api.twitter.com/2/tweets/search/recent?expansions=author_id&user.fields=description&max_results=100";

        String method = "GET";
        String bearerToken = <Zeichen>;

        HttpAccess httpAccess = new HttpAccess();
        String response = httpAccess.requestHttp(urlString, method, bearerToken, query);

        if (response == null) return result;

        ObjectMapper mapper = new ObjectMapper();
        JsonNode root = null;

        try {
            root = mapper.readTree(response);
        } catch (JsonProcessingException e) {
            e.printStackTrace();
        }

        if (root == null || root.get("meta").get("result_count").asInt() == 0) {
            return result;
        }

        Tokenizer tokenizer = new Tokenizer();
        List<Token> tokens = new ArrayList<>();

        JsonNode users = root.get("includes").get("users");

        for(int i = 0; i < users.size(); i++) {
            if (users.get(i).get("description") != null) {
                tokens.addAll(tokenizer.tokenize(users.get(i).get("description").asText()));
            }
        }

        List<VueWordCloudEntity> vueWordCloudEntityList = new ArrayList<>();
        tokens.stream()
                .filter(x -> x.getPartOfSpeechLevel1().equals("Substantiv"))
                .map(x -> x.getSurface())
                .collect(Collectors.groupingBy(x -> x, Collectors.counting()))
                .forEach((k, v) -> {
                    VueWordCloudEntity vueWordCloudEntity = new VueWordCloudEntity();
                    vueWordCloudEntity.setName(k);
                    vueWordCloudEntity.setValue(v);
                    vueWordCloudEntityList.add(vueWordCloudEntity);
                });

        result = vueWordCloudEntityList;
            
        return result;
    }
}

VueWordCloudEntity.java

import lombok.Data;

@Data
public class VueWordCloudEntity {

    private String name;
    private Long value;
}

TwitterAnalysisRestController.java

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import lombok.RequiredArgsConstructor;
import app.myapp.entity.VueWordCloudEntity;
import app.myapp.service.TwitterAnalysisService;

@RestController
@RequiredArgsConstructor
@RequestMapping("/api")
public class TwitterAnalysisRestController {

    @Autowired
    private TwitterAnalysisService twitterAnalysisService;

    @GetMapping("/twitter/analysis/profile/by/{query}")
    public ResponseEntity<List<VueWordCloudEntity>> analysisTwitterProfileByQuery(
            @PathVariable String query) {

        List<VueWordCloudEntity> result
                = twitterAnalysisService.analysisTwitterProfileByQuery(query);

        //CORS kompatibel hier für Test-App
        HttpHeaders headers = new HttpHeaders();
        headers.add("Access-Control-Allow-Credentials", "true");
        headers.add("Access-Control-Allow-Origin", "http://localhost:<Vue.js Ausführungsumgebung Portnummer>");

        return new ResponseEntity<>(result, headers, HttpStatus.OK);
    }
}

Ich bin sicher, es gibt einen einfacheren Weg, wenn Sie Twitter4J nicht in Java verwenden!

Ich bin sicher, dass es irgendwo eine solche Probe gibt.

Leider war es diesmal meine Probe.

• Entschuldigen Sie, dass der Quellcode Vorrang vor "Arbeit" hat ...

3-4. Implementierung von Vue.js

Dies ist einfach, da Sie einfach vue-wordcloud installieren und die offizielle vue-wordcloud-Quelle kopieren und einfügen.

Erstellen Sie ein Projekt mit der Benutzeroberfläche von vue-cli und platzieren Sie es an der Position der obigen Verzeichnisstruktur.

Installieren Sie dann die vue-word cloud mit der vue-cli-GUI.

Oh, und Axios auch.

Kopieren Sie anschließend das offizielle Beispiel und fügen Sie es ein, korrigieren Sie es ein wenig und rufen Sie die Daten von der Spring Boot-API ab.

TwitterAnalysis.vue

<template>
    <div id="twitter-analysis">
        <input v-model="query" placeholder="Bitte geben Sie ein Schlüsselwort ein" style="width:400px;">
        <button @click="analyzeProfile" style="margin-left:10px;">Analyse</button>
        <wordcloud
            :data="analyzedWords"
            nameKey="name"
            valueKey="value"
            color="Accent"
            :showTooltip="true"
            :wordClick="wordClickHandler">
        </wordcloud>
    </div>
</template>

<script>
import wordcloud from 'vue-wordcloud'
import axios from 'axios'
axios.defaults.withCredentials = true

export default {
    name: 'TwitterAnalysis',
    components: {
        wordcloud
    },
    data() {
        return {
            query: '',
            analyzedWords: [],
        }
    },
    methods: {
        wordClickHandler(name, value, vm) {
            console.log('wordClickHandler', name, value, vm);
        },
        analyzeProfile: async function () {
            if (this.query == null || this.query === '') return
            await axios.get('http://localhost:<Portnummer der Spring Boot-Ausführungsumgebung>/api/twitter/analysis/profile/by/'
                    + encodeURIComponent(this.query))
                .then(res => {
                    if (res.data != null) {
                        this.analyzedWords = res.data
                    }
                })
                .catch(err => {
                    alert(err + 'Dies ist ein Fehler.')
                })
        },
    },
}
</script>

router/index.js

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'TwitterAnalysis',
    component: () => import(/* webpackChunkName: "twitteranalysis" */ '../views/TwitterAnalysis.vue')
  },
]

const router = new VueRouter({
  mode: 'history',
  routes
})

export default router

mit diesem http: // localhost: <Portnummer der Ausführungsumgebung von Vue.js> / ` Zugreifen.

Wenn Sie ein Suchwort eingeben und die Analysetaste drücken

Erfolg! Sollte tun.

Wenn Sie es sich ansehen, gibt es Wörter, die keine Rolle spielen, wie z. B. Schrägstrich und http. Ich bin also sicher, dass Sie diese ausschließen werden.

Ich habe mich gefragt, ob diese App einige interessante Trends zeigen könnte, aber ich verstehe das nicht wirklich!

Erstens fühlt es sich so an.

Es scheint, dass Sie viel lernen müssen ...