Question

我试图从mysql，h2，derby数据库中获取数据，但没有任何效果。我尝试的完全像在w2schools网站上给出的那样。但后来我想我会尝试使用Array Function并在我的AngularJS页面中查看Java JSP页面来调用它。

以下是index.html：

# Simple enough, just import everything from tkinter.
from tkinter import *
import picamera
import picamera.array
import time
import threading
import io
import numpy as np

from PIL import Image, ImageTk


# Here, we are creating our class, Window, and inheriting from the Frame
# class. Frame is a class from the tkinter module. (see Lib/tkinter/__init__)
class Window(Frame):

    # Create an array representing a 1280x720 image of
    # a cross through the center of the display. The shape of
    # the array must be of the form (height, width, color)


    # Define settings upon initialization. Here you can specify
    def __init__(self, master=None):

        # parameters that you want to send through the Frame class. 
        Frame.__init__(self, master)   

        #reference to the master widget, which is the tk window                 
        self.master = master

        #with that, we want to then run init_window, which doesn't yet exist
        self.init_window()

    #Creation of init_window
    def init_window(self):

        # changing the title of our master widget      
        self.master.title("GUI")

        # allowing the widget to take the full space of the root window
        self.pack(fill=BOTH, expand=1)

        # creating a menu instance
        menu = Menu(self.master)
        self.master.config(menu=menu)

        # create the file object)
        file = Menu(menu)

        # adds a command to the menu option, calling it exit, and the
        # command it runs on event is client_exit
        file.add_command(label="Exit", command=self.client_exit)

        #added "file" to our menu
        menu.add_cascade(label="File", menu=file)


        # create the file object)
        edit = Menu(menu)

        # adds a command to the menu option, calling it exit, and the
        # command it runs on event is client_exit
        edit.add_command(label="Show Img", command=self.showImg)
        edit.add_command(label="Show Text", command=self.showText)

        #added "file" to our menu
        menu.add_cascade(label="Edit", menu=edit)

        self.trim_running_bool = False

    def showImg(self):
        self.trim_running_bool = True
        trim_thrd_thread = threading.Thread(target=self._cam_thread_def)
        trim_thrd_thread.start()
        self.update_idletasks()


    def _cam_thread_def(self):

        img_stream = io.BytesIO()
        frame_count = 0

        with picamera.PiCamera() as camera:
            camera.resolution = (400, 300)

##            while True:   ### tried it this way too
            for xxx in range(0,900):
                img_stream = io.BytesIO()
                frame_count = frame_count + 1
                print(frame_count,"   ", xxx)
                if self.trim_running_bool == False:
                    print("break")
                    break
                camera.capture(img_stream, 'jpeg', use_video_port=True)
                img_stream.seek(0)
                img_load = Image.open(img_stream)



                for xl_line in range(0,196,4):
                    img_load.putpixel((xl_line, 149), (xl_line, 0, 0))
                    xll=xl_line+2
                    img_load.putpixel((xl_line, 150), (xl_line, xl_line, xl_line))
                    img_load.putpixel((xl_line, 151), (xl_line, 0, 0))
                    (xl_line)

                for xr_line in range(208,400,4):
                    clr = 400 - xr_line
                    img_load.putpixel((xr_line, 149), (clr, 0, 0))
                    img_load.putpixel((xr_line, 150), (clr, clr, clr))
                    img_load.putpixel((xr_line, 151), (clr, 0, 0))
                    (xr_line)

                for yt_line in range(0,146,4):
                    clrt = int(yt_line * 1.7)
                    img_load.putpixel((199, yt_line), (clrt, 0, 0))
                    img_load.putpixel((200, yt_line), (clrt, clrt,  clrt))
                    img_load.putpixel((201, yt_line), (clrt, 0, 0))
                    (yt_line)

                for yb_line in range(158,300,4):
                    clrb = int((300 - yb_line) * 1.7)
                    img_load.putpixel((199, yb_line), (clrb, 0, 0))
                    img_load.putpixel((200, yb_line), (clrb, clrb, clrb))
                    img_load.putpixel((201, yb_line), (clrb, 0, 0))
                    (yb_line)


                img_render = ImageTk.PhotoImage(img_load)

                # labels can be text or images
                img = Label(self, image=img_render)
                img.image = img_render
                img.place(x=0, y=0)
                self.update_idletasks()
                img_stream.seek(0)
                img_stream.truncate(0)

                # tried these:
