javascript - 无法访问 DotNetBrowser 中的窗口对象

Question

我不知道我做错了什么，我让它工作，做了一些事情，现在无法让它再次工作......对象在那里，但我无法访问它，总是以未定义的形式返回。我通过 DotNetBrowser window.SetObject() 属性将 JSON 字符串传递给 javascript...

但是，当我尝试执行 JSON.parse(window.Teams) 时，我得到以下结果:

我不确定从这里做什么...该对象显然在那里，但无法访问。我如何访问该对象？

编辑:这是.NET中的代码

Class MainWindow
    Public Shared NewGameScreen As New NewGame
    Public window As JSValue
    Public DBObj As New DBObject
    Public page As String = AppDomain.CurrentDomain.BaseDirectory()

    Sub New()
        Try
            BrowserPreferences.SetChromiumSwitches("--remote-debugging-port=9222", "--disable-web-security", "--allow-file-access-from-files")

            InitializeComponent()
            '##########################################################################
            '##########################################################################
            '################## DOTNETBROWSER INITIALIZATION ##########################
            '##########################################################################
            '##########################################################################

            'Replace the absolute path with the relative path
            page = page.Replace("bin\x86\Debug\", "Web\index.html")

            browserView1.Preferences.JavaScriptEnabled = True
            browserView1.Preferences.ImagesEnabled = True
            browserView1.Preferences.AllowRunningInsecureContent = True

            'load the page
            browserView1.Browser.LoadURL(page)

        Catch ex As Exception
            MessageBox.Show(ex.Message)
        End Try

    End Sub

    Private Sub LoadDBObjects()
        'Create the window object to pass .NET values to JS Land
        window = browserView1.Browser.ExecuteJavaScriptAndReturnValue("window")
        window.AsObject().SetProperty("Teams", DBObj.Teams)
        'window.AsObject().SetProperty("Owners", DBObj.Owners)
        'window.AsObject().SetProperty("Personnel", DBObj.Personnel)
        'window.AsObject().SetProperty("Coaches", DBObj.Coaches)
        'window.AsObject().SetProperty("Players", DBObj.Players)
        'window.AsObject().SetProperty("Draft", DBObj.Draft)

    End Sub

    Private Async Sub browserView_FinishLoadingFrameEvent(sender As Object, e As Events.FinishLoadingEventArgs)
        If e.IsMainFrame Then
            'Wait for the browser to finish loading, then load the page
            Await Task.Run(Sub()
                               LoadDBObjects()
                           End Sub) 'Initialize the DBObjects to load
            'set up debugging at http://127.0.0.1:9222
            browserView2.Browser.LoadURL(browserView2.Browser.GetRemoteDebuggingURL())
        End If
    End Sub

End Class

''' <summary>
''' Class to create the DB Objects to be used in JavaScript
''' </summary>
Public Class DBObject
    Public SQLTable As New SQLiteDataFunctions 'Create the SQLite object
    ReadOnly MyDB As String = "Football" 'set the DB Name
    Public Property Teams As String
    Public Property Owners As String
    Public Property Personnel As String
    Public Property Coaches As String
    Public Property Players As String
    Public Property Draft As String

    Public Sub New()
        'Load up the database tables
        SQLTable.LoadTable(MyDB, TeamDT, "Teams")
        SQLTable.LoadTable(MyDB, OwnerDT, "Owners")
        SQLTable.LoadTable(MyDB, PersonnelDT, "Personnel")
        SQLTable.LoadTable(MyDB, CoachDT, "Coaches")
        SQLTable.LoadTable(MyDB, PlayerDT, "RosterPlayers")
        SQLTable.LoadTable(MyDB, DraftDT, "DraftPlayers")
        CreateDBObjects()
    End Sub

    ''' <summary>
    ''' Serialize the DataTables into JSON and expose them to JS
    ''' </summary>
    Public Sub CreateDBObjects()
        'Now we need to serialize the objects for use in Javascript
        Dim Settings As New JsonSerializerSettings() 'create settings that will ensure no duplicates
        Settings.ObjectCreationHandling = ObjectCreationHandling.Replace

        Teams = JsonConvert.SerializeObject(TeamDT, Settings)
        Owners = JsonConvert.SerializeObject(OwnerDT)
        Personnel = JsonConvert.SerializeObject(PersonnelDT)
        Coaches = JsonConvert.SerializeObject(CoachDT)
        Players = JsonConvert.SerializeObject(PlayerDT)
        Draft = JsonConvert.SerializeObject(DraftDT)

        TeamDT = Nothing
        OwnerDT = Nothing
        PersonnelDT = Nothing
        CoachDT = Nothing
        PlayerDT = Nothing
        DraftDT = Nothing
    End Sub

End Class

用于获取它的 JavaScript...

//<!--GLOBAL ANGULAR-->
(function () {
    'use strict';
    angular
        .module('routerApp', ['ui.router', 'formly', 'formlyBootstrap', 'ngAnimate', 'ui.bootstrap', 'ngMessages',
            'ui.grid', 'restangular', 'formly_templates', 'nya.bootstrap.select',
            'rzModule', 'ui.mask', 'angular-3d-carousel', 'ui.grid.autoResize'])

        .service('DB', function ($q) {
            this.load = {
                isLoading: false,
                data: []
            };

            this.setIsLoading = function (value) {
                this.load.isLoading = value;
            };

            this.setData = function (data) {
                this.load.data = data;
            };

            this.getNumEnding = function (number) {
                var defer = $q.defer();
                var num = number.toString();
                var result = '';
                switch (num[num.length - 1]) { //gets the last digit of the number
                    case '1': result = 'st'; break;
                    case '2': result = 'nd'; break;
                    case '3': result = 'rd'; break;
                    default: result = 'th';
                }
                defer.resolve(result);
                return result;
            };
        })

        .service('dataService', ['$timeout', '$q', function ($timeout, $q) {
            //var fs = window.fs;
            var sql = window.SQL;

            define(function (require) {
                //fs = require('fs');
                sql = require('sql');
            });

        this.getData = function () {
            var defer = $q.defer();
            $timeout(function () {

                var DB = [];
                DB.Teams = window.Teams;
                defer.resolve(DB);
            }, 0);
            return defer.promise;
        };
    }])

    .run(function (DB, dataService) {
        DB.setIsLoading(true),
            dataService.getData(),
            //DB.setData(data);
            DB.setIsLoading(false);
    })

    .controller('loadCtrl', ["$scope", "DB", function loadCtrl($scope, DB) {
        $scope.appState = DB.load;
        $scope.Teams = DBTeams; // still not getting the Data....
        console.log(DBTeams);
    }])

    .config(['$stateProvider', '$urlRouterProvider',
    function ($stateProvider, $urlRouterProvider) {
        $urlRouterProvider.otherwise('/home');

        $stateProvider

            // HOME STATES AND NESTED VIEWS ========================================
            .state('home', {
                url: '/home',
                templateUrl: 'home.html',
                resolve: { //attempting to ensure data loads before it finishes getting the page, still not working
                    DBTeams: function () {
                        return window.Teams;
                    }
                }
            })
            //START GAME--MAIN
            .state('Start', {
                url: '/start',
                templateUrl: 'New_Game_Wizard/new_game.html',
                controller: 'newGameCtrl',
                controllerAs: 'vm'
            })
            //nested Start states--url will be Start/profile
            .state('Start.career', {
                url: '/career',
                pararms: { model: null },
                templateUrl: 'New_Game_Wizard/Start/Start-career.html',
                controller: 'careerCtrl',
                controllerAs: 'vm'
            })

            .state('Start.career2', {
                url: '/career2',
                params: { model: null },
                templateUrl: 'New_Game_Wizard/Start/Start-career2.html',
                controller: 'career2Ctrl',
                controllerAs: 'vm'
            })

            .state('Start.career3', {
                url: '/career3',
                params: { model: null },
                templateUrl: 'New_Game_Wizard/Start/Start-career3.html',
                controller: 'career3Ctrl',
                controllerAs: 'vm'
            })

            //Team Selection screen
            .state('Start.teamSelect', {
                url: '/teamSelect',
                params: { model: null },
                templateUrl: 'New_Game_Wizard/Start/Start-teamSelect.html',
                controller: 'teamSelectCtrl',
                controllerAs: 'vm'
            })

            .state('Start.single', {
                parent: 'Start',
                url: '/single',
                templateUrl: 'New_Game_Wizard/Start/Start-single.html'
            })

            .state('Start.quick', {
                parent: 'Start',
                url: '/quick',
                templateUrl: 'New_Game_Wizard/Start/Start-quick.html'
            })

            .state('Start.situation', {
                parent: 'Start',
                url: '/situation',
                templateUrl: 'New_Game_Wizard/Start/Start-situation.html'
            })

            .state('Load', {
                url: '/load',
                templateUrl: 'test.html',
                controller: 'testCtrl'
            })

            .state('Exit', {
                url: '/exit',
                templateUrl: 'exit_game.html'
            })

            .state('Main', {
                url: '/dashboard',
                templateUrl: 'Main/index.html',
                controller: 'mainCtrl',
                controllerAs: 'vm',
                lazyLoad: () => System.import('/Main/index.html')
            })

            // ABOUT PAGE AND MULTIPLE NAMED VIEWS =================================
            .state('settings', {
                // we'll get to this in a bit
            })

            .state('menu', {
            });
    }])

    .run(['$rootScope', '$state', '$stateParams',
      function ($rootScope, $state, $stateParams) {
          $rootScope.$state = $state;
          $rootScope.$stateParams = $stateParams;
      }]);
})();

Answer 1

以下示例代码解释了一般情况下如何将 JSON 字符串从 .NET 传递到 JavaScript:

window = browser.ExecuteJavaScriptAndReturnValue("window")
window.AsObject().SetProperty("myObject", New JSONString("[123, 'Hello']"))

在这种情况下，在 JavaScript 端，该 JSON 字符串将被解析并转换为适当的 JavaScript 对象。执行此类调用后，您可以通过 window.myObject 属性在 JavaScript 代码中访问该对象。

以下是相应文档文章的链接: http://dotnetbrowser-support.teamdev.com/documentation/working-with-json