##                img_stream.flush()
##                print("flushed ", img_stream)
##                print("2nd ",img_stream)
##                del img_load

##
##            
##            rawCapture.truncate(0)
##            

##            rawCapture.seek(0)
##            rawCapture.truncate(0)

##            del render
##            img.image = None
##            foregnd_image = None

                (xxx)
            pass



    def showText(self):
        text = Label(self, text="Hey there good lookin!")
        text.pack()


    def client_exit(self):
        self.trim_running_bool = False
        exit()


# root window created. Here, that would be the only window, but
# you can later have windows within windows.
root = Tk()

root.geometry("400x300")

#creation of an instance
app = Window(root)


#mainloop 
root.mainloop()

以下是我的jsondata.jsp：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <style>
            table, th , td  {
            border: 1px solid grey;
            border-collapse: collapse;
            padding: 5px;
            }
            table tr:nth-child(odd) {
            background-color: #f1f1f1;
            }
            table tr:nth-child(even) {
            background-color: #ffffff;
            }
        </style>
        <script src="angular.min.js"></script>
    </head>
    <body>
        <div ng-app="myApp" ng-controller="customersCtrl">
            <table>
                <tr ng-repeat="x in names">
                    <td>{{ x.Name }}</td>
                </tr>
            </table>
        </div>
        <script>
            var app = angular.module('myApp', []);
            app.controller('customersCtrl', function($scope, $http) {
                $http.get("http://localhost:8080/pavanjsp/jsondata.jsp")
               .then(function (response) {$scope.names = response.data.records;});
            });
        </script>
    </body>
</html>

我甚至尝试将index.html作为index.jsp并在tomcat中部署。但是不起作用。甚至Php代码我已经尝试但没有工作。

请帮帮我。

Answer 1

好的，我得到了自己的答案，并感谢cyan寻求帮助。问题在于响应，更新后的代码如下：

jsaondata.jsp（托管在tomcat上）

<%@ page contentType="application/json; charset=iso-8859-1" language="java" %>

<%
    String[] names = { "Alfreds Futterkiste", "B's Beverages", "Berglunds snabbköp", "Blondel père et fils", "Bólido Comidas preparadas", "Bon app'", "Comércio Mineiro" };
    response.addHeader("Access-Control-Allow-Origin", "*");
%>
<%
    out.write("{ \"records\":[ ");
    for(int i = 0; i < names.length; i++)
    {
        if(i == (names.length - 1))
            out.write("{\"Name\":\"" + names[i] + "\"}");
        else
            out.write("{\"Name\":\"" + names[i] + "\"}, ");
    }
    out.write(" ] }");
%>

angulardata.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style>
table, th , td  {
  border: 1px solid grey;
  border-collapse: collapse;
  padding: 5px;
}
table tr:nth-child(odd) {
  background-color: #f1f1f1;
}
table tr:nth-child(even) {
  background-color: #ffffff;
}
</style>
<script src="angular.min.js"></script>
</head>
<body>

<div ng-app="myApp" ng-controller="customersCtrl">

<table>
  <tr ng-repeat="x in names">
    <td>{{ x.Name }}</td>
  </tr>
</table>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://localhost:8080/pavanjsp/jsondata.jsp")
   .then(function (response) {$scope.names = response.data.records;});
});
</script>

</body>
</html>

Answer 2

尝试将代码更改为：

$scope.names = JSON.parse(response.data).records;

如果这不起作用，请调试从服务器收到适当的json。打开一些firebug /开发人员工具（通常 f12 ）并查看网络。

打开页面并查看响应。复制并粘贴到某些json validation tool。如果JSON是正确的，那么在角度应用程序中出现问题，但我发现一切都很好。

如果配置了正确的CORS，也请检查firebug此调用。如果您收到结果200 ok，那就没关系。

您还可以使用 $ log 服务调试结果：

app.controller('customersCtrl', function($scope, $http,$log)

.then(function (response) {$log.debug('response',response);

我希望它有所帮助。

使用angular not working从本地值数组中获取数据

2 个答案: